fix: drawer should use box shadow instead of border

Author: dbzx10299

docs/.vitepress/components/DefaultDrawer.vue

@@ -9,7 +9,7 @@ import { Drawer } from '../../../lib'
     </Drawer.Trigger>
     <Drawer.Portal>
       <Drawer.Overlay class="fixed inset-0 bg-black/40" />
-      <Drawer.Content style="border: 1px solid #222; padding: 32px 24px 24px;" class="z-999 bg-[#0a0a0a] flex flex-col rounded-t-[10px] mt-24 h-fit fixed bottom-0 left-0 right-0 outline-none">
+      <Drawer.Content class="content z-9999 bg-[#0a0a0a] flex flex-col rounded-t-[10px] mt-24 h-fit fixed bottom-0 left-0 right-0 outline-none">
         <div class="p-4 bg-[#0a0a0a] rounded-t-[10px] flex-1">
           <div class="flex flex-col gap-[12px]">
             <Drawer.Title style="font-size: 18px; font-weight: 600;" class="font-bold mb-4 color-[#ededed]">Drawer for Vue.</Drawer.Title>
@@ -51,4 +51,9 @@ import { Drawer } from '../../../lib'
 .trigger:hover {
   background: #d4d4d4;
 }
+
+.content {
+  padding: 32px 24px 24px;
+  box-shadow: 0 0 0 1px rgba(255,255,255,0.145),0px 1px 1px rgba(0,0,0,0.02),0px 4px 8px -4px rgba(0,0,0,0.04),0px 16px 24px -8px rgba(0,0,0,0.06);
+}
 </style>

docs/.vitepress/components/Home.vue

@@ -22,9 +22,9 @@ import DefaultDrawer from './DefaultDrawer.vue'
   align-items: center;
   justify-content: center;
   flex-direction: column;
-  min-height: 60vh;
   gap: 16px;
   position: relative;
+  min-height: 75vh;
 }
 
 .wrapper-inner {
@@ -44,7 +44,7 @@ svg {
   height: 100%;
   width: 100%;
   inset: 0;
-  stroke: hsl(0 0% 10%);
+  stroke: hsl(0 0% 18%);
   max-width: 100%;
 }