add cc1 visual layout

2026-01-10 20:12:48 +00:00 · 2023-10-31 23:27:29 +01:00
parent a6e7df55ff
commit aba390839b
6 changed files with 65 additions and 35 deletions
--- a/src/lib/components/layout/KeyboardKey.svelte
+++ b/src/lib/components/layout/KeyboardKey.svelte
@@ -44,6 +44,7 @@
    {@const multiplier = 1.4}
    <g style:transform="rotateZ({key.rotate}rad) translate({innerMargin}px, {innerMargin}px)">
      <path
+        opacity="0.4"
        d="M{posX + p1},{posY} a{r1},{r1} 0 0,1 {-p1},{p1} l0,{-(p1 - p2)} a{r2},{r2} 0 0,0 {p2},{-p2}z"
      />
      <KeyText
@@ -83,6 +84,12 @@
    stroke: currentcolor;
  }

+  path {
+    fill: currentcolor;
+    fill-opacity: 0.2;
+    stroke-opacity: 0.6;
+  }
+
  g:hover {
    cursor: default;
    opacity: 0.6;