Browse Source

style: 修改邮件部分样式

zhouyuhao 11 months ago
parent
commit
2f2115d6de

+ 1 - 1
src/styles/elementui.scss

@@ -342,7 +342,7 @@ div .el-select__placeholder.is-transparent {
   }
 }
 div.el-input__wrapper {
-  box-shadow: 0 0 0 1px var(--color-border) inset;
+  box-shadow: 0 0 0 1px var(--color-email-border) inset;
   padding-left: 8px;
 }
 div.el-input div.el-input__wrapper.is-focus {

+ 20 - 1
src/styles/theme.scss

@@ -138,6 +138,14 @@
   --dashboard-text-color: #646a73;
 
   --el-input-focus: #fff;
+
+  // 发送邮件部分
+
+  --color-email-bg: #f6f8fa;
+  --color-detail-email-record-bg: #eceef1;
+  --color-email-border: #eaebed;
+  --w-e-textarea-bg-color: #ffffff;
+  --color-divider: #eaebed;
 }
 
 :root.dark {
@@ -148,11 +156,22 @@
   --color-neutral-2: ragba(240, 241, 243, 0.7);
   --color-neutral-3: ragba(240, 241, 243, 0.3);
   --color-border: #3f434a;
-  --color-header-bg: #3f434a;
+  --color-header-bg: #30353c;
 
   // 菜单选中背景
   --color-mune-active-bg: #553d2b;
 
+  // 邮件
+  --w-e-toolbar-bg-color: var(--color-email-bg);
+  --w-e-textarea-bg-color: var(--color-email-bg);
+  --w-e-toolbar-border-color: #656f7d;
+  --w-e-toolbar-color: var(--color-neutral-1);
+  --color-email-border: #656f7d;
+  --color-email-bg: #3c414a;
+  --color-detail-email-record-bg: #343a43;
+  --color-divider: #4c515a;
+  --color-avatar: var(--color-mode);
+
   // ElementUI
   // 整体背景颜色
   --el-bg-color: #2b2f36;

+ 6 - 6
src/views/Tracking/src/components/TrackingDetail/src/components/EmailDrawer.vue

@@ -207,7 +207,7 @@ const sendEmail = () => {
         @click="handleFocusEditor"
       />
     </div>
-    <div style="border-bottom: 1px solid var(--color-border)">
+    <div style="border-bottom: 1px solid var(--color-divider)">
       <el-button
         @click="sendEmail"
         class="el-button--dark"
@@ -241,7 +241,7 @@ const sendEmail = () => {
   padding: 16px;
   border-radius: 12px;
   border-bottom: 1px solid var(--color-border);
-  background: var(--color-header-bg);
+  background: var(--color-email-bg);
 
   .show-records {
     max-height: 370px;
@@ -282,7 +282,7 @@ const sendEmail = () => {
 .text-editor {
   margin-top: 16px;
   border-radius: 6px;
-  border: 1px solid var(--color-border);
+  border: 1px solid var(--color-email-border);
   overflow: hidden;
 }
 
@@ -305,7 +305,7 @@ const sendEmail = () => {
       div {
         height: 14px;
         line-height: 14px;
-        color: #fff;
+        color: var(--color-avatar);
         font-weight: 700;
       }
     }
@@ -329,14 +329,14 @@ const sendEmail = () => {
 
   & > .content {
     padding: 16px 6px;
-    background-color: #eceef1;
+    background-color: var(--color-detail-email-record-bg);
     border-radius: 6px;
   }
 }
 
 :deep(.text-editor) {
   & > div:first-of-type {
-    border-bottom: 1px solid var(--color-border) !important;
+    border-bottom: 1px solid var(--color-email-border) !important;
   }
 }
 </style>