From 86f87bcb3f0adf915b9044ba7ed2935ec8ef4efa Mon Sep 17 00:00:00 2001
From: Cynthia Lin <cynthialin1004@gmail.com>
Date: Wed, 6 Dec 2017 20:33:16 -0800
Subject: [PATCH] dark-mode: Change hex color codes to HSL.

---
 static/styles/dark.css | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/static/styles/dark.css b/static/styles/dark.css
index 1c7f5e3c58..6031f08340 100644
--- a/static/styles/dark.css
+++ b/static/styles/dark.css
@@ -1,27 +1,27 @@
 body.dark-mode {
-    background-color: #212d3b;
-    color: #dddeee;
+    background-color: hsl(212, 28%, 18%);
+    color: hsl(236, 33%, 90%);
 
     -webkit-font-smoothing: antialiased;
 }
 
 body.dark-mode .app-main,
 body.dark-mode .header-main {
-    background-color: #212d3b;
+    background-color: hsl(212, 28%, 18%);
 }
 
 body.dark-mode #tab_bar_underpadding,
 body.dark-mode .floating_recipient .message-header-wrapper,
 body.dark-mode .column-middle,
 body.dark-mode #compose {
-    background-color: #212d3b;
+    background-color: hsl(212, 28%, 18%);
 }
 
 body.dark-mode .column-left .left-sidebar,
 body.dark-mode .column-right .right-sidebar,
 body.dark-mode #subscription_overlay .right,
 body.dark-mode #settings_page .right {
-    background-color: #212d3b;
+    background-color: hsl(212, 28%, 18%);
 }
 
 body.dark-mode .column-left .left-sidebar {
@@ -35,7 +35,7 @@ body.dark-mode .column-right .right-sidebar {
 body.dark-mode .dark .message_label_clickable.stream_label,
 body.dark-mode .dark .stream_label,
 body.dark-mode .stream_label {
-    color: #212d3b;
+    color: hsl(212, 28%, 18%);
 }
 
 body.dark-mode .new-style label.checkbox input[type=checkbox] ~ span {
@@ -43,7 +43,7 @@ body.dark-mode .new-style label.checkbox input[type=checkbox] ~ span {
 }
 
 body.dark-mode .modal-bg {
-    background: #212d3b;
+    background: hsl(212, 28%, 18%);
 }
 
 .streams_popover .sp-container {
@@ -68,7 +68,7 @@ body.dark-mode .message_reactions:hover .message_reaction + .reaction_button {
 on a dark background, and don't change the dark labels dark either. */
 body.dark-mode .message_header:not(.dark_background) a.stream_label:not(.dark_background):hover,
 body.dark-mode #tab_list li.stream:not(.dark_background) {
-    color: #212d3b !important;
+    color: hsl(212, 28%, 18%) !important;
 }
 
 /* these are converting grey things to "new grey" */
@@ -161,7 +161,7 @@ body.dark-mode .popover {
 body.dark-mode .dropdown .dropdown-menu li.divider,
 body.dark-mode .popover hr,
 body.dark-mode hr {
-    color: #212d3b;
+    color: hsl(212, 28%, 18%);
     opacity: 0.2;
 }
 
@@ -302,13 +302,13 @@ body.dark-mode .alert-box .alert.alert-error::before {
 }
 
 body.dark-mode .top-messages-logo svg path {
-    fill: #222d3b;
-    stroke: #222d3b;
+    fill: hsl(214, 27%, 18%);
+    stroke: hsl(214, 27%, 18%);
 }
 
 body.dark-mode .top-messages-logo svg circle {
-    fill: #fff;
-    stroke: #fff;
+    fill: hsl(0, 0%, 100%);
+    stroke: hsl(0, 0%, 100%);
 }
 
 body.dark-mode #unmute_muted_topic_notification,