ui: channel sizeness

src/client/channel.jsx

@@ -20,7 +20,11 @@ export default function Channel(props) {
         href
           ? (
             <Link
-              className="channel__link"
+              className={classnames(
+                'channel__link',
+                {long: name.length >= 12},
+                {superlong: name.length >= 16},
+              )}
               to={href}
             >
               <span className="muted">{prefix}</span>

src/client/channel.scss

@@ -14,6 +14,14 @@
     font-size: 0.8em;
     margin-right: 0.125em;
   }
+  &.long {
+    font-size: 0.8em;
+    padding: 1.4em;
+  }
+  &.superlong {
+    font-size: 0.6em;
+    padding: 2em;
+  }
 }
 
 .channel__actions {

src/client/chat.jsx

@@ -50,13 +50,13 @@ export default function Chat() {
         ref.current.classList.add('moving');
         const offset = pageX - origin.point + origin.left;
         const snapped = Math.abs(offset) < 64 ? 0 : offset;
-        const max = Math.min(window.innerWidth - 32, (2 + 16) * 16);
+        const max = Math.min(window.innerWidth - 32, 25 * 16);
         ref.current.style.left = `${Math.max(-max, Math.min(max, snapped))}px`;
       }
     },
     up: () => {
       const left = parseInt(ref.current.style.left, 10);
-      const max = Math.min(window.innerWidth - 32, (2 + 16) * 16);
+      const max = Math.min(window.innerWidth - 32, 25 * 16);
       if (left >= max / 2) {
         ref.current.style.left = `${max}px`;
       }