Fix the design of buttons of TopBar on dark theme

fstfwd · Mar 19, 2017 · 4055ce1 · 4055ce1
1 parent bcf2723
commit 4055ce1
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/browser/main/Detail/MarkdownNoteDetail.styl b/browser/main/Detail/MarkdownNoteDetail.styl
@@ -75,7 +75,7 @@ body[data-theme="dark"]
     box-shadow none
 
   .control-lockButton
-    colorDarkDefaultButton()
+    colorDarkTopBarButton()
     border-color $ui-dark-borderColor
     background-color $ui-dark-noteList-backgroundColor
     &:active
@@ -85,8 +85,9 @@ body[data-theme="dark"]
     darkTooltip()
 
   .control-trashButton
-    navDarkButtonColor()
+    colorDarkTopBarButton()
     border-color $ui-dark-borderColor
+    background-color $ui-dark-noteList-backgroundColor
     &:active
       border-color $ui-dark-button--focus-borderColor
     &:focus

diff --git a/browser/styles/index.styl b/browser/styles/index.styl
@@ -151,6 +151,7 @@ $ui-dark-button--active-color = white
 $ui-dark-button--active-backgroundColor = #6AA5E9
 $ui-dark-button--hover-backgroundColor = lighten($ui-dark-backgroundColor, 10%)
 $ui-dark-button--focus-borderColor = lighten(#369DCD, 25%)
+$ui-dark-topbar-button-color = #939395
 
 $dark-default-button-background = $ui-dark-backgroundColor
 $dark-default-button-background--hover = $ui-dark-button--hover-backgroundColor
@@ -190,6 +191,16 @@ navDarkButtonColor()
     background-color $ui-dark-button--active-backgroundColor
     color $ui-dark-button--active-color
 
+colorDarkTopBarButton()
+  border-color $ui-dark-borderColor
+  color $ui-dark-topbar-button-color
+  background-color $dark-default-button-background
+  &:hover
+    background-color $dark-default-button-background--hover
+  &:active
+  &:active:hover
+    background-color $ui-dark-button--active-backgroundColor
+
 $ui-dark-tooltip-text-color = white
 $ui-dark-tooltip-backgroundColor = alpha(#444, 70%)
 $ui-dark-tooltip-button-backgroundColor = #D1D1D1