feat($config): Allow overriding badges colors (close #1940) (#1941)

vuejs · Oct 26, 2019 · 89a4a8d · 89a4a8d
1 parent 0e5519a
commit 89a4a8d
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 3 deletions.
diff --git a/packages/@vuepress/core/lib/client/style/config.styl b/packages/@vuepress/core/lib/client/style/config.styl
@@ -4,6 +4,9 @@ $textColor = #2c3e50
 $borderColor = #eaecef
 $codeBgColor = #282c34
 $arrowBgColor = #ccc
+$badgeTipColor = #42b983
+$badgeWarningColor = darken(#ffe564, 35%)
+$badgeErrorColor = #DA5961
 
 // layout
 $navbarHeight = 3.6rem

diff --git a/packages/@vuepress/theme-default/global-components/Badge.vue b/packages/@vuepress/theme-default/global-components/Badge.vue
@@ -34,11 +34,11 @@ export default {
   color white
   background-color #42b983
   &.tip, &.green
-    background-color #42b983
+    background-color $badgeTipColor
   &.error
-    background-color #DA5961 //#f66
+    background-color $badgeErrorColor
   &.warning, &.warn, &.yellow
-    background-color darken(#ffe564, 35%)
+    background-color $badgeWarningColor
   & + &
     margin-left 5px
 </style>
diff --git a/packages/docs/docs/config/README.md b/packages/docs/docs/config/README.md
@@ -152,6 +152,9 @@ $accentColor = #3eaf7c
 $textColor = #2c3e50
 $borderColor = #eaecef
 $codeBgColor = #282c34
+$badgeTipColor = #42b983
+$badgeWarningColor = darken(#ffe564, 35%)
+$badgeErrorColor = #DA5961
 ```
 
 ::: danger Note

diff --git a/packages/docs/docs/zh/config/README.md b/packages/docs/docs/zh/config/README.md
@@ -148,6 +148,9 @@ $accentColor = #3eaf7c
 $textColor = #2c3e50
 $borderColor = #eaecef
 $codeBgColor = #282c34
+$badgeTipColor = #42b983
+$badgeWarningColor = darken(#ffe564, 35%)
+$badgeErrorColor = #DA5961
 ```
 
 ::: danger Note