ui: tweaks

src/client/channel.jsx

@@ -27,7 +27,15 @@ export default function Channel(props) {
         )
       }
       <span className="muted">{prefix}</span>
-      <span className="channel__name">{name}</span>
+      <span
+        className={classnames(
+          'channel__name',
+          {long: name && name.length >= 12},
+          {superlong: name && name.length >= 16},
+        )}
+      >
+        {name}
+      </span>
     </>
   );
   return (
@@ -38,11 +46,7 @@ export default function Channel(props) {
         href
           ? (
             <Link
-              className={classnames(
-                'channel__link',
-                {long: name && name.length >= 12},
-                {superlong: name && name.length >= 16},
-              )}
+              className="channel__link"
               to={href}
             >
               {content}

src/client/channel.scss

@@ -28,13 +28,16 @@
     padding: 0.4em;
     text-align: center;
   }
+}
+
+.channel__name {
   &.long {
     font-size: 0.8em;
-    padding: 1.4em;
+    padding-top: 0.2em;
   }
   &.superlong {
     font-size: 0.6em;
-    padding: 2em;
+    padding-top: 0.4em;
   }
 }
 

src/client/chat--messages.scss

@@ -1,6 +1,6 @@
 .chat--messages {
   background-image: url('./dark.png');
-  box-shadow: 0 0 10px #171717 inset;
+  box-shadow: 0 0 5px #171717 inset;
   display: flex;
   flex-direction: column;
   overflow: hidden;