✨ Vanessa219#228 & ir color

stevapple · Apr 8, 2020 · 9b26551 · 9b26551
1 parent e8a07fc
commit 9b26551
Show file tree

Hide file tree

Showing 5 changed files with 42 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -52,6 +52,7 @@
 ### v3.0.3 / 未发布
 
 * [27](https://github.com/Vanessa219/vditor/issues/27) 支持类似 Typora 的及时渲染模式 `引入特性`
+* [228](https://github.com/Vanessa219/vditor/pull/228) menu misplaced when vditor is not first child `改进功能`
 
 ### v3.0.2 / 2020-03-19
 

diff --git a/src/assets/scss/_content.scss b/src/assets/scss/_content.scss
@@ -11,7 +11,6 @@
 
 .vditor {
   display: flex;
-  position: relative;
   flex-direction: column;
   border: 1px solid var(--border-color);
   border-radius: 3px;

diff --git a/src/assets/scss/_ir.scss b/src/assets/scss/_ir.scss
@@ -13,6 +13,31 @@
       display: inline-block;
       height: 0;
       transition: $transition;
+
+      &--heading {
+        color: var(--ir-heading-color);
+      }
+
+      &--code {
+        color: var(--ir-code-color);
+      }
+
+      &--bi {
+        color: var(--ir-bi-color);
+      }
+
+      &--link {
+        color: var(--ir-link-color);
+      }
+
+      &--bracket {
+        color: var(--ir-bracket-color);
+        text-decoration: underline;
+      }
+
+      &--paren {
+        color: var(--ir-paren-color);
+      }
     }
 
     &--expand {
@@ -25,7 +50,7 @@
   }
 
   &__link {
-    color: $blurColor;
+    color: var(--ir-bracket-color);
     text-decoration: underline;
   }
 

diff --git a/src/assets/scss/_toolbar.scss b/src/assets/scss/_toolbar.scss
@@ -16,6 +16,7 @@
 
     &__item {
       float: left;
+      position: relative;
 
       .vditor-tooltipped {
         color: var(--toolbar-icon-color);

diff --git a/src/assets/scss/index.scss b/src/assets/scss/index.scss
@@ -31,6 +31,13 @@ $transition: all .15s ease-in-out !default;
   --heading-border-color: #eaecef;
   --blockquote-color: #6a737d;
 
+  --ir-heading-color: #660e7a;
+  --ir-code-color: #808080;
+  --ir-bi-color: #000080;
+  --ir-link-color: #008000;
+  --ir-bracket-color: #0000ff;
+  --ir-paren-color: #008000;
+
   &--dark {
     --border-color: #141414;
     --second-color: rgba(185, 185, 185, .36);
@@ -52,6 +59,13 @@ $transition: all .15s ease-in-out !default;
     --code-background-color: #{rgba($blurColor, .36)};
     --heading-border-color: var(--textarea-text-color);
     --blockquote-color: var(--toolbar-icon-color);
+
+    --ir-heading-color: #9876aa;
+    --ir-code-color: #808080;
+    --ir-bi-color: #cc7832;
+    --ir-link-color: #ffc66d;
+    --ir-bracket-color: #287bde;
+    --ir-paren-color: #6a8759;
   }
 }