From 390923a7ca219781ac9241b642b22742acfe7186 Mon Sep 17 00:00:00 2001
From: catarak <ctarakajian@gmail.com>
Date: Wed, 14 Sep 2016 18:38:57 -0400
Subject: [PATCH] add most of dark theme

---
 client/styles/components/_nav.scss     |  4 ++-
 client/styles/components/_sidebar.scss | 35 ++++++++++++++++++--------
 client/styles/components/_toolbar.scss |  4 ++-
 3 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/client/styles/components/_nav.scss b/client/styles/components/_nav.scss
index 9e89723c..31e90885 100644
--- a/client/styles/components/_nav.scss
+++ b/client/styles/components/_nav.scss
@@ -8,12 +8,14 @@
 }
 
 .nav__items-left, .nav__items-right {
+	@include themify() {
+		border-bottom: 2px dashed map-get($theme-map, 'inactive-text-color');
+	}
 	list-style: none;
 	display: flex;
 	flex-direction: row;
 	justify-content: flex-end;
 	padding: #{5 / $base-font-size}rem #{10 / $base-font-size}rem;
-	border-bottom: 2px dashed;
 }
 
 .nav__item {
diff --git a/client/styles/components/_sidebar.scss b/client/styles/components/_sidebar.scss
index 7c9f6832..2e2918bd 100644
--- a/client/styles/components/_sidebar.scss
+++ b/client/styles/components/_sidebar.scss
@@ -1,8 +1,10 @@
 .sidebar__header {
+  @include themify() {
+    border-top: 1px solid map-get($theme-map, 'ide-border-color');
+  }
   padding: #{10 / $base-font-size}rem #{6 / $base-font-size}rem;
   display: flex;
   justify-content: space-between;
-  border-top: 1px solid $ide-border-color;
   align-items: center;
   height: #{47 / $base-font-size}rem;
 }
@@ -39,13 +41,15 @@
 
 .sidebar__file-item {
   font-size: #{16 / $base-font-size}rem;
-  color: $light-inactive-text-color;
   cursor: pointer;
-  &:hover > .file-item__content .sidebar__file-item-name {
-    color: $light-primary-text-color;
-  }
-  &:hover > .file-item__content .sidebar__file-item-icon g {
-    fill: $light-primary-text-color;
+  @include themify() {
+    color: map-get($theme-map, 'inactive-text-color');
+    &:hover > .file-item__content .sidebar__file-item-name {
+      color: map-get($theme-map, 'primary-text-color');
+    }
+    &:hover > .file-item__content .sidebar__file-item-icon g {
+      fill: map-get($theme-map, 'primary-text-color');
+    }
   }
 }
 
@@ -75,7 +79,9 @@
   position: relative;
   padding: #{8 / $base-font-size}rem 0;
   .sidebar__file-item--selected > & {
-    background-color: $ide-border-color;
+    @include themify() {
+      background-color: map-get($theme-map, 'ide-border-color');
+    }
   }
   .sidebar--contracted & {
     display: none;
@@ -102,6 +108,9 @@
 
 .sidebar__file-item-options {
   @extend %modal;
+  @include themify() {
+    background-color: getThemeColor('modal-background-color');
+  }
   position: absolute;
   top: 95%;
   left: 77%;
@@ -109,7 +118,6 @@
   display: none;
   z-index: 100;
   padding: #{8 / $base-font-size}rem #{16 / $base-font-size}rem;
-  background-color: $light-modal-background-color;
   z-index: 100;
   .sidebar__file-item--open > .file-item__content & {
     display: block;
@@ -164,12 +172,19 @@
 .sidebar__folder-icon {
   margin-right: #{5 / $base-font-size}rem;
   & g {
-    fill: $light-primary-text-color;
+    @include themify() {
+      fill: map-get($theme-map, 'primary-text-color');
+    }
   }
 }
 
 .sidebar__file-item-icon {
   margin-right: #{5 / $base-font-size}rem;
+  & g {
+    @include themify() {
+      fill: getThemifyVariable('inactive-text-color');
+    }
+  }
 }
 
 .sidebar__file-item-closed {
diff --git a/client/styles/components/_toolbar.scss b/client/styles/components/_toolbar.scss
index ea88191f..e7940bb6 100644
--- a/client/styles/components/_toolbar.scss
+++ b/client/styles/components/_toolbar.scss
@@ -46,7 +46,9 @@
 }
 
 .toolbar__project-name-container {
-	border-left: 2px dashed;
+	@include themify() {
+		border-left: 2px dashed map-get($theme-map, 'inactive-text-color');
+	}
 	margin-left: #{10 / $base-font-size}rem;
 	padding-left: #{10 / $base-font-size}rem;
 	height: 70%;