feat: darkmode for time-picker&date-picker&card

varletjs · Nov 13, 2021 · beaefdb · beaefdb
1 parent 776da40
commit beaefdb
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 2 deletions.
diff --git a/packages/varlet-ui/src/date-picker/src/day-picker-panel.vue b/packages/varlet-ui/src/date-picker/src/day-picker-panel.vue
@@ -228,7 +228,10 @@ export default defineComponent({
 
         return true
       }
-
+      const isDarkTheme = ref(false)
+      watchDarkMode((themes) => {
+        isDarkTheme.value = themes === 'darkThemes'
+      })
       const computeTextColor = (): string | undefined => {
         if (disabled) return ''
         if (computeOutline()) return color

diff --git a/packages/varlet-ui/src/date-picker/src/month-picker-panel.vue b/packages/varlet-ui/src/date-picker/src/month-picker-panel.vue
@@ -171,6 +171,11 @@ export default defineComponent({
         return true
       }
 
+      const isDarkTheme = ref(false)
+      watchDarkMode((themes) => {
+        isDarkTheme.value = themes === 'darkThemes'
+      })
+
       const computeTextColor = (): string | undefined => {
         if (disabled) return ''
         if (computeOutline()) return color

diff --git a/packages/varlet-ui/src/date-picker/src/panel-header.vue b/packages/varlet-ui/src/date-picker/src/panel-header.vue
@@ -83,7 +83,7 @@ export default defineComponent({
     watchDarkMode((themes) => {
       isDarkTheme.value = themes === 'darkThemes'
     })
-
+    
     return {
       reverse,
       showDate,