fix(components): [popover] abnormal style when effect is dark (#10190)

element-plus · Oct 22, 2022 · dec859a · dec859a
1 parent 99fe8b2
commit dec859a
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 3 deletions.
diff --git a/packages/components/popover/style/css.ts b/packages/components/popover/style/css.ts
@@ -1,3 +1,3 @@
 import '@element-plus/components/base/style/css'
-import '@element-plus/theme-chalk/el-popover.css'
 import '@element-plus/components/popper/style/css'
+import '@element-plus/theme-chalk/el-popover.css'
diff --git a/packages/components/popover/style/index.ts b/packages/components/popover/style/index.ts
@@ -1,3 +1,3 @@
 import '@element-plus/components/base/style'
-import '@element-plus/theme-chalk/src/popover.scss'
 import '@element-plus/components/popper/style'
+import '@element-plus/theme-chalk/src/popover.scss'
diff --git a/packages/theme-chalk/src/popover.scss b/packages/theme-chalk/src/popover.scss
@@ -40,9 +40,18 @@
 
     @include when(dark) {
       @include set-css-var-value(
-        'popover-title-text-color',
+        ('popover', 'bg-color'),
+        var(#{getCssVarName('text-color', 'primary')})
+      );
+      @include set-css-var-value(
+        ('popover', 'border-color'),
+        var(#{getCssVarName('text-color', 'primary')})
+      );
+      @include set-css-var-value(
+        ('popover', 'title-text-color'),
         var(#{getCssVarName('bg-color')})
       );
+      color: getCssVar('bg-color');
     }
 
     &:focus:active,