From ccb556e79bf776e5a013786aa2875a138400c25e Mon Sep 17 00:00:00 2001
From: tosih <sohail@runnable.com>
Date: Fri, 9 Dec 2016 14:35:51 -0800
Subject: [PATCH 1/2] Add dark theme.

---
 public/styles.css | 87 +++++++++++++++++++++++++++--------------------
 1 file changed, 51 insertions(+), 36 deletions(-)

diff --git a/public/styles.css b/public/styles.css
index 1c109af..4d5b916 100644
--- a/public/styles.css
+++ b/public/styles.css
@@ -1,69 +1,82 @@
+// dark theme colors
+$bg: #222;
+$gray: #888;
+$gray-dark: #555;
+$text-color: #fafafa;
+
 body,
 ul,
 li,
 h1,
 p {
   margin: 0;
-  padding: 0; }
+  padding: 0;
+}
 
 *,
 *::before,
 *::after {
-  box-sizing: border-box; }
+  box-sizing: border-box;
+}
 
 body {
-  background: #fafafa;
-  color: #555;
+  background: $bg;
+  color: $text-color;
   font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
-  line-height: 1.4; }
+  line-height: 1.4;
+}
 
 .container {
   margin: 0 auto;
   max-width: 450px;
-  padding: 15px; }
+  padding: 15px;
+}
 
 .h1 {
   font-size: 24px;
   font-weight: 500;
   margin-top: 60px;
-  padding-left: 48px; }
+  padding-left: 48px;
+}
 
 .todo-list {
-  background: white;
-  border: 1px solid #e6e6e6;
+  background: $gray-dark;
+  border: 1px solid transparent;
   border-radius: 6px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
-  margin: 15px 0 150px; }
+  box-shadow: 0 1px 3px rgba(0,0,0,.1);
+  margin: 15px 0 150px;
+}
 
 .todo-list-item {
-  display: -webkit-box;
-  display: -ms-flexbox;
   display: flex;
   font-size: 19px;
   padding: 18px;
-  width: 100%; }
-  .todo-list-item + .new_todo,
-  .todo-list-item + .todo-list-item {
-    border-top: 1px solid #e6e6e6; }
+  width: 100%;
+
+  + .new_todo,
+  + .todo-list-item {
+    border-top: 1px solid rgba(0,0,0,.3);
+  }
+}
 
 .button-complete {
-  background: #fff;
-  border: 3px solid #e6e6e6;
+  background: $gray-dark;
+  border: 3px solid rgba(0,0,0,.3);
   border-radius: 6px;
   cursor: pointer;
-  -webkit-box-flex: 0;
-      -ms-flex: 0 0 auto;
-          flex: 0 0 auto;
+  flex: 0 0 auto;
   height: 18px;
   margin: 4px 12px 0 0;
-  width: 18px; }
+  width: 18px;
+}
 
 .button-edit {
-  color: #888;
+  color: $gray;
   font-size: 15px;
   margin-left: auto;
   position: relative;
-  top: 4px; }
+  top: 4px;
+}
 
 .input {
   background: none;
@@ -71,26 +84,28 @@ body {
   color: inherit;
   line-height: inherit;
   outline: none;
-  padding-left: 48px; }
+  padding-left: 48px;
+}
 
 .notification {
-  background: #fff;
-  border: 1px solid #e6e6e6;
+  background: $gray-dark;
+  border: 1px solid transparent;
   border-radius: 6px;
   border-width: 1px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
-  color: #555;
-  display: -webkit-box;
-  display: -ms-flexbox;
+  box-shadow: 0 1px 3px rgba(0,0,0,.06);
   display: flex;
-  padding: 15px; }
+  padding: 15px;
+}
 
 .emoji {
   font-size: 45px;
-  margin-right: 12px; }
+  margin-right: 12px;
+}
 
 .weight-strong {
-  font-weight: 500; }
+  font-weight: 500;
+}
 
 .small {
-  font-size: 13px; }
+  font-size: 13px;
+}

From b3061734601bc0132e2d9d7a8a82eb80b2bd03ca Mon Sep 17 00:00:00 2001
From: tosih <sohail@runnable.com>
Date: Fri, 9 Dec 2016 14:44:31 -0800
Subject: [PATCH 2/2] Remove scss from css file.

---
 public/styles.css | 18 ++++++------------
 1 file changed, 6 insertions(+), 12 deletions(-)

diff --git a/public/styles.css b/public/styles.css
index 4d5b916..19afbd8 100644
--- a/public/styles.css
+++ b/public/styles.css
@@ -1,9 +1,3 @@
-// dark theme colors
-$bg: #222;
-$gray: #888;
-$gray-dark: #555;
-$text-color: #fafafa;
-
 body,
 ul,
 li,
@@ -20,8 +14,8 @@ p {
 }
 
 body {
-  background: $bg;
-  color: $text-color;
+  background: #222;
+  color: #fafafa;
   font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
   line-height: 1.4;
 }
@@ -40,7 +34,7 @@ body {
 }
 
 .todo-list {
-  background: $gray-dark;
+  background: #555;
   border: 1px solid transparent;
   border-radius: 6px;
   box-shadow: 0 1px 3px rgba(0,0,0,.1);
@@ -60,7 +54,7 @@ body {
 }
 
 .button-complete {
-  background: $gray-dark;
+  background: #555;
   border: 3px solid rgba(0,0,0,.3);
   border-radius: 6px;
   cursor: pointer;
@@ -71,7 +65,7 @@ body {
 }
 
 .button-edit {
-  color: $gray;
+  color: #888;
   font-size: 15px;
   margin-left: auto;
   position: relative;
@@ -88,7 +82,7 @@ body {
 }
 
 .notification {
-  background: $gray-dark;
+  background: #555;
   border: 1px solid transparent;
   border-radius: 6px;
   border-width: 1px;