Refactor/themes (#311)

* refactor: theme

src/components/ReCountTo/src/rebound/index.tsx

@@ -42,7 +42,6 @@ export default defineComponent({
       <>
         <div
           class="scroll-num"
-          // @ts-ignore
           style={{ "--i": props.i, "--delay": props.delay }}
         >
           <ul ref="ul" style={{ fontSize: "32px" }}>

src/components/ReFlowChart/src/Control.vue

@@ -102,6 +102,7 @@ onMounted(() => {
         v-for="(item, key) in titleLists"
         :key="key"
         :title="item.text"
+        class="dark:color-bg_color"
         @mouseenter.prevent="onEnter(key)"
         @mouseleave.prevent="focusIndex = -1"
       >

src/components/ReFlowChart/src/NodePanel.vue

@@ -35,7 +35,7 @@ const nodeDragNode = item => {
   <!-- 左侧bpmn元素选择器 -->
   <div class="node-panel">
     <div
-      class="node-item"
+      class="node-item dark:color-bg_color"
       v-for="item in props.nodeList"
       :key="item.text"
       @mousedown="nodeDragNode(item)"

src/components/ReIcon/src/iconifyIconOffline.ts

@@ -87,6 +87,8 @@ import Ppt from "@iconify-icons/ri/file-ppt-2-line";
 import TerminalWindowLine from "@iconify-icons/ri/terminal-window-line";
 import User from "@iconify-icons/ri/user-3-fill";
 import Lock from "@iconify-icons/ri/lock-fill";
+import MenuUnfold from "@iconify-icons/ri/menu-unfold-fill";
+import MenuFold from "@iconify-icons/ri/menu-fold-fill";
 addIcon("arrow-right-s-line", ArrowRightSLine);
 addIcon("arrow-left-s-line", ArrowLeftSLine);
 addIcon("logout-circle-r-line", LogoutCircleRLine);
@@ -112,6 +114,8 @@ addIcon("ppt", Ppt);
 addIcon("terminal-window-line", TerminalWindowLine);
 addIcon("user", User);
 addIcon("lock", Lock);
+addIcon("menu-unfold", MenuUnfold);
+addIcon("menu-fold", MenuFold);
 
 // Font Awesome 4
 import FaUser from "@iconify-icons/fa/user";
@@ -161,6 +165,9 @@ export default defineComponent({
       IconifyIcon,
       {
         icon: `${this.icon}`,
+        style: attrs?.style
+          ? Object.assign(attrs.style, { outline: "none" })
+          : { outline: "none" },
         ...attrs
       },
       {

src/components/ReIcon/src/iconifyIconOnline.ts

@@ -17,6 +17,9 @@ export default defineComponent({
       IconifyIcon,
       {
         icon: `${this.icon}`,
+        style: attrs?.style
+          ? Object.assign(attrs.style, { outline: "none" })
+          : { outline: "none" },
         ...attrs
       },
       {

src/components/ReQrcode/src/index.tsx

@@ -246,7 +246,7 @@ export default defineComponent({
             >
               <div class="absolute top-[50%] left-[50%] font-bold">
                 <IconifyIconOffline
-                  class="cursor-pointer outline-none"
+                  class="cursor-pointer"
                   icon="refresh-right"
                   width="30"
                   color="var(--el-color-primary)"

src/components/ReTable/src/bar.tsx

@@ -57,7 +57,7 @@ export default defineComponent({
         return {
           background:
             s === size.value ? useEpThemeStoreHook().epThemeColor : "",
-          color: s === size.value ? "#f4f4f5" : "#000"
+          color: s === size.value ? "#fff" : "var(--el-text-color-primary)"
         };
       };
     });
@@ -104,10 +104,10 @@ export default defineComponent({
     const reference = {
       reference: () => (
         <IconifyIconOffline
-          class="cursor-pointer outline-none"
+          class="cursor-pointer"
           icon="setting"
           width="16"
-          color="#606266"
+          color="text_color_regular"
           onMouseover={e => (buttonRef.value = e.currentTarget)}
         />
       )
@@ -117,7 +117,7 @@ export default defineComponent({
       <>
         <div
           {...attrs}
-          class="w-99/100 mt-6  pt-2 pl-2 pr-2 pb-1 bg-white"
+          class="w-99/100 mt-6 p-2 bg-white dark:bg-dark"
           v-loading={props.loading}
           element-loading-svg={loadingSvg}
           element-loading-svg-view-box="-10, -10, 50, 50"
@@ -134,10 +134,10 @@ export default defineComponent({
                     placement="top"
                   >
                     <IconifyIconOffline
-                      class="cursor-pointer outline-none"
+                      class="cursor-pointer"
                       icon={isExpandAll.value ? "unExpand" : "expand"}
                       width="16"
-                      color="#606266"
+                      color="text_color_regular"
                       onClick={() => onExpand()}
                     />
                   </el-tooltip>
@@ -146,10 +146,10 @@ export default defineComponent({
               ) : undefined}
               <el-tooltip effect="dark" content="刷新" placement="top">
                 <IconifyIconOffline
-                  class="cursor-pointer outline-none"
+                  class="cursor-pointer"
                   icon="refresh-right"
                   width="16"
-                  color="#606266"
+                  color="text_color_regular"
                   onClick={() => emit("refresh")}
                 />
               </el-tooltip>
@@ -158,10 +158,10 @@ export default defineComponent({
               <el-tooltip effect="dark" content="密度" placement="top">
                 <el-dropdown v-slots={dropdown} trigger="click">
                   <IconifyIconOffline
-                    class="cursor-pointer outline-none"
+                    class="cursor-pointer"
                     icon="density"
                     width="16"
-                    color="#606266"
+                    color="text_color_regular"
                   />
                 </el-dropdown>
               </el-tooltip>