Tweak dark theme

assets/stylesheets/components/_notif.scss

@@ -9,6 +9,7 @@
   font-size: .75rem;
   color: $notifColor;
   background: $notifBackground;
+  border: $notifBorder;
   border-radius: .25rem;
   transition: opacity .2s;
   opacity: 0;
@@ -127,8 +128,8 @@
 
 ._notif-tip {
   color: $textColor;
-  background: rgba($tipBackground, .95);
-  border: 1px solid $tipBorder;
+  background: $tipBackground;
+  border: $tipBorder;
 
   ._notif-info { color: $textColorLight; }
 }

assets/stylesheets/components/_path.scss

@@ -26,6 +26,7 @@
   margin: 0 1rem 0 0;
   padding: 0 .375rem;
   color: $textColor;
+  text-decoration: none;
 
   &:first-child:before {
     content: '';

assets/stylesheets/global/_base.scss

@@ -22,7 +22,7 @@ body {
 
 a {
   color: $linkColor;
-  text-decoration: none;
+  text-decoration: $linkTextDecoration;
 
   &:hover {
     color: $linkColorHover;

assets/stylesheets/global/_classes.scss

@@ -32,6 +32,7 @@
 }
 
 %heading-box {
+  color: $boxHeaderColor;
   background: $boxHeaderBackground;
   border: 1px solid $boxBorder;
   border-radius: 3px;
@@ -72,6 +73,7 @@
   padding-left: .5em;
   padding-right: .5em;
   font-size: inherit;
+  color: $boxHeaderColor;
   border: 1px solid $boxBorder;
   border-radius: 2px;
   @extend %label;

assets/stylesheets/global/_variables.scss

@@ -33,6 +33,7 @@ $highlightBackground: #fffdcd;
 
 $linkColor: #3377c0;
 $linkColorHover: #2f6cb6;
+$linkTextDecoration: none;
 
 $headerBackground: #f0f0f0;
 $headerBorder: #d9d9d9;
@@ -52,6 +53,7 @@ $noticeBorder: #e2e2c1;
 $boxBackground: #fafafa;
 $boxBorder: #d8d8d8;
 $boxBorderLight: #e5e5e5;
+$boxHeaderColor: $textColor;
 $boxHeaderBackground: #f5f5f5;
 
 $noteBackground: #f8f8dd;
@@ -72,11 +74,12 @@ $noteRedBorder: #dc7874;
 $labelBackground: #f4f4f4;
 
 $notifBackground: rgba(#333, .85);
+$notifBorder: none;
 $notifColor: #fff;
 $notifColorLight: #ccc;
 
-$tipBackground: #fffdcd;
-$tipBorder: #e7dca9;
+$tipBackground: rgba(#fffdcd, .95);
+$tipBorder: 1px solid #e7dca9;
 
 $mediumScreen: '(max-width: 800px)';
 

assets/stylesheets/global/variables-dark.scss

@@ -9,74 +9,77 @@ $sidebarWidth: 18rem;
 $sidebarMediumWidth: 16rem;
 $sidebarHiddenWidth: 9px;
 
-$contentBackground: #303030;
-$documentBackground: #404040;
+$contentBackground: #33373a;
+$documentBackground: $contentBackground;
 
-$textColor: #c9c9c9;
-$textColorLight: #858585;
-$textColorLighter: #706f6f;
+$textColor: #cbd0d0;
+$textColorLight: #9da5ad;
+$textColorLighter: #77787a;
 
-$inputFocusBorder: #444;
+$inputFocusBorder: false;
 
-$focusBackground: #3d3d3e;
-$focusBorder: #3d3d3e;
+$focusBackground: #3f4042;
+$focusBorder: #000;
 $focusText: #f7f2f2;
 
-$loadingText: #666;
-$splashText: #666;
+$loadingText: #5d6164;
+$splashText: $loadingText;
 
-$selectionBackground: #346fce;
-$selectionBorder: #346fce;
+$selectionBackground: #007acc;
+$selectionBorder: #000;
 $selectionText: #fff;
 
-$highlightBackground: #3d4449;
+$highlightBackground: #64675f;
 
-$linkColor: #fff;
-$linkColorHover: #fff;
+$linkColor: $textColor;
+$linkColorHover: white;
+$linkTextDecoration: underline;
 
-$headerBackground: #1c1c1c;
-$headerBorder: #1c1c1c;
+$headerBackground: #1e1e1e;
+$headerBorder: #000;
 
-$sidebarBackground: #262626;
-$sidebarBorder: #262626;
+$sidebarBackground: #24282a;
+$sidebarBorder: #000;
 
-$scrollbarColor: #515151;
-$scrollbarColorHover: #888;
+$scrollbarColor: #6c6c6f;
+$scrollbarColorHover: #949697;
 
 $pathBackground: $headerBackground;
 $pathBorder: $headerBorder;
 
-$noticeBackground: #1c1c1c;
-$noticeBorder: #1c1c1c;
+$noticeBackground: $sidebarBackground;
+$noticeBorder: $sidebarBorder;
 
-$boxBackground: #262626;
-$boxBorder: #000;
-$boxBorderLight: #000;
-$boxHeaderBackground: #262626;
+$boxBackground: $sidebarBackground;
+$boxBorder: $headerBorder;
+$boxBorderLight: $headerBorder;
+$boxHeaderColor: #dbe4e4;
+$boxHeaderBackground: $sidebarBackground;
 
-$noteBackground: #3a4031;
+$noteBackground: #45474b;
 $noteBorder: #000;
 
-$noteGreenBackground: #223e23;
+$noteGreenBackground: #284a2a;
 $noteGreenBorder: #000;
 
-$noteBlueBackground: #223546;
+$noteBlueBackground: #2a4151;
 $noteBlueBorder: #000;
 
-$noteOrangeBackground: #523121;
+$noteOrangeBackground: #563322;
 $noteOrangeBorder: #000;
 
-$noteRedBackground: #5b1f22;
+$noteRedBackground: #603033;
 $noteRedBorder: #000;
 
-$labelBackground: #3c3c3e;
+$labelBackground: $boxBackground;
 
-$notifBackground: rgba(#000, .85);
+$notifBackground: rgba(#555, .95);
+$notifBorder: 1px solid #000;
 $notifColor: #fff;
 $notifColorLight: #ccc;
 
-$tipBackground: #3d4449;
-$tipBorder: #566166;
+$tipBackground: $notifBackground;
+$tipBorder: $notifBorder;
 
 $mediumScreen: '(max-width: 800px)';