fix(ui): nav button bullet border color

carlosrojaso · Jun 10, 2018 · aee5c93 · aee5c93
1 parent 9aec563
commit aee5c93
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/packages/@vue/cli-ui/src/components/ProjectNavButton.vue b/packages/@vue/cli-ui/src/components/ProjectNavButton.vue
@@ -78,7 +78,8 @@ export default {
 <style lang="stylus" scoped>
 @import "~@/style/imports"
 
-$bg = darken($vue-ui-color-dark, 70%)
+$bg = $vue-ui-color-light-neutral
+$bg-dark = $vue-ui-color-dark
 
 .project-nav-button
   position relative
@@ -91,7 +92,7 @@ $bg = darken($vue-ui-color-dark, 70%)
     bottom 12px
     left 27px
     pointer-events none
-    border solid 2px $vue-ui-color-dark
+    border solid 2px $bg
     transition border-color .1s
     &.type-info
       background $vue-ui-color-info
@@ -105,6 +106,8 @@ $bg = darken($vue-ui-color-dark, 70%)
       background $vue-ui-color-accent
     &.type-dim
       background $md-grey
+    .vue-ui-dark-mode &
+      border-color $bg-dark
 
   .wide &
     .bullet
@@ -113,9 +116,13 @@ $bg = darken($vue-ui-color-dark, 70%)
   &:hover
     .bullet
       border-color lighten($bg, 25%)
+      .vue-ui-dark-mode &
+        border-color lighten($bg-dark, 25%)
   &:active
     .bullet
       border-color darken($bg, 8%)
+      .vue-ui-dark-mode &
+        border-color darken($bg-dark, 8%)
 
   .image-icon
     max-width 24px