Add pseudosubs v1

index.html

@@ -106,23 +106,62 @@
 
         <div class="bg-red-950 h-screen grid grid-cols-2">
 
-            <div>
+            <div class="flex justify-center flex-col">
-                <h2 class="font-xanh text-2xl">
+
-                    PseudoSubs
+                <div class="max-w-[90%] mx-auto">
-                </h2>
+                    <h2 class="font-xanh text-4xl">
+                        PseudoSubs
+                    </h2>
+
+                    <p>
+                        <span>
+                            <a class="underline" href="https://pseudosubs-v1.araozu.dev/" target="_blank">
+                                https://pseudosubs-v1.araozu.dev/</a>
+                        </span>
+                        ·
+                        <span>
+                            <a class="underline" href="https://git.araozu.dev/fernando/pseudosubs-v1" target="_blank">
+                                Git repo
+                            </a>
+                        </span>
+                    </p>
+
+                    <img 
+                        class="rounded-xl"
+                        src="/public/img/pseudo_1.png"
+                        alt="Image of Horarios UNSA"
+                    >
+
+                    <div class="py-4">
+                        <img class="h-12 rounded-md inline-block" src="/public/icons/php.png" alt="PHP logo">
+                        /
+                        <img class="h-12 rounded-md inline-block" src="/public/icons/vue.png" alt="VueJS logo">
+                        <img class="h-12 rounded-md inline-block" src="/public/icons/sass.png" alt="Sass logo">
+                        ·
+                        <img class="h-12 rounded-md inline-block" src="/public/icons/node.png" alt="Node logo">
+                        <img class="h-12 rounded-md inline-block" src="/public/icons/ts.png" alt="TS logo">
+                        <img class="h-12 rounded-md inline-block bg-white p-1" src="/public/icons/express.png" alt="Express logo">
+                        ·
+                        <img class="h-12 rounded-md inline-block bg-white" src="/public/icons/mysql.png" alt="MySQL logo">
+                    </div>
+                </div>
             </div>
 
-            <div>
+            <div class="flex justify-center flex-col">
-                <p>
+                <p class="my-2">
                     Between 2017 & 2019 I became interested in fansubbing anime. I made a website
-                    where you could download the subtitles for the anime.
+                    where you could download subtitles for anime.
                 </p>
-                <p>
+                <p class="my-2">
-                    The website was made in PHP, although most of the pages were static.
+                    The website was first made in PHP, although most of the pages were static.
                     At the time I didn't know about databases, so I made my own file based database,
-                    with a custom format in PHP.
+                    with a custom format in PHP. Unfortunately I lost the code for this version.
                 </p>
-                <p>
+                <p class="my-2">
+                    I later remade the website in VueJS and Express. I also learned about databases
+                    and used MySQL.
+                </p>
+                <p class="my-2">
                     I also learned about domain names, A/AAAA/CNAME records, shared hosting &
                     integrating with external services like analytics & disqus.
                 </p>