From 0e9f39106f79d353be2465a6e633a3d9cce4d494 Mon Sep 17 00:00:00 2001
From: Fabien Cazenave <fabi1cazenave@users.noreply.github.com>
Date: Thu, 28 Dec 2023 01:02:49 +0100
Subject: [PATCH] use an SVG screenshot (#27)

---
 README.md      |    2 +-
 keyboard.svg   | 1001 ++++++++++++++++++++++++++++++++++++++++++++++++
 screenshot.png |  Bin 17113 -> 0 bytes
 src/content.js |   13 +-
 4 files changed, 1008 insertions(+), 8 deletions(-)
 create mode 100644 keyboard.svg
 delete mode 100644 screenshot.png

diff --git a/README.md b/README.md
index ff67529..2574d0f 100644
--- a/README.md
+++ b/README.md
@@ -3,7 +3,7 @@
 
 A zero-dependency web component to display and emulate keyboard layouts.
 
-![screenshot](screenshot.png)
+![screenshot](keyboard.svg)
 
 [Online demo here.](https://fabi1cazenave.github.io/x-keyboard/)
 
diff --git a/keyboard.svg b/keyboard.svg
new file mode 100644
index 0000000..4b25798
--- /dev/null
+++ b/keyboard.svg
@@ -0,0 +1,1001 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 300"
+  platform="gnu" theme="" class="iso intlBackslash">
+
+<style>
+  rect, path {
+    stroke: #666;
+    stroke-width: .5px;
+    fill: #f8f8f8;
+  }
+  .specialKey,
+  .specialKey rect,
+  .specialKey path {
+    fill: #e4e4e4;
+  }
+  text {
+    fill: #333;
+    font: normal 20px sans-serif;
+    text-align: center;
+  }
+  #Backspace text {
+    font-size: 12px;
+  }
+
+  #Escape { display: none; }
+
+  #row_AE { transform: translate(4px, 4px); }
+  #row_AD { transform: translate(4px, 64px); }
+  #row_AC { transform: translate(4px, 124px); }
+  #row_AB { transform: translate(4px, 184px); }
+  #row_AA { transform: translate(4px, 244px); }
+
+  /* Backslash + Enter */
+  #Enter path.alt,
+  #Enter     .iso,
+  #Backslash .iso,
+  .alt #Enter rect.ansi,
+  .iso #Enter rect.ansi,
+  .iso #Enter text.ansi,
+  .alt #Backslash .ansi,
+  .iso #Backslash .ansi { display: none; }
+  #Enter text.ansi,
+  .alt #Enter     .alt,
+  .iso #Enter     .iso,
+  .iso #Backslash .iso { display: block; }
+  .iso #Backslash { transform: translate(765px, 60px); }
+  .alt #Backslash { transform: translate(780px, -60px); }
+
+  /* Backspace + IntlYen */
+  #IntlYen, #Backspace .alt,
+  .intlYen  #Backspace .ansi { display: none; }
+  .intlYen  #Backspace .alt,
+  .intlYen  #IntlYen { display: block; }
+
+  /* ShiftLeft + IntlBackslash */
+  #IntlBackslash, #ShiftLeft .iso,
+  .intlBackslash  #ShiftLeft .ansi { display: none; }
+  .intlBackslash  #ShiftLeft .iso,
+  .intlBackslash  #IntlBackslash { display: block; }
+
+  /* ShiftRight + IntlRo */
+  #IntlRo, #ShiftRight .abnt,
+  .intlRo  #ShiftRight .ansi { display: none; }
+  .intlRo  #ShiftRight .abnt,
+  .intlRo  #IntlRo { display: block; }
+
+  .specialKey   .ergo,
+  .specialKey   .ol60,
+  .specialKey   .ol50,
+  .specialKey   .ol40,
+  #Space        .ol60,
+  #Space        .ol50,
+  #Space        .ol40,
+  #Backquote    .ol60,
+  #BracketRight .ol60,
+  #Equal        .ol60,
+  .ergo #CapsLock,
+  .ergo #Space      rect,
+  .ergo #Backslash  rect,
+  .ergo .specialKey rect,
+  .ergo .specialKey text { display: none; }
+  .ol50 #Escape,
+  .ol40 #Escape,
+  .ol60 #Space        .ol60,
+  .ol50 #Space        .ol50,
+  .ol40 #Space        .ol40,
+  .ol60 #Backquote    .ol60,
+  .ol60 #BracketRight .ol60,
+  .ol60 #Backslash    .ol60,
+  .ol60 #Equal        .ol60,
+  .ol60 .specialKey   .ol60,
+  .ol50 .specialKey   .ol50,
+  .ol40 .specialKey   .ol40,
+  .ergo .specialKey   .ergo { display: block; }
+
+  .ol50 .pinkyKey, .ol50 #ContextMenu,
+  .ol40 .pinkyKey, .ol40 #ContextMenu,
+  .ol40 #row_AE .numberKey { display: none; }
+
+  .ergo #row_AE       { transform: translate(94px, 4px); }
+  .ergo #row_AD       { transform: translate(64px, 64px); }
+  .ergo #row_AC       { transform: translate(49px, 124px); }
+  .ergo #row_AB       { transform: translate(19px, 184px); }
+
+  .ergo #Tab          { transform: translate(15px, 0px); }
+  .ergo #ShiftLeft    { transform: translate(60px, 0px); }
+  .ergo #ControlLeft  { transform: translate(75px, 0px); }
+  .ergo #MetaLeft     { transform: translate(150px, 0px); }
+  .ergo #AltLeft      { transform: translate(240px, 0px); }
+  .ergo #Space        { transform: translate(315px, 0px); }
+  .ergo #AltRight     { transform: translate(540px, 0px); }
+  .ergo #MetaRight    { transform: translate(630px, 0px); }
+  .ergo #ControlRight { transform: translate(750px, 0px); }
+
+  .ergo .left         { transform: translate(-15px, 0px); }
+  .ergo .right        { transform: translate(15px, 0px); }
+
+  .ol60 .left         { transform: translate(-75px, 0px); }
+  .ol60 #ControlRight { transform: translate(810px, 0px); }
+  .ol60 #Backquote    { transform: translate(-15px, 0px); }
+  .ol60 #ShiftRight   { transform: translate(795px, 0px); }
+  .ol60 #ContextMenu  { transform: translate(750px, 0px); }
+  .ol60 #Backslash    { transform: translate(690px, 120px); }
+  .ol60 #Backspace    { transform: translate(277.5px, 60px); }
+  .ol60 #Enter        { transform: translate(322.5px, 60px); }
+
+  .ol50 #Escape       { transform: translate(-15px, 0px); }
+  .ol50 #Backspace    { transform: translate(660px, 0px); }
+  .ol50 #Enter        { transform: translate(705px, -60px); }
+
+  .ol40 #Escape       { transform: translate(-15px, 120px); }
+  .ol40 #Backspace    { transform: translate(660px, 60px); }
+  .ol40 #Enter        { transform: translate(705px, 0px); }
+
+  [platform="gnu"].ergo .specialKey .win,
+  [platform="gnu"].ergo .specialKey .mac,
+  [platform="win"].ergo .specialKey .gnu,
+  [platform="win"].ergo .specialKey .mac { display: none; }
+  .ergo .specialKey .mac,
+  [platform="gnu"].ergo .specialKey .gnu,
+  [platform="win"].ergo .specialKey .win { display: block; }
+
+  /* swap Alt/Meta for MacOSX */
+  [platform="gnu"].ergo #MetaLeft,
+  [platform="win"].ergo #MetaLeft,
+                  .ergo #AltLeft   { transform: translate(150px, 0px); }
+  [platform="gnu"].ergo #AltLeft,
+  [platform="win"].ergo #AltLeft,
+                  .ergo #MetaLeft  { transform: translate(240px, 0px); }
+  [platform="gnu"].ergo #AltRight,
+  [platform="win"].ergo #AltRight,
+                  .ergo #MetaRight { transform: translate(570px, 0px); }
+  [platform="gnu"].ergo #MetaRight,
+  [platform="win"].ergo #MetaRight,
+                  .ergo #AltRight  { transform: translate(660px, 0px); }
+
+  #NonConvert, #Convert, #KanaMode,
+  #Lang1, #Lang2,
+  #Space .jis,
+  #Space .ks,
+  .ks  #Space .ansi,
+  .ks  #Space .jis,
+  .jis #Space .ansi,
+  .jis #Space .ks { display: none; }
+  .ks  #Space .ks,
+  .jis #NonConvert, .jis #Convert, .jis #KanaMode,
+  .ks #Lang1, .ks #Lang2,
+  .jis #Space .jis { display: block; }
+
+  #Backquote .jis,
+  #CapsLock  .jis,
+  .jis #Backquote .ansi,
+  .jis #CapsLock  .ansi { display: none; }
+  .jis #Backquote .jis,
+  .jis #CapsLock .jis { display: block; }
+
+  #Lang1 text,
+  #Lang2 text,
+  #Convert text,
+  #NonConvert text,
+  .jis #CapsLock text { font-size: 14px; }
+  #KanaMode text,
+  .jis #Backquote text { font-size: 10px; }
+
+  .specialKey .win,
+  .specialKey .gnu {
+    display: none;
+    font-size: 14px;
+  }
+
+  /* display MacOSX by default */
+  [platform="gnu"] .specialKey .win,
+  [platform="gnu"] .specialKey .mac,
+  [platform="win"] .specialKey .gnu,
+  [platform="win"] .specialKey .mac { display: none; }
+  [platform="mac"] .specialKey .mac,
+  [platform="gnu"] .specialKey .gnu,
+  [platform="win"] .specialKey .win { display: block; }
+
+  /* swap Alt/Meta for MacOSX */
+  [platform="gnu"] #MetaLeft,
+  [platform="win"] #MetaLeft,  #AltLeft   { transform: translate(75px, 0px); }
+  [platform="gnu"] #AltLeft,
+  [platform="win"] #AltLeft,   #MetaLeft  { transform: translate(150px, 0px); }
+  [platform="gnu"] #AltRight,
+  [platform="win"] #AltRight,  #MetaRight { transform: translate(600px, 0px); }
+  [platform="gnu"] #MetaRight,
+  [platform="win"] #MetaRight, #AltRight  { transform: translate(675px, 0px); }
+
+  g:target rect, .press rect,
+  g:target path, .press path {
+    fill: #aad;
+  }
+
+  [theme="reach"] .pinkyKey  rect { fill: hsl(  0, 100%, 90%); }
+  [theme="reach"] .numberKey rect { fill: hsl( 42, 100%, 90%); }
+  [theme="reach"] .letterKey rect { fill: hsl(122, 100%, 90%); }
+  [theme="reach"] .homeKey   rect { fill: hsl(122, 100%, 75%); }
+  [theme="reach"] .press     rect { fill: #aaf; }
+
+  [theme="hints"] [finger="m1"] rect { fill: hsl(  0, 100%, 95%); }
+  [theme="hints"] [finger="l2"] rect { fill: hsl( 42, 100%, 85%); }
+  [theme="hints"] [finger="r2"] rect { fill: hsl( 61, 100%, 85%); }
+  [theme="hints"] [finger="l3"] rect,
+  [theme="hints"] [finger="r3"] rect { fill: hsl(136, 100%, 85%); }
+  [theme="hints"] [finger="l4"] rect,
+  [theme="hints"] [finger="r4"] rect { fill: hsl(200, 100%, 85%); }
+  [theme="hints"] [finger="l5"] rect,
+  [theme="hints"] [finger="r5"] rect { fill: hsl(230, 100%, 85%); }
+  [theme="hints"] .specialKey   rect,
+  [theme="hints"] .specialKey   path { fill: #e4e4e4; }
+  [theme="hints"] .hint         rect { fill: #a33; }
+  [theme="hints"] .press        rect { fill: #335; }
+  [theme="hints"] .press        text { fill: #fff; }
+  [theme="hints"] .hint text {
+    font-weight: bold;
+    fill: white;
+  }
+
+  /* dimmed AltGr + bold dead keys */
+  .level3, .level4 { fill: blue; opacity: .5; }
+  .level5, .level6 { fill: green; }
+  .deadKey {
+    fill: red;
+    font-size: 14px;
+  }
+  .diacritic  {
+    font-size: 20px;
+    font-weight: bolder;
+  }
+
+  /* hide Level4 (Shift+AltGr) unless AltGr is pressed */
+  .level4        { display: none; }
+  .altgr .level4 { display: block; }
+
+  /* highlight AltGr + Dead Keys */
+  .dk .level1, .altgr .level1,
+  .dk .level2, .altgr .level2 { opacity: 0.25; }
+  .dk .level5, .altgr .level3,
+  .dk .level6, .altgr .level4 { opacity: 1; }
+  .dk .level3,
+  .dk .level4 { display: none; }
+
+  @media (prefers-color-scheme: dark) {
+    rect, path { stroke: #777; fill: #444; }
+    .specialKey, .specialKey rect, .specialKey path { fill: #333; }
+    g:target rect, .press rect, g:target path, .press path { fill: #558; }
+    text { fill: #999; }
+    .level3, .level4 { fill: #99f; }
+    .level5, .level6 { fill: #6d6; }
+    .deadKey { fill: #f44; }
+
+    [theme="reach"] .pinkyKey  rect { fill: hsl(  0, 60%, 25%); }
+    [theme="reach"] .numberKey rect { fill: hsl( 42, 60%, 27%); }
+    [theme="reach"] .letterKey rect { fill: hsl(122, 75%, 20%); }
+    [theme="reach"] .homeKey   rect { fill: hsl(122, 70%, 25%); }
+    [theme="reach"] .press     rect { fill: #449; }
+
+    [theme="hints"] [finger="m1"] rect { fill: hsl(  0, 100%, 95%); }
+    [theme="hints"] [finger="l2"] rect { fill: hsl( 42, 100%, 85%); }
+    [theme="hints"] [finger="r2"] rect { fill: hsl( 61, 100%, 85%); }
+    [theme="hints"] [finger="l3"] rect,
+    [theme="hints"] [finger="r3"] rect { fill: hsl(136, 100%, 85%); }
+    [theme="hints"] [finger="l4"] rect,
+    [theme="hints"] [finger="r4"] rect { fill: hsl(200, 100%, 85%); }
+    [theme="hints"] [finger="l5"] rect,
+    [theme="hints"] [finger="r5"] rect { fill: hsl(230, 100%, 85%); }
+    [theme="hints"] .specialKey   rect,
+    [theme="hints"] .specialKey   path { fill: #e4e4e4; }
+    [theme="hints"] .hint         rect { fill: #a33; }
+    [theme="hints"] .press        rect { fill: #335; }
+    [theme="hints"] .press        text { fill: #fff; }
+    [theme="hints"] .hint text {
+      font-weight: bold;
+      fill: white;
+    }
+  }
+
+</style>
+
+  <g id="row_AE" text-anchor="middle">
+    <g class="left">
+      <g class="specialKey" finger="l5" id="Escape" transform="translate(0, 0)">
+        <rect class="ergo" width="67" height="52" rx="5" ry="5"/>
+        <text class="ergo" width="22" height="22" x="16.4" y="42.8">⎋</text>
+      </g>
+      <g class="pinkyKey" finger="l5" id="Backquote" transform="translate(0, 0)">
+        <rect class="specialKey jis" width="52" height="52" rx="5" ry="5"/>
+        <rect class="ansi alt iso" width="52" height="52" rx="5" ry="5"/>
+        <rect class="ol60" width="67" height="52" rx="5" ry="5"/>
+        <text class="jis" width="22" height="22" x="26" y="20">半角</text>
+        <text class="jis" width="22" height="22" x="26" y="32">全角</text>
+        <text class="jis" width="22" height="22" x="26" y="44">漢字</text>
+        <g class="ansi key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">`</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">~</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="l5" id="Digit1" transform="translate(60, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">1</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">!</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="l5" id="Digit2" transform="translate(120, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">2</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">@</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="l4" id="Digit3" transform="translate(180, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">3</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">#</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="l3" id="Digit4" transform="translate(240, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">4</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">€</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="l2" id="Digit5" transform="translate(300, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">5</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">%</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+    </g>
+    <g class="right">
+      <g class="numberKey" finger="l2" id="Digit6" transform="translate(360, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">6</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">^</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="r2" id="Digit7" transform="translate(420, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">7</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">&amp;</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="r2" id="Digit8" transform="translate(480, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">8</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">*</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="r3" id="Digit9" transform="translate(540, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">9</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">«</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="numberKey" finger="r4" id="Digit0" transform="translate(600, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">0</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">»</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="Minus" transform="translate(660, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">-</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">_</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="Equal" transform="translate(720, 0)">
+        <rect class="ansi" width="52" height="52" rx="5" ry="5"/>
+        <rect class="ol60" width="67" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">=</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">+</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="IntlYen" transform="translate(780, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key"/>
+      </g>
+      <g class="specialKey" finger="r5" id="Backspace" transform="translate(780, 0)">
+        <rect class="ansi" width="112" height="52" rx="5" ry="5"/>
+        <rect class="ol60" width="67" height="112" rx="5" ry="5" y="-60"/>
+        <rect class="ol40 ol50" width="67" height="52" rx="5" ry="5"/>
+        <rect class="alt" width="52" height="52" rx="5" ry="5" x="60"/>
+        <text class="ansi" width="22" height="22" x="16.4" y="42.8">⌫</text>
+        <text class="ergo" width="22" height="22" x="16.4" y="42.8">⌫</text>
+        <text class="alt" width="22" height="22" x="16.4" y="42.8" transform="translate(60, 0)">⌫</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AD" text-anchor="middle">
+    <g class="left">
+      <g class="specialKey" finger="l5" id="Tab" transform="translate(0, 0)">
+        <rect class="" width="82" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="67" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="16.4" y="42.8">↹</text>
+        <text class="ergo" width="22" height="22" x="16.4" y="42.8">↹</text>
+      </g>
+      <g class="letterKey" finger="l5" id="KeyQ" transform="translate(90, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">Q</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">@</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l4" id="KeyW" transform="translate(150, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">W</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">&lt;</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">≤</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l3" id="KeyE" transform="translate(210, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">E</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">&gt;</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">≥</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l2" id="KeyR" transform="translate(270, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">R</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">$</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l2" id="KeyT" transform="translate(330, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">T</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">%</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">‰</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+    </g>
+    <g class="right">
+      <g class="letterKey" finger="r2" id="KeyY" transform="translate(390, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">Y</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">^</text>
+          <text class="level4 deadKey diacritic" width="22" height="22" x="38" y="20.6"> ̂</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r2" id="KeyU" transform="translate(450, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">U</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">&amp;</text>
+          <text class="level4 deadKey" width="22" height="22" x="38" y="20.6">µ</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r3" id="KeyI" transform="translate(510, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">I</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">*</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">×</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r4" id="KeyO" transform="translate(570, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">O</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">&apos;</text>
+          <text class="level4 deadKey diacritic" width="22" height="22" x="38" y="20.6"> ́</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r5" id="KeyP" transform="translate(630, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">P</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">`</text>
+          <text class="level4 deadKey diacritic" width="22" height="22" x="38" y="20.6"> ̀</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="BracketLeft" transform="translate(690, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">[</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">{</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="BracketRight" transform="translate(750, 0)">
+        <rect class="ansi" width="52" height="52" rx="5" ry="5"/>
+        <rect class="ol60" width="67" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">]</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">}</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="Backslash" transform="translate(810, 0)">
+        <rect class="ansi" width="82" height="52" rx="5" ry="5"/>
+        <rect class="iso ol60" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">\</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">|</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AC" text-anchor="middle">
+    <g class="left">
+      <g class="specialKey" finger="l5" id="CapsLock" transform="translate(0, 0)">
+        <rect class="" width="97" height="52" rx="5" ry="5"/>
+        <text class="ansi" width="22" height="22" x="16.4" y="42.8">⇪</text>
+        <text class="jis" width="22" height="22" x="23" y="42.8">英数</text>
+      </g>
+      <g class="letterKey homeKey" finger="l5" id="KeyA" transform="translate(105, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">A</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">{</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="l4" id="KeyS" transform="translate(165, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">S</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">(</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">⁽</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="l3" id="KeyD" transform="translate(225, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">D</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">)</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">⁾</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="l2" id="KeyF" transform="translate(285, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">F</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">}</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l2" id="KeyG" transform="translate(345, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">G</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">=</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">≃</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+    </g>
+    <g class="right">
+      <g class="letterKey" finger="r2" id="KeyH" transform="translate(405, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">H</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">\</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="r2" id="KeyJ" transform="translate(465, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">J</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">+</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">±</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="r3" id="KeyK" transform="translate(525, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">K</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">-</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">¬</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="r4" id="KeyL" transform="translate(585, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">L</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">/</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">÷</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey homeKey" finger="r5" id="Semicolon" transform="translate(645, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2 deadKey" width="22" height="22" x="12.8" y="20.6">★</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">&quot;</text>
+          <text class="level4 deadKey diacritic" width="22" height="22" x="38" y="20.6"> ̈</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="Quote" transform="translate(705, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">&apos;</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">&quot;</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="specialKey" finger="r5" id="Enter" transform="translate(765, 0)">
+        <path class="alt" d="M50,-60 h72 a5,5 0 0 1 5,5 v102 a5,5 0 0 1 -5,5 h-117 a5,5 0 0 1 -5,-5 v-42 a5,5 0 0 1 5,-5 h35 a5,5 1 0 0 5,-5 v-50 a5,5 0 0 1 5,-5 z"/>
+        <path class="iso" d="M50,-60 h72 a5,5 0 0 1 5,5 v102 a5,5 0 0 1 -5,5 h-57 a5,5 0 0 1 -5,-5 v-50 a5,5 1 0 0 -5,-5 h-5 a5,5 0 0 1 -5,-5 v-42 a5,5 0 0 1 5,-5 z"/>
+        <rect class="ansi" width="127" height="52" rx="5" ry="5"/>
+        <rect class="ol60" width="67" height="112" rx="5" ry="5" y="-60"/>
+        <rect class="ol40 ol50" width="67" height="52" rx="5" ry="5"/>
+        <text class="ansi alt ergo" width="22" height="22" x="16.4" y="42.8">⏎</text>
+        <text class="iso" width="22" height="22" x="16.4" y="42.8" transform="translate(60, 0)">⏎</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AB" text-anchor="middle">
+    <g class="left">
+      <g class="specialKey" finger="l5" id="ShiftLeft" transform="translate(0, 0)">
+        <rect class="ansi alt" width="127" height="52" rx="5" ry="5"/>
+        <rect class="iso" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ol50 ol60" width="67" height="112" rx="5" ry="5" y="-60"/>
+        <rect class="ol40" width="67" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="16.4" y="42.8">⇧</text>
+        <text class="ergo" width="22" height="22" x="16.4" y="42.8">⇧</text>
+      </g>
+      <g class="letterKey" finger="l5" id="IntlBackslash" transform="translate(75, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">&lt;</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">&gt;</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4"/>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l5" id="KeyZ" transform="translate(135, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">Z</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">~</text>
+          <text class="level4 deadKey diacritic" width="22" height="22" x="38" y="20.6"> ̃</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l4" id="KeyX" transform="translate(195, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">X</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">[</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l3" id="KeyC" transform="translate(255, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">C</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">]</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l2" id="KeyV" transform="translate(315, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">V</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">_</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="l2" id="KeyB" transform="translate(375, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">B</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">#</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+    </g>
+    <g class="right">
+      <g class="letterKey" finger="r2" id="KeyN" transform="translate(435, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">N</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">|</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6">¦</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r2" id="KeyM" transform="translate(495, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4"/>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">M</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">!</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r3" id="Comma" transform="translate(555, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">,</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">;</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">;</text>
+          <text class="level4 deadKey diacritic" width="22" height="22" x="38" y="20.6"> ̧</text>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r4" id="Period" transform="translate(615, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">.</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">:</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">:</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="letterKey" finger="r5" id="Slash" transform="translate(675, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key">
+          <text class="level1" width="22" height="22" x="12.8" y="43.4">/</text>
+          <text class="level2" width="22" height="22" x="12.8" y="20.6">?</text>
+          <text class="level3" width="22" height="22" x="38" y="43.4">?</text>
+          <text class="level4" width="22" height="22" x="38" y="20.6"/>
+          <text class="level5 dk" width="22" height="22" x="38" y="43.4"/>
+          <text class="level6 dk" width="22" height="22" x="38" y="20.6"/>
+        </g>
+      </g>
+      <g class="pinkyKey" finger="r5" id="IntlRo" transform="translate(735, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <g class="key"/>
+      </g>
+      <g class="specialKey" finger="r5" id="ShiftRight" transform="translate(735, 0)">
+        <rect class="ansi" width="157" height="52" rx="5" ry="5"/>
+        <rect class="abnt" width="97" height="52" rx="5" ry="5" x="60"/>
+        <rect class="ol50 ol60" width="67" height="112" rx="5" ry="5" y="-60"/>
+        <rect class="ol40" width="67" height="52" rx="5" ry="5"/>
+        <text class="ansi" width="22" height="22" x="16.4" y="42.8">⇧</text>
+        <text class="ergo" width="22" height="22" x="16.4" y="42.8">⇧</text>
+        <text class="abnt" width="22" height="22" x="16.4" y="42.8" transform="translate(60, 0)">⇧</text>
+      </g>
+    </g>
+  </g>
+
+  <g id="row_AA" text-anchor="middle">
+    <g class="left">
+      <g class="specialKey" finger="l5" id="ControlLeft" transform="translate(0, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="67" height="52" rx="5" ry="5"/>
+        <text class="win gnu" width="22" height="22" x="11" y="42.8" text-anchor="start">Ctrl</text>
+        <text class="mac" width="22" height="22" x="16.4" y="42.8">⌃</text>
+      </g>
+      <g class="specialKey" finger="l1" id="MetaLeft" transform="translate(75, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="82" height="52" rx="5" ry="5"/>
+        <text class="win" width="22" height="22" x="11" y="42.8" text-anchor="start">Win</text>
+        <text class="gnu" width="22" height="22" x="11" y="42.8" text-anchor="start">Super</text>
+        <text class="mac" width="22" height="22" x="16.4" y="42.8">⌘</text>
+      </g>
+      <g class="specialKey" finger="l1" id="AltLeft" transform="translate(150, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="82" height="52" rx="5" ry="5"/>
+        <text class="win gnu" width="22" height="22" x="11" y="42.8" text-anchor="start">Alt</text>
+        <text class="mac" width="22" height="22" x="16.4" y="42.8">⌥</text>
+      </g>
+      <g class="specialKey" finger="l1" id="Lang2" transform="translate(225, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="20" y="42.8">한자</text>
+      </g>
+      <g class="specialKey" finger="l1" id="NonConvert" transform="translate(225, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="26" y="42.8">無変換</text>
+      </g>
+    </g>
+    <g class="homeKey" finger="m1" id="Space" transform="translate(225, 0)">
+      <rect class="ansi" width="367" height="52" rx="5" ry="5"/>
+      <rect class="ol60" width="322" height="52" rx="5" ry="5" x="-60"/>
+      <rect class="ol50 ol40" width="262" height="52" rx="5" ry="5"/>
+      <rect class="ks" width="247" height="52" rx="5" ry="5" x="60"/>
+      <rect class="jis" width="187" height="52" rx="5" ry="5" x="60"/>
+    </g>
+    <g class="right">
+      <g class="specialKey" finger="r1" id="Convert" transform="translate(480, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="26" y="42.8">変換</text>
+      </g>
+      <g class="specialKey" finger="r1" id="KanaMode" transform="translate(540, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="26" y="20">カタカナ</text>
+        <text class="" width="22" height="22" x="26" y="32">ひらがな</text>
+        <text class="" width="22" height="22" x="26" y="44">ローマ字</text>
+      </g>
+      <g class="specialKey" finger="r1" id="Lang1" transform="translate(540, 0)">
+        <rect class="" width="52" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="20" y="42.8">한/영</text>
+      </g>
+      <g class="specialKey" finger="r1" id="AltRight" transform="translate(600, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="82" height="52" rx="5" ry="5"/>
+        <text class="win gnu" width="22" height="22" x="11" y="42.8" text-anchor="start">Alt</text>
+        <text class="mac" width="22" height="22" x="16.4" y="42.8">⌥</text>
+      </g>
+      <g class="specialKey" finger="r1" id="MetaRight" transform="translate(690, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="82" height="52" rx="5" ry="5"/>
+        <text class="win" width="22" height="22" x="11" y="42.8" text-anchor="start">Win</text>
+        <text class="gnu" width="22" height="22" x="11" y="42.8" text-anchor="start">Super</text>
+        <text class="mac" width="22" height="22" x="16.4" y="42.8">⌘</text>
+      </g>
+      <g class="specialKey" finger="r5" id="ContextMenu" transform="translate(750, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="52" height="52" rx="5" ry="5"/>
+        <text class="" width="22" height="22" x="16.4" y="42.8">☰</text>
+        <text class="ol60" width="22" height="22" x="16.4" y="42.8">☰</text>
+      </g>
+      <g class="specialKey" finger="r5" id="ControlRight" transform="translate(825, 0)">
+        <rect class="" width="67" height="52" rx="5" ry="5"/>
+        <rect class="ergo" width="67" height="52" rx="5" ry="5"/>
+        <text class="win gnu" width="22" height="22" x="11" y="42.8" text-anchor="start">Ctrl</text>
+        <text class="mac" width="22" height="22" x="16.4" y="42.8">⌃</text>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/screenshot.png b/screenshot.png
deleted file mode 100644
index 0416a6a4e64a1206136244f429bcc93598870a89..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 17113
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

diff --git a/src/content.js b/src/content.js
index f623498..2984c32 100644
--- a/src/content.js
+++ b/src/content.js
@@ -78,7 +78,6 @@ const text = (content, cname = '', attributes) => sgml('text', {
   height: 0.50,
   x: 0.34,
   y: 0.78,
-  'text-anchor': 'middle',
   ...attributes,
 }, [content]);
 
@@ -95,7 +94,7 @@ const gKey = (className, finger, x, id, children = emptyKey) => sgml('g', {
  */
 
 const keyLevel = (level, label, position) => {
-  const attrs = { 'text-anchor': 'middle', ...position };
+  const attrs = { ...position };
   const symbol = dkSymbols[label] || '';
   const content = symbol || (label || '').slice(-1);
   let className = '';
@@ -382,10 +381,10 @@ const baseRow = g('left', [
 export const svgContent = `
   <svg viewBox="0 0 ${KEY_WIDTH * 15} ${KEY_WIDTH * 5}"
       xmlns="http://www.w3.org/2000/svg">
-    <g id="row_AE"> ${numberRow}  </g>
-    <g id="row_AD"> ${letterRow1} </g>
-    <g id="row_AC"> ${letterRow2} </g>
-    <g id="row_AB"> ${letterRow3} </g>
-    <g id="row_AA"> ${baseRow}    </g>
+    <g id="row_AE" text-anchor="middle"> ${numberRow}  </g>
+    <g id="row_AD" text-anchor="middle"> ${letterRow1} </g>
+    <g id="row_AC" text-anchor="middle"> ${letterRow2} </g>
+    <g id="row_AB" text-anchor="middle"> ${letterRow3} </g>
+    <g id="row_AA" text-anchor="middle"> ${baseRow}    </g>
   </svg>
 `;