Working collapsing navbar

freechat-client/sass/style.scss

@@ -2,6 +2,14 @@
 
 body {
     color: $text;
+	max-height: 1080px;
+	max-width: 1920px;
+
+	min-width: 640px;
+	min-height: 480px;
+
+	overflow-y: hidden;
+	overflow-x: hidden;
 }
 
 
@@ -27,7 +35,6 @@ input {
 }
 
 // Menu bar stuff
-
 .btn-nav-settings {
 	color: $text;
     border-color: $text;
@@ -54,8 +61,8 @@ input {
 
 // CHANNEL SIDEBAR Things
 #channels-container {
-    min-width: 200px;
-    max-width: 200px;
+    min-width: 150px;
+    max-width: 150px;
     min-height: 100vh;
 }
 
@@ -79,4 +86,58 @@ ul ul a {
 
 #channels-container ul li a:hover {
     background-color: $bar-grey;
-}
+}
+
+.author-name {
+    color: white;
+}
+
+.message {
+    padding: 10px;
+    display: block;
+    text-decoration: none;
+    color: $text;
+}
+
+.message:hover {
+    background-color: $top-grey;
+}
+
+.message a:hover {
+    background-color: $bar-grey;
+    color: $text;
+    text-decoration: none;
+}
+
+.message a:focus {
+    background-color: $bar-grey;
+    color: $text;
+    text-decoration: none;
+}
+
+
+#messages-container {
+	padding-bottom: 50px;
+	overflow-y: scroll;
+	min-height: 480;
+	max-height: 1080px;
+	//max-height: 100%;
+}
+
+// Now the message box which must be pinned at the bottom
+#send-container {
+	position: absolute;
+	bottom: 0;
+	height: 50px;
+	width: 100vw;
+}
+
+#message-box {
+	padding-right: 25px;
+}
+
+#message-submit {
+	padding-left: 25px;
+	width: 25px;
+}
+