ui: tweaks

src/client/chat--left.jsx

@@ -44,10 +44,16 @@ export default function ChatLeft() {
       <h2 className="channel__chatsTitle">Chats</h2>
       <ul className="channel__chatsList">
         <li>
-          <a href="/chat/u/cha0s">cha0s</a>
+          <a href="/chat/r/reddichat">
+            <span className="muted">/r/</span>
+            reddichat
+          </a>
         </li>
         <li>
-          <a href="/chat/u/BabeHasHiccups">BabeHasHiccups</a>
+          <a href="/chat/r/anonymous">
+            <span className="muted">/r/</span>
+            anonymous
+          </a>
         </li>
       </ul>
     </div>

src/client/chat--left.scss

@@ -51,13 +51,16 @@
 }
 
 .channel__chatsList a {
-  color: #dddddd;
+  color: #ffffff;
   display: block;
-  font-family: var(--thick-title-font-family);
+  font-family: var(--title-font-family);
   padding: 1em;
   text-decoration: none;
+  .muted {
+    font-size: 0.8em;
+    margin-right: 0.125em;
+  }
   &:hover {
     background-color: #444;
-    color: #ffffff;
   }
 }

src/client/index.scss

@@ -233,7 +233,10 @@ select {
   display: block;
 }
 
-/* Webfont: Lato-Light */
+.muted {
+  color: $color-muted;
+}
+
 @font-face {
   font-family: 'LatoLight';
   src: url('./fonts/Lato-Light.eot');