Selenium33 (#7)

README.md

@@ -1,7 +1,7 @@
 Arsenik
 ================================================================================
 
-A basic [Miryoku][1]-like approach to minimize finger movements:
+A beginner-friendly, [Miryoku][1]-like approach to minimize finger movements:
 
 - 3 home-row mods per hand for <kbd>Ctrl</kbd>, <kbd>Alt</kbd>, <kbd>Super</kbd>
 - 3 layer-tap keys under the thumbs: <kbd>Shift</kbd>/<kbd>Backspace</kbd>,
@@ -81,13 +81,11 @@ thumb key, and symmetrical modifiers on the homerow.
 
 ### 3. Spice It Up
 
-- the 300 ms delay before a key becomes a modifier has been chosen to be easy for
-beginners. Once used to mod-taps, you may want to reduce it so keyboard
+- the 300 ms delay before a key becomes a modifier has been chosen to be easy
+for beginners. Once used to mod-taps, you may want to reduce it so keyboard
 shortcuts can be done more quickly;
-- adding new layers should be easy, even without additional thumb keys — check the
-mods to get some ideas;
-- the right thumb key could do something more useful than <kbd>Enter</kbd> —
-like a one-time-shift, for instance.
+- adding new layers should be easy, even without additional thumb keys — check
+[the Selenium33 mod][11] to get some ideas.
 
 
 Downloads
@@ -115,7 +113,8 @@ blatantly taken *as is*;
 ### Alternative Symbol Layers
 
 - [Neo][5]
-- [Pascal Getreuer’s][7]
+- [Seniply][7]
+- [Pascal Getreuer’s][8]
 
 ### Non-Goals
 
@@ -125,13 +124,23 @@ advanced approach for that, at least on custom 36-key keyboards;
 AltGr layer at all (e.g. QWERTY, Colemak, Workman…), or an optimized AltGr layer
 ([Lafayette][2], [Ergo-L][3]…).
 
+### Similar Projects
+
+- [Miryoku][1]: 36 keys, 6 layers
+- [Seniply][7]: 34 keys, 6 layers, no layer-taps (“Callum-style”)
+- [Selenium33][11]: 33 keys, 4 layers — a Vim-friendly Arsenik mod
+
+<!-- https://jasoncarloscox.com/writing/combo-mods/ -->
+
 [1]: https://github.com/manna-harbour/miryoku
 [2]: https://qwerty-lafayette.org/42
 [3]: https://ergol.org
 [4]: https://dreymar.colemak.org/layers-extend.html
-[5]: https://www.neo-layout.org/
+[5]: https://neo-layout.org
 [6]: https://github.com/lobre/shaka34
-[7]: https://getreuer.info/posts/keyboards/symbol-layer/
+[7]: https://stevep99.github.io/seniply/
+[8]: https://getreuer.info/posts/keyboards/symbol-layer/#my-symbol-layer
+[11]: mods/selenium33
 
 
 TODO

mods/selenium33/README.md

@@ -0,0 +1,53 @@
+Selenium33
+================================================================================
+
+A Vim-friendly Arsenik mod:
+
+- 3 home-row mods per hand for <kbd>Ctrl</kbd>, <kbd>Alt</kbd>, <kbd>Super</kbd>
+- 3 layer-tap keys under the thumbs: <kbd>Shift</kbd>/<kbd>Backspace</kbd>,
+<kbd>Navigation</kbd>/<kbd>Space</kbd>, <kbd>Symbol</kbd>/<kbd>Return</kbd>
+
+![base, navigation and sym layers on a 33-key keyboard](img/all.svg)
+
+Selenium uses 4 layers (instead of 3 for Arsenik), which makes it a natural fit
+for 34-key keyboards like the [Ferris][34].
+
+[34]: https://github.com/pierrechevalier83/ferris
+
+
+Extended Navigation
+--------------------------------------------------------------------------------
+
+- Vim-like navigation in all apps, with any OS layout
+- super-comfortable <kbd>Tab</kbd> and <kbd>Shift</kbd>-<kbd>Tab</kbd>
+- mouse emulation: previous / next and mouse scroll
+- easy left-hand shortcuts
+
+![Vim navigation layer on a 33-key keyboard](img/navigation.svg)
+
+This <kbd>Navigation</kbd> layer has a few empty slots on purpose, so you can
+add our own keys or layers.
+
+
+NumRow >> NumPad
+--------------------------------------------------------------------------------
+
+In <kbd>Symbol</kbd> mode, pressing the left thumb key brings up the
+<kbd>NumRow</kbd> layer:
+
+- all digits are on the home row, in the order you already know
+- the upper row helps with <kbd>Shift</kbd>-digit shortcuts
+- the lower row has dash, comma, dot and slash signs to help with number / date
+inputs
+
+![NumRow layer on a 33-key keyboard](img/numrow.svg)
+
+Even on keyboards that *do* have a physical number row, this <kbd>NumRow</kbd>
+layer can be interesting to use in order to minimize finger movements further
+more. And it makes it easier to mix symbols with numbers (e.g. `[0]`).
+
+
+Download
+--------------------------------------------------------------------------------
+
+![kanata configuration](selenium.kbd)

mods/selenium33/img/all.svg

@@ -0,0 +1,289 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="90 60 720 240">
+
+  <style>
+    rect {
+      fill: #f8f8f8;
+      stroke: #666;
+      stroke-width: .5px;
+    }
+    text {
+      fill: #999;
+      font: normal 20px sans-serif;
+      text-align: center;
+      text-anchor: middle;
+    }
+    .dualKey { fill: #ddd; transform: translateY(26px); }
+
+    #row_AD { transform: translate(64px,  64px); }
+    #row_AC { transform: translate(64px, 124px); }
+    #row_AB { transform: translate(64px, 184px); }
+    #row_AA { transform: translate(64px, 244px); }
+    .left   { transform: translate(-15px, 0); }
+    .right  { transform: translate(+15px, 0); }
+
+    .shortcut { font-size: smaller; }
+    .layerSym { font-weight: normal; }
+    .layerMod { font-weight: bold; font-size: 14px; }
+    .layerNav { font-weight: bold; }
+
+    .layerMod, .colorMod { fill: #333; }
+    .layerSym, .colorSym { fill: blue; }
+    .layerNav, .colorNav { fill: #e83; }
+
+    @media (prefers-color-scheme: dark) {
+      text                 { fill: #888; }
+      rect                 { fill: #444; }
+      .dualKey             { fill: #666; }
+      .layerMod, .colorMod { fill: #eee; }
+      .layerSym, .colorSym { fill: #99f; }
+      .layerNav, .colorNav { fill: #e83; }
+    }
+  </style>
+
+  <g id="row_AD">
+    <g class="left">
+      <g transform="translate(90)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">Q</text>
+        <text x="38.0" y="43.4" class="layerSym">@</text>
+      </g>
+      <g transform="translate(150)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">W</text>
+        <text x="38.0" y="20.6" class="layerNav shortcut">^w</text>
+        <text x="38.0" y="43.4" class="layerSym">&lt;</text>
+      </g>
+      <g transform="translate(210)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">E</text>
+        <text x="38.0" y="20.6" class="layerNav">⎗</text>
+        <text x="38.0" y="43.4" class="layerSym">&gt;</text>
+      </g>
+      <g transform="translate(270)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">R</text>
+        <text x="38.0" y="20.6" class="layerNav">⎘</text>
+        <text x="38.0" y="43.4" class="layerSym">$</text>
+      </g>
+      <g transform="translate(330)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">T</text>
+        <text x="38.0" y="43.4" class="layerSym">%</text>
+      </g>
+    </g>
+    <g class="right">
+      <g transform="translate(390)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">Y</text>
+        <text x="38.0" y="20.6" class="layerNav">⇱</text>
+        <text x="38.0" y="43.4" class="layerSym">^</text>
+      </g>
+      <g transform="translate(450)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">U</text>
+        <text x="38.0" y="20.6" class="layerNav">⇟</text>
+        <text x="38.0" y="43.4" class="layerSym">&amp;</text>
+      </g>
+      <g transform="translate(510)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">I</text>
+        <text x="38.0" y="20.6" class="layerNav">⇞</text>
+        <text x="38.0" y="43.4" class="layerSym">*</text>
+      </g>
+      <g transform="translate(570)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">O</text>
+        <text x="38.0" y="20.6" class="layerNav">⇲</text>
+        <text x="38.0" y="43.4" class="layerSym">'</text>
+      </g>
+      <g transform="translate(630)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">P</text>
+        <text x="38.0" y="43.4" class="layerSym">`</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AC">
+    <g class="left">
+      <g transform="translate(90)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">A</text>
+        <text x="38.0" y="20.6" class="layerNav shortcut">^a</text>
+        <text x="38.0" y="43.4" class="layerSym">{</text>
+      </g>
+      <g transform="translate(150)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <rect width="26" height="26" rx="2" ry="2" class="dualKey"/>
+        <text x="12.8" y="20.6" class="level2">S</text>
+        <text x="12.8" y="43.4" class="layerMod">⌘</text>
+        <text x="38.0" y="20.6" class="layerNav shortcut">^s</text>
+        <text x="38.0" y="43.4" class="layerSym">(</text>
+      </g>
+      <g transform="translate(210)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <rect width="26" height="26" rx="2" ry="2" class="dualKey"/>
+        <text x="12.8" y="20.6" class="level2">D</text>
+        <text x="12.8" y="43.4" class="layerMod">⌥</text>
+        <text x="38.0" y="20.6" class="layerNav">⇤</text>
+        <text x="38.0" y="43.4" class="layerSym">)</text>
+      </g>
+      <g transform="translate(270)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <rect width="26" height="26" rx="2" ry="2" class="dualKey"/>
+        <text x="12.8" y="20.6" class="level2">F</text>
+        <text x="12.8" y="43.4" class="layerMod">⌃</text>
+        <text x="38.0" y="20.6" class="layerNav">⇥</text>
+        <text x="38.0" y="43.4" class="layerSym">}</text>
+      </g>
+      <g transform="translate(330)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">G</text>
+        <text x="38.0" y="43.4" class="layerSym"> = </text>
+      </g>
+    </g>
+    <g class="right">
+      <g transform="translate(390)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">H</text>
+        <text x="38.0" y="20.6" class="layerNav">←</text>
+        <text x="38.0" y="43.4" class="layerSym">\</text>
+      </g>
+      <g transform="translate(450)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <rect width="26" height="26" rx="2" ry="2" class="dualKey"/>
+        <text x="12.8" y="20.6" class="level2">J</text>
+        <text x="12.8" y="43.4" class="layerMod">⌃</text>
+        <text x="38.0" y="20.6" class="layerNav">↓</text>
+        <text x="38.0" y="43.4" class="layerSym">+</text>
+      </g>
+      <g transform="translate(510)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <rect width="26" height="26" rx="2" ry="2" class="dualKey"/>
+        <text x="12.8" y="20.6" class="level2">K</text>
+        <text x="12.8" y="43.4" class="layerMod">⌥</text>
+        <text x="38.0" y="20.6" class="layerNav">↑</text>
+        <text x="38.0" y="43.4" class="layerSym">-</text>
+      </g>
+      <g transform="translate(570)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <rect width="26" height="26" rx="2" ry="2" class="dualKey"/>
+        <text x="12.8" y="20.6" class="level2">L</text>
+        <text x="12.8" y="43.4" class="layerMod">⌘</text>
+        <text x="38.0" y="20.6" class="layerNav">→</text>
+        <text x="38.0" y="43.4" class="layerSym">/</text>
+      </g>
+      <g transform="translate(630)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">;</text>
+        <text x="12.8" y="20.6" class="level2">:</text>
+        <text x="38.0" y="43.4" class="layerSym">"</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AB">
+    <g class="left">
+      <g transform="translate(90)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <g>
+          <text x="12.8" y="20.6" class="level2">Z</text>
+          <text x="38.0" y="20.6" class="layerNav shortcut">^z</text>
+          <text x="38.0" y="43.4" class="layerSym">~</text>
+        </g>
+      </g>
+      <g transform="translate(150)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <g>
+          <text x="12.8" y="20.6" class="level2">X</text>
+          <text x="38.0" y="20.6" class="layerNav shortcut">^x</text>
+          <text x="38.0" y="43.4" class="layerSym">[</text>
+        </g>
+      </g>
+      <g transform="translate(210)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <g>
+          <text x="12.8" y="20.6" class="level2">C</text>
+          <text x="38.0" y="20.6" class="layerNav shortcut">^c</text>
+          <text x="38.0" y="43.4" class="layerSym">]</text>
+        </g>
+      </g>
+      <g transform="translate(270)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <g>
+          <text x="12.8" y="20.6" class="level2">V</text>
+          <text x="38.0" y="20.6" class="layerNav shortcut">^v</text>
+          <text x="38.0" y="43.4" class="layerSym">_</text>
+        </g>
+      </g>
+      <g transform="translate(330)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <g>
+          <text x="12.8" y="20.6" class="level2">B</text>
+          <text x="38.0" y="43.4" class="layerSym">#</text>
+        </g>
+      </g>
+    </g>
+    <g class="right">
+      <g transform="translate(390)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">N</text>
+        <text x="30.0" y="20.6" class="layerNav">🖰</text>
+        <text x="38.0" y="20.6" class="layerNav">←</text>
+        <text x="38.0" y="43.4" class="layerSym">|</text>
+      </g>
+      <g transform="translate(450)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">M</text>
+        <text x="30.0" y="20.6" class="layerNav">🖰</text>
+        <text x="42.0" y="20.6" class="layerNav">↓</text>
+        <text x="38.0" y="43.4" class="layerSym">!</text>
+      </g>
+      <g transform="translate(510)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">,</text>
+        <text x="12.8" y="20.6" class="level2">&lt;</text>
+        <text x="30.0" y="20.6" class="layerNav">🖰</text>
+        <text x="42.0" y="20.6" class="layerNav">↑</text>
+        <text x="38.0" y="43.4" class="layerSym">;</text>
+      </g>
+      <g transform="translate(570)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">.</text>
+        <text x="12.8" y="20.6" class="level2">&gt;</text>
+        <text x="30.0" y="20.6" class="layerNav">🖰</text>
+        <text x="38.0" y="20.6" class="layerNav">→</text>
+        <text x="38.0" y="43.4" class="layerSym">:</text>
+      </g>
+      <g transform="translate(630)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">?</text>
+        <text x="38.0" y="43.4" class="layerSym">?</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AA">
+    <g transform="translate(180)">
+      <rect width="82" height="52" rx="5" ry="5"/>
+      <rect width="41" height="26" rx="2" ry="2" class="dualKey"/>
+      <text x="20.5" y="42.8" class="layerMod shortcut">shift</text>
+      <text x="61.5" y="42.8" class="layerMod shortcut colorSym">num</text>
+      <text x="61.5" y="20.6" class="layerNav" style="font-size: 14px;">⌦</text>
+      <text x="20.5" y="20.6" class="level2" style="font-size: 14px;">⌫</text>
+    </g>
+    <g transform="translate(270)">
+      <rect width="232" height="52" rx="5" ry="5"/>
+      <rect width="116" height="26" rx="2" ry="2" class="dualKey"/>
+      <text x="58.0" y="42.8" class="layerMod colorNav shortcut">navigation</text>
+    </g>
+    <g transform="translate(510)">
+      <rect width="82" height="52" rx="5" ry="5"/>
+      <rect width="41" height="26" rx="2" ry="2" class="dualKey"/>
+      <text x="20.5" y="42.8" class="layerMod colorSym shortcut">sym</text>
+      <text x="61.5" y="20.6" class="layerNav">⎋</text>
+      <text x="20.5" y="22.6" class="level2">⏎</text>
+    </g>
+  </g>
+
+</svg>

mods/selenium33/img/index.html

@@ -0,0 +1,30 @@
+<!doctype html>
+<html>
+<head>
+  <style>
+    body {
+      width: 51em;
+      margin: 0 auto;
+      border-left: 1px solid #8883;
+      border-right: 1px solid #8883;
+      font-family: sans-serif;
+      text-align: center;
+    }
+    @media (prefers-color-scheme: dark) {
+      html { background-color: #222; color: #ddd; }
+    }
+  </style>
+</head>
+<body>
+  <h1> Selenium33 </h1>
+  <img src="all.svg">
+  <h2> Base </h2>
+  <img src="../../../img/base.svg">
+  <h2> Symbols </h2>
+  <img src="../../../img/symbols.svg">
+  <h2> Navigation </h2>
+  <img src="navigation.svg">
+  <h2> NumRow </h2>
+  <img src="numrow.svg">
+</body>
+</html>

mods/selenium33/img/navigation.svg

@@ -0,0 +1,222 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="90 60 720 240">
+
+  <style>
+    rect, path {
+      fill: #f8f8f8;
+      stroke: #666;
+      stroke-width: .5px;
+    }
+    text {
+      fill: #999;
+      font: normal 20px sans-serif;
+      text-align: center;
+      text-anchor: middle;
+    }
+
+    #row_AD { transform: translate(64px,  64px); }
+    #row_AC { transform: translate(64px, 124px); }
+    #row_AB { transform: translate(64px, 184px); }
+    #row_AA { transform: translate(64px, 244px); }
+    .left   { transform: translate(-15px, 0); }
+    .right  { transform: translate(+15px, 0); }
+
+    .layer    { font-size: 14px; font-weight: bold; }
+    .layerNav { fill: #e83; font-weight: bold; }
+    .shortcut { font-size: smaller; }
+
+    @media (prefers-color-scheme: dark) {
+      text    { fill: #888; }
+      rect    { fill: #444; }
+    }
+  </style>
+
+  <g id="row_AD">
+    <g class="left">
+      <g transform="translate(90)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">Q</text>
+      </g>
+      <g transform="translate(150)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">W</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^w</text>
+      </g>
+      <g transform="translate(210)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">E</text>
+        <text x="38.0" y="43.4" class="layerNav">⎗</text>
+      </g>
+      <g transform="translate(270)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">R</text>
+        <text x="38.0" y="43.4" class="layerNav">⎘</text>
+      </g>
+      <g transform="translate(330)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">T</text>
+      </g>
+    </g>
+    <g class="right">
+      <g transform="translate(390)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">Y</text>
+        <text x="38.0" y="43.4" class="layerNav">⇱</text>
+      </g>
+      <g transform="translate(450)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">U</text>
+        <text x="38.0" y="43.4" class="layerNav">⇟</text>
+      </g>
+      <g transform="translate(510)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">I</text>
+        <text x="38.0" y="43.4" class="layerNav">⇞</text>
+      </g>
+      <g transform="translate(570)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">O</text>
+        <text x="38.0" y="43.4" class="layerNav">⇲</text>
+      </g>
+      <g transform="translate(630)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">P</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AC">
+    <g class="left">
+      <g transform="translate(90)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">A</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^a</text>
+      </g>
+      <g transform="translate(150)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">S</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^s</text>
+      </g>
+      <g transform="translate(210)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">D</text>
+        <text x="38.0" y="43.4" class="layerNav">⇤</text>
+      </g>
+      <g transform="translate(270)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">F</text>
+        <text x="38.0" y="43.4" class="layerNav">⇥</text>
+      </g>
+      <g transform="translate(330)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">G</text>
+      </g>
+    </g>
+    <g class="right">
+      <g transform="translate(390)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">H</text>
+        <text x="38.0" y="43.4" class="layerNav">←</text>
+      </g>
+      <g transform="translate(450)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">J</text>
+        <text x="38.0" y="43.4" class="layerNav">↓</text>
+      </g>
+      <g transform="translate(510)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">K</text>
+        <text x="38.0" y="43.4" class="layerNav">↑</text>
+      </g>
+      <g transform="translate(570)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">L</text>
+        <text x="38.0" y="43.4" class="layerNav">→</text>
+      </g>
+      <g transform="translate(630)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">;</text>
+        <text x="12.8" y="20.6" class="level2">:</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AB">
+    <g class="left">
+      <g transform="translate(90)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">Z</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^z</text>
+      </g>
+      <g transform="translate(150)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">X</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^x</text>
+      </g>
+      <g transform="translate(210)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">C</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^c</text>
+      </g>
+      <g transform="translate(270)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">V</text>
+        <text x="38.0" y="43.4" class="layerNav shortcut">^v</text>
+      </g>
+      <g transform="translate(330)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">B</text>
+      </g>
+    </g>
+    <g class="right">
+      <g transform="translate(390)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">N</text>
+        <text x="30.0" y="43.4" class="layerNav">🖰</text>
+        <text x="38.0" y="43.4" class="layerNav">←</text>
+      </g>
+      <g transform="translate(450)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="20.6" class="level2">M</text>
+        <text x="30.0" y="43.4" class="layerNav">🖰</text>
+        <text x="42.0" y="43.4" class="layerNav">↓</text>
+      </g>
+      <g transform="translate(510)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">,</text>
+        <text x="12.8" y="20.6" class="level2">&lt;</text>
+        <text x="30.0" y="43.4" class="layerNav">🖰</text>
+        <text x="42.0" y="43.4" class="layerNav">↑</text>
+      </g>
+      <g transform="translate(570)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">.</text>
+        <text x="12.8" y="20.6" class="level2">&gt;</text>
+        <text x="30.0" y="43.4" class="layerNav">🖰</text>
+        <text x="38.0" y="43.4" class="layerNav">→</text>
+      </g>
+      <g transform="translate(630)">
+        <rect width="52" height="52" rx="5" ry="5"/>
+        <text x="12.8" y="43.4" class="level1">/</text>
+        <text x="12.8" y="20.6" class="level2">?</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AA">
+    <g transform="translate(180)">
+      <rect width="82" height="52" rx="5" ry="5"/>
+      <text x="12.8" y="20.6" class="level2" style="font-size: 14px;">⌫</text>
+      <text x="64.8" y="42.8" class="layerNav" style="font-size: 14px;">⌦</text>
+    </g>
+    <g class="homeKey" transform="translate(270)">
+      <rect width="232" height="52" rx="5" ry="5" class="layerNav"/>
+      <text x="58.0" y="42.8" class="layer">navigation</text>
+    </g>
+    <g transform="translate(510)">
+      <rect width="82" height="52" rx="5" ry="5"/>
+      <text x="12.8" y="23.6" class="level2">⏎</text>
+      <text x="64.8" y="42.8" class="layerNav">⎋</text>
+    </g>
+  </g>
+
+</svg>

mods/selenium33/selenium.kbd

@@ -0,0 +1,162 @@
+;; Quick notes about the kanata configuration syntax:
+;;  - the syntax is Lisp-like but totally unrelated to Lisp, so no worries :-)
+;;  - comments are prefixed by double-semicolons
+;;  - only one `defsrc` is allowed, listing all keys handled by kanata
+;;  - up to 25 `deflayer` are allowed, one per layer emulation
+;;  - the underscore symbol `_` in `deflayer` sections means "transparent",
+;;    i.e. the previous layer behaviour is used when pressing that key
+
+;; `defsrc` defines the keys that will be intercepted by kanata.
+;; The order of the keys matches with deflayer declarations and all deflayer
+;; declarations must have the same number of keys as defsrc. Any keys not listed
+;; in defsrc will be passed straight to the operating system.
+(defsrc
+  q    w    e    r    t         y    u    i    o    p
+  a    s    d    f    g         h    j    k    l    ;
+  z    x    c    v    b         n    m    ,    .    /
+            lalt          spc             ralt
+)
+
+;; Base layer (active by default when kanata starts up):
+;;  - the 3 main thumb keys become mod/taps
+;;  - home-row mods on SDF and JKL
+;;  - CapsLock becomes Escape
+(deflayer qwerty
+  _    _    _    _    _         _    _    _    _    _    _
+  _    @ss  @dd  @ff  _         _    @jj  @kk  @ll  _    _
+  _    _    _    _    _         _    _    _    _    _    _
+            @sft          @nav            @ssm
+)
+
+;; Symbol layer
+(deflayer symbols
+  AG-q AG-w AG-e AG-r AG-t      AG-y AG-u AG-i AG-o AG-p
+  AG-a AG-s AG-d AG-f AG-g      AG-h AG-j AG-k AG-l AG-;
+  AG-z AG-x AG-c AG-v AG-b      AG-n AG-m AG-, AG-. AG-/
+            @num           spc            @sym
+)
+
+;; Numrow layer
+(deflayer numrow
+  S-1  S-2  S-3  S-4  S-5       S-6  S-7  S-8  S-9  S-0
+  1    2    3    4    5         6    7    8    9    0
+  @dk1 @dk2 @dk3 @dk4 @dk5      XX   -    ,    .    /
+            @num          S-spc           @sym
+)
+
+;; Numpad layer
+;;  - right: numpad below 798
+;;  - left: arrow bloc on ESDF + home/end + page up/down
+(deflayer numpad
+  XX   home up   end  pgup      XX   7    8    9    XX
+  XX   lft  down rght pgdn      -    4    5    6    0
+  XX   XX   XX   XX   XX        ,    1    2    3    .
+            @std           spc            @std
+)
+
+;; Num-Navigation layer:
+;;  - inherits from Numpad
+;;  - left: one-handed shortcuts (Cmd/Ctrl-AZXCV) + Tab/S-Tab
+;;  - top: Super-num (i3/sway) or Alt-num (browser), zoom in/out
+;; The `lrld` action stands for "live reload". This will re-parse everything
+;; except for linux-dev, i.e. you cannot live reload and switch keyboard devices.
+(deflayer numnav
+  tab  _    _    _    _         _    _    _    _    _
+  @all _    _    _    _         _    _    _    _    _
+  @ndo @cut @cpy @pst S-tab     _    _    _    _    _
+            _              _              _
+)
+
+;; Vim-Navigation layer:
+;;  - right: Vim-like arrows on HJKL, home/end page up/down, mouse scroll
+;;  - left: one-hand shortcuts (Cmd/Ctrl-WASZXCV), Tab/Shift-Tab, prev/next
+;;  - top: Super-num (i3/sway) or Alt-num (browser), zoom in/out
+;; The `lrld` action stands for "live reload". This will re-parse everything
+;; except for linux-dev, i.e. you cannot live reload and switch keyboard devices.
+(deflayer vimnav
+  @pad @cls bck  fwd  XX        home pgdn pgup end  M-p
+  @all @sav S-tab tab XX        lft  down up   rght @fun
+  @ndo @cut @cpy @pst XX        @mwl @mwd @mwu @mwr XX
+            del            _              esc
+)
+
+;; Function layer
+(deflayer funpad
+  f1   f2   f3   f4   XX        XX   XX   XX   XX   XX
+  f5   f6   f7   f8   XX        XX   lctl lalt lmet _
+  f9   f10  f11  f12  XX        XX   XX   XX   XX   XX
+       _    _              _              _
+)
+
+;; `defalias` is used to declare a shortcut for a more complicated action to keep
+;; the deflayer declarations clean and aligned. The alignment in deflayers is
+;; not necessary, but is highly recommended for ease of understanding visually.
+;; Aliases are referred to by `@<alias_name>`.
+(defalias
+  ;; tap: backtick (grave), hold: toggle layer-switching layer while held
+  ;; grl (tap-hold 200 200 grv (layer-toggle layers))
+
+  ;; layer-switch changes the base layer.
+  std (layer-switch qwerty)
+  pad (layer-switch numpad)
+
+  ;; layer-toggle shifts the layer while pressed
+  sym (layer-toggle symbols)
+  num (layer-toggle numrow)
+  fun (layer-toggle funpad)
+
+  ;; Main mod-tap: VimNav layer when hold, Space when tapped.
+  ;; The space key must be hold long enough (300ms) to become a layer shift.
+  nav (tap-hold 200 300 spc (layer-toggle vimnav))
+  ;; nav (tap-hold 200 300 spc (layer-toggle numnav))
+
+  ;; Space-cadet thumb keys: Shift/BackSpace, AltGr/Return
+  ;;  - acts as a modifier by default, or as BS/Ret when tapped separately;
+  ;;  - works great with Qwerty-Lafayette and Ergo-L keyboard layouts, where
+  ;;    neither Shift nor AltGr are used outside of the 3×10 main alpha keys.
+  sft (tap-hold-press 200 200 bspc lsft)
+  alt (tap-hold-press 200 200 ret ralt)
+  ssm (tap-hold-press 200 200 ret (layer-toggle symbols))
+
+  ;; Home-row mods
+  ;; Must be hold long enough (300ms) to become a modifier.
+  ss (tap-hold 200 300 s lmet)
+  dd (tap-hold 200 300 d lalt)
+  ff (tap-hold 200 300 f lctl)
+  jj (tap-hold 200 300 j rctl)
+  kk (tap-hold 200 300 k lalt)
+  ll (tap-hold 200 300 l rmet)
+
+  ;; Mouse wheel emulation
+  mwu (mwheel-up    50 120)
+  mwd (mwheel-down  50 120)
+  mwl (mwheel-left  50 120)
+  mwr (mwheel-right 50 120)
+
+  ;; shortcuts
+  all C-a
+  sav C-s
+  cls C-w
+  ndo C-z
+  cut C-x
+  cpy C-c
+  pst C-v
+
+  ;; Ergo-L/Lafayette dead-key macros
+  ;; 1dk o ;; Ergo-L
+  1dk ; ;; QWERTY-Lafayette
+  ;; digits must be escaped, otherwise they’re interpreted as delays in ms
+  ;; um1 (unmod 1) ;; raises an error, WTF?
+  1 1
+  2 2
+  3 3
+  4 4
+  5 5
+  dk1 (macro @1dk @1)
+  dk2 (macro @1dk @2)
+  dk3 (macro @1dk @3)
+  dk4 (macro @1dk @4)
+  dk5 (macro @1dk @5)
+)
+
+;; vim: set ft=lisp