cleanup

src/lib/components/Navigation.svelte

@@ -106,7 +106,6 @@
       clip-path: polygon(25% 50%, 0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
       border-radius: 0;
 
-      &.active,
       &:active {
         color: var(--md-sys-color-on-tertiary);
         background: var(--md-sys-color-tertiary);

src/lib/components/RingInput.svelte

@@ -20,7 +20,10 @@
   }
 
   function getKeyDescriptions(keys: KeyInfo[]): string {
-    return keys.map(({title, id, code}, i) => `${title || id || code} (${layerNames[i]})`).join("\n")
+    return keys
+      .filter(it => !!it)
+      .map(({title, id, code}, i) => `${title || id || code} (${layerNames[i]})`)
+      .join("\n")
   }
 
   function getActions(id: number, layout: CharaLayout): KeyInfo[] {
@@ -35,11 +38,12 @@
   {#each [keys.n, keys.e, keys.s, keys.w] as id, quadrant}
     {@const actions = getActions(id, $layout)}
     <button title={getKeyDescriptions(actions)}>
-      {#each actions as { symbol, id }, layer}
-        {#if symbol || id}
+      {#each actions as keyInfo, layer}
+        {@const displayTitle = keyInfo?.symbol || keyInfo?.id}
+        {#if displayTitle}
           <span
             class:active={virtualLayerMap[activeLayer] === virtualLayerMap[layer]}
-            style="offset-distance: {offsetDistance(quadrant, layer, activeLayer)}%">{symbol || id}</span
+            style="offset-distance: {offsetDistance(quadrant, layer, activeLayer)}%">{displayTitle}</span
           >
         {/if}
       {/each}

src/lib/components/Terminal.svelte

@@ -11,12 +11,10 @@
 
   let value: string
   let io: HTMLDivElement
-
-  export let resizable = false
 </script>
 
 <form on:submit={submit}>
-  <div bind:this={io} class="io" class:resizable>
+  <div bind:this={io} class="io">
     {#each $serialLog as { type, value }}
       <p class={type} transition:slide>{value}</p>
     {/each}
@@ -44,10 +42,6 @@
     color: var(--md-sys-color-on-secondary);
 
     border-radius: 16px;
-
-    &.resizable {
-      resize: both;
-    }
   }
 
   ::-webkit-scrollbar {
@@ -125,21 +119,6 @@
     }
   }
 
-  .terminal.resizable fieldset::after {
-    content: "";
-
-    position: absolute;
-    right: 6px;
-    bottom: 8px;
-    rotate: -45deg;
-
-    width: 10px;
-    height: 5px;
-
-    background: var(--md-sys-color-on-secondary);
-    clip-path: polygon(0 0, 100% 0, 50% 100%);
-  }
-
   .anchor {
     overflow-anchor: auto;
     height: 1px;