docs: update homepage and styles

docs2/components/examples/teleport/style.css

@@ -71,7 +71,7 @@
   gap: 5px;
 }
 
-.button {
+.buttons .button {
   background-color: whitesmoke;
   cursor: pointer;
   padding: 5px 10px;
@@ -82,7 +82,7 @@
   box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
 }
 
-.button:hover {
+.buttons .button:hover {
   background: black;
   color: white;
 }

docs2/components/home/Acknowledgement.vue

@@ -4,7 +4,7 @@ import Heart from '~icons/mdi/heart'
 
 <template>
   <div id="acknowledgement" class="w-full">
-    <div class="max-w-11/12 md:max-w-6/12 m-auto py-4 md:(pb-12 pt-6) text-center">
+    <div class="max-w-[1024px] md:max-w-3/4 m-auto py-4 md:(pb-12 pt-6) text-center">
       <div>
         <h1 class="md:mb-8 flex justify-center items-center"><Heart class="text-red-500" /> Acknowledgement</h1>
         <strong>First off</strong>: A big thank you to the developers of

docs2/components/home/Team.vue

@@ -0,0 +1,19 @@
+<script setup>
+import { VPTeamMembers } from 'vitepress/theme'
+
+const members = [
+  {
+    avatar: 'https://avatars.githubusercontent.com/u/78412429?v=4',
+    name: 'Burak Cakmakoglu',
+    title: 'Creator',
+    links: [{ icon: 'github', link: 'https://github.com/bcakmakoglu' }],
+  },
+]
+</script>
+
+<template>
+  <div class="w-full flex flex-col gap-4">
+    <h1 class="md:mb-8 flex justify-center items-center">Meet the Team</h1>
+    <VPTeamMembers size="small" :members="members" />
+  </div>
+</template>