docs: improve styles in dark mode

Akryum · Jun 16, 2023 · 90d9dd2 · 90d9dd2
1 parent e1f40af
commit 90d9dd2
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 5 deletions.
diff --git a/docs/.vitepress/components/DropdownMobileDemo.vue b/docs/.vitepress/components/DropdownMobileDemo.vue
@@ -51,7 +51,7 @@ export default {
 
           <div v-if="isMobile">
             <button
-              class="bg-gray-300 rounded px-4 py-2 w-full"
+              class="bg-gray-300/25 rounded px-4 py-2 w-full"
               @click="hide()"
             >
               Cancel

diff --git a/docs/.vitepress/components/DropdownPlacement.vue b/docs/.vitepress/components/DropdownPlacement.vue
@@ -30,7 +30,7 @@
 
     <select
       v-model="placement"
-      class="bg-gray-300 rounded px-4 py-2"
+      class="bg-gray-300/25 rounded px-4 py-2"
     >
       <option
         v-for="p of placements"

diff --git a/docs/.vitepress/components/TooltipPlacement.vue b/docs/.vitepress/components/TooltipPlacement.vue
@@ -16,7 +16,7 @@
 
     <select
       v-model="placement"
-      class="bg-gray-300 rounded px-4 py-2"
+      class="bg-gray-300/25 rounded px-4 py-2"
     >
       <option
         v-for="p of placements"

diff --git a/docs/.vitepress/components/theme-editor/Button.vue b/docs/.vitepress/components/theme-editor/Button.vue
@@ -23,7 +23,7 @@ export default {
         hover: 'hover:bg-red-200 hover:text-red-900',
       },
       gray: {
-        normal: 'bg-gray-300 text-gray-900',
+        normal: 'bg-gray-300/25 text-gray-900',
         hover: 'hover:bg-gray-200 hover:text-gray-900',
       },
     }

diff --git a/docs/.vitepress/theme/style.postcss b/docs/.vitepress/theme/style.postcss
@@ -3,7 +3,8 @@
 @tailwind utilities;
 
 .example {
-  @apply border-gray-300 border rounded-lg bg-gray-100 p-6 text-center;
+  @apply border-gray-500/25 border rounded-lg p-6 text-center;
+  background-color: var(--vp-c-mute);
 }
 
 .v-popper__popper {