Refactor Dock component layout and icons

Author: Funasitien

src/components/Dock.astro

@@ -1,22 +1,19 @@
 ---
 import { Icon } from "astro-icon/components";
 ---
-<div class="w-full fixed left-0 bottom-0 p-2 md:hidden">
-   <div class="w-full bg-base-100 border-2 border-neutral-content rounded-xl dock dock-xs">
-      <a href="/" class="p-1">
-         <Icon name="gravity-ui:house" class="inline text-3xl" />
-      </a>
-      <a href="/projets" class="p-1">
-         <Icon name="gravity-ui:folder-open" class="inline text-3xl p-1" />
-      </a>
-      <a href="/blog" class="p-1">
-         <Icon name="gravity-ui:pencil" class="inline text-3xl" />
-      </a>
-      <a href="/archives" class="p-1">
-         <Icon name="gravity-ui:clock-arrow-rotate-left" class="inline text-3xl" />
-      </a>
-      <a href="/contact" class="p-1">
-         <Icon name="gravity-ui:envelope" class="inline text-3xl" />
-      </a>
-   </div>
+<div class="dock fixed md:hidden">
+  <a href="">
+    <Icon name="gravity-ui:house" class="inline text-3xl" />
+   <span class="dock-label">Home</span>
+  </a>
+  
+  <a class="dock-active">
+    <Icon name="gravity-ui:house" class="inline text-3xl" />
+   <span class="dock-label">Inbox</span>
+  </a>
+  
+  <a href="/contact">
+    <Icon name="gravity-ui:house" class="inline text-3xl" />
+   <span class="dock-label">Settings</span>
+  </button>
 </div>