From dec859a3dfdcaa94a813f7358902ef391a3fc96d Mon Sep 17 00:00:00 2001
From: zz <2418184580@qq.com>
Date: Sat, 22 Oct 2022 21:12:15 +0800
Subject: [PATCH] fix(components): [popover] abnormal style when effect is dark
 (#10190)

---
 packages/components/popover/style/css.ts   |  2 +-
 packages/components/popover/style/index.ts |  2 +-
 packages/theme-chalk/src/popover.scss      | 11 ++++++++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/components/popover/style/css.ts b/packages/components/popover/style/css.ts
index de241e4dae..f5af2be032 100644
--- 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
index 5b46364c67..0ff5070ae0 100644
--- 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
index b3dc0b53ff..c58918225c 100644
--- 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,