Sidebar now has scaffolding so we can begin hooking it to things

freechat-client/sass/general.scss

@@ -7,6 +7,7 @@
 $top-grey: #424242;
 $back-grey: #303030;
 $bar-grey: #212121;
+$text: whitesmoke;
 
 body {
     background: $back-grey;

freechat-client/sass/style.scss

@@ -1,18 +1,16 @@
 @import 'general';
 
-$text-color: white;
-
 body {
-    color: $text-color;
+    color: $text;
 }
 
 
 label {
-    color: $text-color;
+    color: $text;
 }
 
 h1 {
-    color: $text-color;
+    color: $text;
     display: block;
 }
 .center {
@@ -31,7 +29,54 @@ input {
 // Menu bar stuff
 
 .btn-nav-settings {
-	color: whitesmoke;
-    border-color: whitesmoke;
+	color: $text;
+    border-color: $text;
     margin-right: 1em;
 }
+
+// Join modal meme
+.join-style {
+    color: $text;
+    background: $top-grey;
+}
+
+.join-form-label {
+    color: $text;
+}
+
+// mostly used to let the sidebar be of a correct height
+.wrapper {
+    display: flex;
+    width: 100%;
+    align-items: stretch;
+}
+
+
+// CHANNEL SIDEBAR Things
+#channels-container {
+    min-width: 200px;
+    max-width: 200px;
+    min-height: 100vh;
+}
+
+.channels-list-header {
+    color: $text;
+    background-color: $back-grey;
+}
+
+ul ul a {
+    font-size: 0.9em !important;
+    padding-left: 30px !important;
+    background: #6d7fcc;
+}
+
+#channels-container ul li a {
+    padding: 10px;
+    display: block;
+    text-decoration: none;
+    color: $text;
+}
+
+#channels-container ul li a:hover {
+    background-color: $bar-grey;
+}