Update readme and add myself page

Signed-off-by: Al Asad Nur Riyad <asadnurriyad@gmail.com>

components/main/footer.vue

@@ -3,7 +3,9 @@
     <div class="px-6 container max-w-5xl mx-auto">
       <div class="grid grid-cols-1 md:grid-cols-3">
         <div>
-          <p class="text-black text-2xl py-1 font-semibold">Al Asad Nur Riyad</p>
+          <p class="text-black text-2xl py-1 font-semibold">
+            Al Asad Nur Riyad
+          </p>
           <p class="py-2">
             Hi! I am Riyad, a Tech enthusiast, problem solver and software engineer. Currently
             working at Appscode Inc.
@@ -44,16 +46,26 @@
           </div>
         </div>
         <div class="flex flex-col my-5 md:my-0 md:justify-self-center">
-          <p class="text-black text-base font-semibold">Quick Link</p>
-          <NuxtLink to="/" class="hover:underline">Home</NuxtLink>
-          <NuxtLink to="/categories" class="hover:underline">Categories</NuxtLink>
-          <NuxtLink to="/blogs" class="hover:underline">Archive</NuxtLink>
+          <p class="text-black text-base font-semibold">
+            Quick Link
+          </p>
+          <NuxtLink to="/" class="hover:underline">
+            Home
+          </NuxtLink>
+          <NuxtLink to="/categories" class="hover:underline">
+            Categories
+          </NuxtLink>
+          <NuxtLink to="/blogs" class="hover:underline">
+            Archive
+          </NuxtLink>
           <NuxtLink to="https://www.nurriyad.xyz/" target="_blank" class="hover:underline">
             About Me
           </NuxtLink>
         </div>
         <div>
-          <p class="text-black text-base font-semibold">Connect</p>
+          <p class="text-black text-base font-semibold">
+            Connect
+          </p>
           <p>
             I have a fair amount of knowledge of Javascript, Typescript, VueJs, and Nuxt. If you
             have an interesting idea, either open source or paid let's connect.
@@ -70,9 +82,7 @@
 
       <div class="border-t mt-5 text-center p-2">
         © 2020-2022 No Right is reserved. Who cares 🤷‍♂️? It's
-        <a href="https://github.com/nurriyad/blog" target="_blank" rel="nofollow" class="underline"
-          >open source</a
-        >
+        <a href="https://github.com/nurriyad/blog" target="_blank" rel="nofollow" class="underline">open source</a>
         anyway.
       </div>
     </div>

components/main/header.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-let isDark = ref(false)
+
 </script>
 
 <template>
@@ -7,19 +7,25 @@ let isDark = ref(false)
     <div class="flex px-6 container max-w-5xl justify-between mx-auto items-baseline">
       <ul class="flex items-baseline space-x-5">
         <li class="">
-          <NuxtLink to="/" class="text-2xl text-black font-bold"> Home </NuxtLink>
-        </li>
-        <li>
-          <NuxtLink to="/categories"> Categories </NuxtLink>
+          <NuxtLink to="/" class="text-2xl text-black font-bold">
+            Home
+          </NuxtLink>
         </li>
       </ul>
-      <ul class="flex items-center space-x-3">
+      <ul class="flex items-center space-x-3 font-bold">
         <li>
-          <NuxtLink to="/blogs"> Archive </NuxtLink>
+          <NuxtLink to="/categories">
+            Categories
+          </NuxtLink>
+        </li>
+        <li>
+          <NuxtLink to="/blogs">
+            Archive
+          </NuxtLink>
         </li>
         <li title="About Me">
-          <NuxtLink to="https://www.nurriyad.xyz/" aria-label="About me">
-            <Icon size="1.2em" class="cursor-pointer" name="emojione:boy-dark-skin-tone" />
+          <NuxtLink to="/myself" aria-label="About me">
+            Myself
           </NuxtLink>
         </li>
       </ul>