--- a/html/images/ISOIEC-9995-3-FCD-2009A.svg Sun Sep 13 09:53:10 2009 +0900
+++ b/html/images/ISOIEC-9995-3-FCD-2009A.svg Mon Sep 14 16:19:39 2009 +0900
@@ -2,474 +2,534 @@
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%" viewBox="-2 -2 904 304">
- <title> fill="gainsboro" Common Secondary Layout of the Alphanumeric Zone of the Alphanumeric Section</title>
+ <title>ISO/IEC 9995-3:2009A, Common Secondary Layout of the Alphanumeric Zone of the Alphanumeric Section (with Primary Layout)</title>
<desc>A graphical depiction of an ISO standard defining layouts of computer keyboards.</desc>
<style type="text/css"><![CDATA[
- .left
- {
- fill: black;
- }
-
- .right
- {
- fill: blue;
- }
+ .primary {
+ fill: black;
+ stroke: none;
+ }
+
+ .secondary {
+ fill: blue;
+ stroke: none;
+ }
+
+ .center {
+ fill: black;
+ stroke: none;
+ }
+
+ .characterKey {
+ fill: #f5f5f5;
+ stroke: black;
+ }
+
+ .controlKey {
+ fill: #add8e6;
+ stroke: black;
+ }
+
+ .specialKey {
+ fill: #dcdcdc;
+ stroke: black;
+ }
]]></style>
-
-
- <rect id="keyboard" x="0" y="0" width="900" height="300" fill="gray" stroke="black" />
- <g font-family="'New Century Schoolbook', Palatino, Times, Courier, Helvetica, 'Cordia New', Ayuthaya, Tahoma, 'Arial Unicode MS', sans-serif" text-anchor="middle" font-size="15">
- <g transform="translate(0, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">~</text>
- <text class="left mid" x="10" y="35">`</text>
- <text class="right top" x="50" y="18">­</text>
- <text class="right mid" x="50" y="35">⁊</text>
- <text class="right bottom" x="50" y="52">|</text>
- </g>
- <g transform="translate(60, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">!</text>
- <text class="left mid" x="10" y="35">1</text>
- <text class="right top" x="50" y="18">¡</text>
- <text class="right mid" x="50" y="35">¹</text>
- <text class="right bottom" x="50" y="52">ʹ</text>
- </g>
- <g transform="translate(120, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">@</text>
- <text class="left mid" x="10" y="35">2</text>
- <text class="right top" x="50" y="18">¤</text>
- <text class="right mid" x="50" y="35">²</text>
- <text class="right bottom" x="50" y="52">ʺ</text>
- </g>
- <g transform="translate(180, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">#</text>
- <text class="left mid" x="10" y="35">3</text>
- <text class="right top" x="50" y="18">£</text>
- <text class="right mid" x="50" y="35">³</text>
- <text class="right bottom" x="50" y="52">ʿ</text>
- </g>
- <g transform="translate(240, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">$</text>
- <text class="left mid" x="10" y="35">4</text>
- <text class="right top" x="50" y="18">€</text>
- <text class="right mid" x="50" y="35">¼</text>
- <text class="right bottom" x="50" y="52">ʾ</text>
- </g>
- <g transform="translate(300, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">%</text>
- <text class="left mid" x="10" y="35">5</text>
- <text class="right top" x="50" y="18">↑</text>
- <text class="right mid" x="50" y="35">½</text>
- <text class="right bottom" x="50" y="52">ˁ</text>
- </g>
- <g transform="translate(360, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">^</text>
- <text class="left mid" x="10" y="35">6</text>
- <text class="right top" x="50" y="18">↓</text>
- <text class="right mid" x="50" y="35">¾</text>
- <text class="right bottom" x="50" y="52">ˀ</text>
- </g>
- <g transform="translate(420, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">&</text>
- <text class="left mid" x="10" y="35">7</text>
- <text class="right top" x="50" y="18">←</text>
- <text class="right mid" x="50" y="35">⅛</text>
- <text class="right bottom" x="50" y="52">{</text>
- </g>
- <g transform="translate(480, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">*</text>
- <text class="left mid" x="10" y="35">8</text>
- <text class="right top" x="50" y="18">→</text>
- <text class="right mid" x="50" y="35">⅜</text>
- <text class="right bottom" x="50" y="52">}</text>
- </g>
- <g transform="translate(540, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">(</text>
- <text class="left mid" x="10" y="35">9</text>
- <text class="right top" x="50" y="18">±</text>
- <text class="right mid" x="50" y="35">⅝</text>
- <text class="right bottom" x="50" y="52">[</text>
- </g>
- <g transform="translate(600, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">)</text>
- <text class="left mid" x="10" y="35">0</text>
- <text class="right top" x="50" y="18">™</text>
- <text class="right mid" x="50" y="35">⅞</text>
- <text class="right bottom" x="50" y="52">]</text>
- </g>
- <g transform="translate(660, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"></text>
- <text class="left mid" x="10" y="35"> </text>
- <text class="right top" x="50" y="18">¿</text>
- <text class="right mid" x="50" y="35">\</text>
- <text class="right bottom" x="50" y="52">ʻ</text>
- </g>
- <g transform="translate(720, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"></text>
- <text class="left mid" x="10" y="35"> </text>
- <text class="right top" x="50" y="18">̨</text>
- <text class="right mid" x="50" y="35">̧</text>
- <text class="right bottom" x="50" y="52">¬</text>
- </g>
- <g transform="translate(780, 0)">
- <rect x="0" y="0" width="120" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="60" y="35">Backspace</text>
- </g>
-
- <g transform="translate(0, 60)">
- <rect x="0" y="0" width="90" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="45" y="35">Tab</text>
- </g>
- <g transform="translate(90, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">Q</text>
- <text class="left mid" x="10" y="35">q</text>
- <text class="right top" x="50" y="18">Ɂ</text>
- <text class="right mid" x="50" y="35">ɂ</text>
- <text class="right bottom" x="50" y="52">̍</text>
- </g>
- <g transform="translate(150, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">W</text>
- <text class="left mid" x="10" y="35">w</text>
- <text class="right top" x="50" y="18">Ω</text>
- <text class="right mid" x="50" y="35">ʷ</text>
- <text class="right bottom" x="50" y="52">̇</text>
- </g>
- <g transform="translate(210, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">E</text>
- <text class="left mid" x="10" y="35">e</text>
- <text class="right top" x="50" y="18">Œ</text>
- <text class="right mid" x="50" y="35">œ</text>
- <text class="right bottom" x="50" y="52">̆</text>
- </g>
- <g transform="translate(270, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">R</text>
- <text class="left mid" x="10" y="35">r</text>
- <text class="right top" x="50" y="18">®</text>
- <text class="right mid" x="50" y="35">¶</text>
- <text class="right bottom" x="50" y="52">̂</text>
- </g>
- <g transform="translate(330, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">T</text>
- <text class="left mid" x="10" y="35">t</text>
- <text class="right top" x="50" y="18">Ꞌ</text>
- <text class="right mid" x="50" y="35">ꞌ</text>
- <text class="right bottom" x="50" y="52">̈</text>
- </g>
- <g transform="translate(390, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">Y</text>
- <text class="left mid" x="10" y="35">y</text>
- <text class="right top" x="50" y="18">¥</text>
- <text class="right mid" x="50" y="35">ɼ</text>
- <text class="right bottom" x="50" y="52">̑</text>
- </g>
- <g transform="translate(450, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">U</text>
- <text class="left mid" x="10" y="35">u</text>
- <text class="right top" x="50" y="18">Ȣ</text>
- <text class="right mid" x="50" y="35">ȣ</text>
- <text class="right bottom" x="50" y="52">̌</text>
- </g>
- <g transform="translate(510, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">I</text>
- <text class="left mid" x="10" y="35">i</text>
- <text class="right top" x="50" y="18">⅍</text>
- <text class="right mid" x="50" y="35">ı</text>
- <text class="right bottom" x="50" y="52">̓</text>
- </g>
- <g transform="translate(570, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">O</text>
- <text class="left mid" x="10" y="35">o</text>
- <text class="right top" x="50" y="18">Ø</text>
- <text class="right mid" x="50" y="35">ø</text>
- <text class="right bottom" x="50" y="52">̛</text>
- </g>
- <g transform="translate(630, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">P</text>
- <text class="left mid" x="10" y="35">p</text>
- <text class="right top" x="50" y="18">Þ</text>
- <text class="right mid" x="50" y="35">þ</text>
- <text class="right bottom" x="50" y="52">̉</text>
- </g>
- <g transform="translate(690, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">{</text>
- <text class="left mid" x="10" y="35">[</text>
- <text class="right top" x="50" y="18">̊</text>
- <text class="right mid" x="50" y="35">ſ</text>
- <text class="right bottom" x="50" y="52">̀</text>
- </g>
- <g transform="translate(750, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">}</text>
- <text class="left mid" x="10" y="35">]</text>
- <text class="right top" x="50" y="18">̄</text>
- <text class="right mid" x="50" y="35">̃</text>
- <text class="right bottom" x="50" y="52">@</text>
- </g>
- <g transform="translate(810, 60)">
- <rect x="0" y="0" width="90" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">|</text>
- <text class="left mid" x="10" y="35">\</text>
- <text class="right top" x="80" y="18">Ə</text>
- <text class="right mid" x="80" y="35">ə</text>
- <text class="right bottom" x="80" y="52">″</text>
+ <defs>
+ <path id="shiftArrow" stroke="#000000" stroke-width="2"
+ d="M0,-11 L-11,3 L-4,3 L-4,11 L4,11 L4,3 L11,3 Z"/>
+ <g id="capslockArrow">
+ <use xlink:href="#shiftArrow" fill="#000000"/>
+ <text x="0" y="0" font-size="9" font-family="Vedrana, sans-serif" fill="#ffffff" stroke="none" text-anchor="middle">A</text>
</g>
- <g transform="translate(0, 120)">
- <rect x="0" y="0" width="105" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="52.5" y="35">Caps Lock</text>
- </g>
- <g transform="translate(105, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">A</text>
- <text class="left mid" x="10" y="35">a</text>
- <text class="right top" x="50" y="18">Æ</text>
- <text class="right mid" x="50" y="35">æ</text>
- <text class="right bottom" x="50" y="52">̩</text>
- </g>
- <g transform="translate(165, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">S</text>
- <text class="left mid" x="10" y="35">s</text>
- <text class="right top" x="50" y="18">§</text>
- <text class="right mid" x="50" y="35">ß</text>
- <text class="right bottom" x="50" y="52">̣</text>
- </g>
- <g transform="translate(225, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">D</text>
- <text class="left mid" x="10" y="35">d</text>
- <text class="right top" x="50" y="18">Ð</text>
- <text class="right mid" x="50" y="35">ð</text>
- <text class="right bottom" x="50" y="52">̮</text>
- </g>
- <g transform="translate(285, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">F</text>
- <text class="left mid" x="10" y="35">f</text>
- <text class="right top" x="50" y="18">ª</text>
- <text class="right mid" x="50" y="35">ʔ</text>
- <text class="right bottom" x="50" y="52">̭</text>
- </g>
- <g transform="translate(345, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">G</text>
- <text class="left mid" x="10" y="35">g</text>
- <text class="right top" x="50" y="18">Ŋ</text>
- <text class="right mid" x="50" y="35">ŋ</text>
- <text class="right bottom" x="50" y="52">̱</text>
- </g>
- <g transform="translate(405, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">H</text>
- <text class="left mid" x="10" y="35">h</text>
- <text class="right top" x="50" y="18">Ɲ</text>
- <text class="right mid" x="50" y="35">ɲ</text>
- <text class="right bottom" x="50" y="52">̲</text>
- </g>
- <g transform="translate(465, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">J</text>
- <text class="left mid" x="10" y="35">j</text>
- <text class="right top" x="50" y="18">IJ</text>
- <text class="right mid" x="50" y="35">ij</text>
- <text class="right bottom" x="50" y="52">̥</text>
- </g>
- <g transform="translate(525, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">K</text>
- <text class="left mid" x="10" y="35">k</text>
- <text class="right top" x="50" y="18">̥</text>
- <text class="right mid" x="50" y="35">ĸ</text>
- <text class="right bottom" x="50" y="52">̵</text>
- </g>
- <g transform="translate(585, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">L</text>
- <text class="left mid" x="10" y="35">l</text>
- <text class="right top" x="50" y="18">Ł</text>
- <text class="right mid" x="50" y="35">ł</text>
- <text class="right bottom" x="50" y="52"≯</text>
- </g>
- <g transform="translate(645, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">:</text>
- <text class="left mid" x="10" y="35">;</text>
- <text class="right top" x="50" y="18">̋</text>
- <text class="right mid" x="50" y="35">́</text>
- <text class="right bottom" x="50" y="52">°</text>
- </g>
- <g transform="translate(705, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">"</text>
- <text class="left mid" x="10" y="35">'</text>
- <text class="right top" x="50" y="18">ẞ</text>
- <text class="right mid" x="50" y="35">ƛ</text>
- <text class="right bottom" x="50" y="52">′</text>
- </g>
- <g transform="translate(765, 120)">
- <rect x="0" y="0" width="135" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="67.5" y="35">Enter</text>
- </g>
-
- <g transform="translate(0, 180)">
- <rect x="0" y="0" width="75" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="37.5" y="35">Shift</text>
- </g>
- <g transform="translate(75, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"></text>
- <text class="left mid" x="10" y="35"> </text>
- <text class="right top" x="50" y="18">¦</text>
- <text class="right mid" x="50" y="35">ʼn</text>
- <text class="right bottom" x="50" y="52">♪</text>
+ <path
+ style="fill:#000000;"
+ d="M 787.5,172.5 L 787.5,157.5 L 772.5,165 L 787.5,172.5 z "
+ id="path5745" />
+ <marker id="arrow" viewBox="-13 -5 14 10" refX="-4" markerWidth="10" markerHeight="20" orient="auto">
+ <path d="M-8,-3 L0,0 -8,3 Z" stroke="black" fill="black"/>
+ </marker>
+
+ </defs>
+
+ <rect id="keyboard" x="0" y="0" width="900" height="300" fill="#222222" stroke="black" />
+ <g class="characterKey" font-family="'New Century Schoolbook', Palatino, Times, Courier, Helvetica, 'Cordia New', Ayuthaya, Tahoma, 'Arial Unicode MS', sans-serif" text-anchor="middle" font-size="15">
+
+ <g id="row-E">
+ <title>Row E</title>
+ <g class="characterKey" transform="translate(0, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">~</text>
+ <text class="primary unshifted" x="10" y="35">`</text>
+ <text class="secondary shifted" x="50" y="18">­</text>
+ <text class="secondary unshifted" x="50" y="35">⁊</text>
+ <text class="secondary extra" x="50" y="52">|</text>
+ </g>
+ <g class="characterKey" transform="translate(60, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">!</text>
+ <text class="primary unshifted" x="10" y="35">1</text>
+ <text class="secondary shifted" x="50" y="18">¡</text>
+ <text class="secondary unshifted" x="50" y="35">¹</text>
+ <text class="secondary extra" x="50" y="52">ʹ</text>
+ </g>
+ <g class="characterKey" transform="translate(120, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">@</text>
+ <text class="primary unshifted" x="10" y="35">2</text>
+ <text class="secondary shifted" x="50" y="18">¤</text>
+ <text class="secondary unshifted" x="50" y="35">²</text>
+ <text class="secondary extra" x="50" y="52">ʺ</text>
+ </g>
+ <g class="characterKey" transform="translate(180, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">#</text>
+ <text class="primary unshifted" x="10" y="35">3</text>
+ <text class="secondary shifted" x="50" y="18">£</text>
+ <text class="secondary unshifted" x="50" y="35">³</text>
+ <text class="secondary extra" x="50" y="52">ʿ</text>
+ </g>
+ <g class="characterKey" transform="translate(240, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">$</text>
+ <text class="primary unshifted" x="10" y="35">4</text>
+ <text class="secondary shifted" x="50" y="18">€</text>
+ <text class="secondary unshifted" x="50" y="35">¼</text>
+ <text class="secondary extra" x="50" y="52">ʾ</text>
+ </g>
+ <g class="characterKey" transform="translate(300, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">%</text>
+ <text class="primary unshifted" x="10" y="35">5</text>
+ <text class="secondary shifted" x="50" y="18">↑</text>
+ <text class="secondary unshifted" x="50" y="35">½</text>
+ <text class="secondary extra" x="50" y="52">ˁ</text>
+ </g>
+ <g class="characterKey" transform="translate(360, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">^</text>
+ <text class="primary unshifted" x="10" y="35">6</text>
+ <text class="secondary shifted" x="50" y="18">↓</text>
+ <text class="secondary unshifted" x="50" y="35">¾</text>
+ <text class="secondary extra" x="50" y="52">ˀ</text>
+ </g>
+ <g class="characterKey" transform="translate(420, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">&</text>
+ <text class="primary unshifted" x="10" y="35">7</text>
+ <text class="secondary shifted" x="50" y="18">←</text>
+ <text class="secondary unshifted" x="50" y="35">⅛</text>
+ <text class="secondary extra" x="50" y="52">{</text>
+ </g>
+ <g class="characterKey" transform="translate(480, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">*</text>
+ <text class="primary unshifted" x="10" y="35">8</text>
+ <text class="secondary shifted" x="50" y="18">→</text>
+ <text class="secondary unshifted" x="50" y="35">⅜</text>
+ <text class="secondary extra" x="50" y="52">}</text>
+ </g>
+ <g class="characterKey" transform="translate(540, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">(</text>
+ <text class="primary unshifted" x="10" y="35">9</text>
+ <text class="secondary shifted" x="50" y="18">±</text>
+ <text class="secondary unshifted" x="50" y="35">⅝</text>
+ <text class="secondary extra" x="50" y="52">[</text>
+ </g>
+ <g class="characterKey" transform="translate(600, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">)</text>
+ <text class="primary unshifted" x="10" y="35">0</text>
+ <text class="secondary shifted" x="50" y="18">™</text>
+ <text class="secondary unshifted" x="50" y="35">⅞</text>
+ <text class="secondary extra" x="50" y="52">]</text>
+ </g>
+ <g class="characterKey" transform="translate(660, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"></text>
+ <text class="primary unshifted" x="10" y="35"> </text>
+ <text class="secondary shifted" x="50" y="18">¿</text>
+ <text class="secondary unshifted" x="50" y="35">\</text>
+ <text class="secondary extra" x="50" y="52">ʻ</text>
+ </g>
+ <g class="characterKey" transform="translate(720, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"></text>
+ <text class="primary unshifted" x="10" y="35"> </text>
+ <text class="secondary shifted" x="50" y="18">̨</text>
+ <text class="secondary unshifted" x="50" y="35">̧</text>
+ <text class="secondary extra" x="50" y="52">¬</text>
+ </g>
+ <g class="controlKey" transform="translate(780, 0)">
+ <rect x="1" y="1" width="118" height="58" rx="6" ry="6"/>
+ <text class="center" x="60" y="25">Backspace</text>
+ <path d="M80,45 H40" stroke-width="2" stroke="black" fill="none" marker-end="url(#arrow)"/>
+ </g>
</g>
- <g transform="translate(135, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">Z</text>
- <text class="left mid" x="10" y="35">z</text>
- <text class="right top" x="50" y="18">Ʒ</text>
- <text class="right mid" x="50" y="35">ʒ</text>
- <text class="right bottom" x="50" y="52">«</text>
- </g>
- <g transform="translate(195, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">X</text>
- <text class="left mid" x="10" y="35">x</text>
- <text class="right top" x="50" y="18">‚</text>
- <text class="right mid" x="50" y="35">„</text>
- <text class="right bottom" x="50" y="52">»</text>
- </g>
- <g transform="translate(255, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">C</text>
- <text class="left mid" x="10" y="35">c</text>
- <text class="right top" x="50" y="18">©</text>
- <text class="right mid" x="50" y="35">¢</text>
- <text class="right bottom" x="50" y="52">―</text>
- </g>
- <g transform="translate(315, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">V</text>
- <text class="left mid" x="10" y="35">v</text>
- <text class="right top" x="50" y="18">‘</text>
- <text class="right mid" x="50" y="35">“</text>
- <text class="right bottom" x="50" y="52">‹</text>
- </g>
- <g transform="translate(375, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">B</text>
- <text class="left mid" x="10" y="35">b</text>
- <text class="right top" x="50" y="18">’</text>
- <text class="right mid" x="50" y="35">”</text>
- <text class="right bottom" x="50" y="52">›</text>
- </g>
- <g transform="translate(435, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">N</text>
- <text class="left mid" x="10" y="35">n</text>
- <text class="right top" x="50" y="18">Ƞ</text>
- <text class="right mid" x="50" y="35">ƞ</text>
- <text class="right bottom" x="50" y="52">–</text>
- </g>
- <g transform="translate(495, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18">M</text>
- <text class="left mid" x="10" y="35">m</text>
- <text class="right top" x="50" y="18">º</text>
- <text class="right mid" x="50" y="35">µ</text>
- <text class="right bottom" x="50" y="52">—</text>
+
+ <g id="row-D">
+ <title>Row D</title>
+ <g class="controlKey" transform="translate(0, 60)">
+ <rect x="1" y="1" width="88" height="58" rx="6" ry="6"/>
+ <text class="center" x="45" y="25">Tab</text>
+ <path d="M28,32 V42 M63,37 H35" stroke-width="2" stroke="black" fill="none" marker-end="url(#arrow)"/>
+ <path d="M62,40 V50 M27,45 H55" stroke-width="2" stroke="black" fill="none" marker-end="url(#arrow)"/>
+ </g>
+ <g class="characterKey" transform="translate(90, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">Q</text>
+ <text class="primary unshifted" x="10" y="35">q</text>
+ <text class="secondary shifted" x="50" y="18">Ɂ</text>
+ <text class="secondary unshifted" x="50" y="35">ɂ</text>
+ <text class="secondary extra" x="50" y="52">̍</text>
+ </g>
+ <g class="characterKey" transform="translate(150, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">W</text>
+ <text class="primary unshifted" x="10" y="35">w</text>
+ <text class="secondary shifted" x="50" y="18">Ω</text>
+ <text class="secondary unshifted" x="50" y="35">ʷ</text>
+ <text class="secondary extra" x="50" y="52">̇</text>
+ </g>
+ <g class="characterKey" transform="translate(210, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">E</text>
+ <text class="primary unshifted" x="10" y="35">e</text>
+ <text class="secondary shifted" x="50" y="18">Œ</text>
+ <text class="secondary unshifted" x="50" y="35">œ</text>
+ <text class="secondary extra" x="50" y="52">̆</text>
+ </g>
+ <g class="characterKey" transform="translate(270, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">R</text>
+ <text class="primary unshifted" x="10" y="35">r</text>
+ <text class="secondary shifted" x="50" y="18">®</text>
+ <text class="secondary unshifted" x="50" y="35">¶</text>
+ <text class="secondary extra" x="50" y="52">̂</text>
+ </g>
+ <g class="characterKey" transform="translate(330, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">T</text>
+ <text class="primary unshifted" x="10" y="35">t</text>
+ <text class="secondary shifted" x="50" y="18">Ꞌ</text>
+ <text class="secondary unshifted" x="50" y="35">ꞌ</text>
+ <text class="secondary extra" x="50" y="52">̈</text>
+ </g>
+ <g class="characterKey" transform="translate(390, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">Y</text>
+ <text class="primary unshifted" x="10" y="35">y</text>
+ <text class="secondary shifted" x="50" y="18">¥</text>
+ <text class="secondary unshifted" x="50" y="35">ɼ</text>
+ <text class="secondary extra" x="50" y="52">̑</text>
+ </g>
+ <g class="characterKey" transform="translate(450, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">U</text>
+ <text class="primary unshifted" x="10" y="35">u</text>
+ <text class="secondary shifted" x="50" y="18">Ȣ</text>
+ <text class="secondary unshifted" x="50" y="35">ȣ</text>
+ <text class="secondary extra" x="50" y="52">̌</text>
+ </g>
+ <g class="characterKey" transform="translate(510, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">I</text>
+ <text class="primary unshifted" x="10" y="35">i</text>
+ <text class="secondary shifted" x="50" y="18">⅍</text>
+ <text class="secondary unshifted" x="50" y="35">ı</text>
+ <text class="secondary extra" x="50" y="52">̓</text>
+ </g>
+ <g class="characterKey" transform="translate(570, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">O</text>
+ <text class="primary unshifted" x="10" y="35">o</text>
+ <text class="secondary shifted" x="50" y="18">Ø</text>
+ <text class="secondary unshifted" x="50" y="35">ø</text>
+ <text class="secondary extra" x="50" y="52">̛</text>
+ </g>
+ <g class="characterKey" transform="translate(630, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">P</text>
+ <text class="primary unshifted" x="10" y="35">p</text>
+ <text class="secondary shifted" x="50" y="18">Þ</text>
+ <text class="secondary unshifted" x="50" y="35">þ</text>
+ <text class="secondary extra" x="50" y="52">̉</text>
+ </g>
+ <g class="characterKey" transform="translate(690, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">{</text>
+ <text class="primary unshifted" x="10" y="35">[</text>
+ <text class="secondary shifted" x="50" y="18">̊</text>
+ <text class="secondary unshifted" x="50" y="35">ſ</text>
+ <text class="secondary extra" x="50" y="52">̀</text>
+ </g>
+ <g class="characterKey" transform="translate(750, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">}</text>
+ <text class="primary unshifted" x="10" y="35">]</text>
+ <text class="secondary shifted" x="50" y="18">̄</text>
+ <text class="secondary unshifted" x="50" y="35">̃</text>
+ <text class="secondary extra" x="50" y="52">@</text>
+ </g>
+ <g class="characterKey" transform="translate(810, 60)">
+ <rect x="1" y="1" width="88" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">|</text>
+ <text class="primary unshifted" x="10" y="35">\</text>
+ <text class="secondary shifted" x="80" y="18">Ə</text>
+ <text class="secondary unshifted" x="80" y="35">ə</text>
+ <text class="secondary extra" x="80" y="52">″</text>
+ </g>
</g>
- <g transform="translate(555, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"></text>
- <text class="left mid" x="10" y="35"> </text>
- <text class="right top" x="50" y="18">×</text>
- <text class="right mid" x="50" y="35">…</text>
- <text class="right bottom" x="50" y="52">$</text>
- </g>
- <g transform="translate(615, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"></text>
- <text class="left mid" x="10" y="35"> </text>
- <text class="right top" x="50" y="18">÷</text>
- <text class="right mid" x="50" y="35">·</text>
- <text class="right bottom" x="50" y="52">#</text>
- </g>
- <g transform="translate(675, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"></text>
- <text class="left mid" x="10" y="35"> </text>
- <text class="right top" x="50" y="18">Ŀ</text>
- <text class="right mid" x="50" y="35">ŀ</text>
- <text class="right bottom" x="50" y="52">‑</text>
- </g>
- <g transform="translate(735, 180)">
- <rect x="0" y="0" width="165" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="82.5" y="35">Shift</text>
+
+ <g id="row-C">
+ <title>Row C</title>
+ <g class="controlKey" transform="translate(0, 120)">
+ <rect x="1" y="1" width="103" height="58" rx="6" ry="6"/>
+ <text class="center" x="52.5" y="25">Caps Lock</text>
+ <use xlink:href="#capslockArrow" x="52.5" y="42"/>
+ </g>
+ <g class="characterKey" transform="translate(105, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">A</text>
+ <text class="primary unshifted" x="10" y="35">a</text>
+ <text class="secondary shifted" x="50" y="18">Æ</text>
+ <text class="secondary unshifted" x="50" y="35">æ</text>
+ <text class="secondary extra" x="50" y="52">̩</text>
+ </g>
+ <g class="characterKey" transform="translate(165, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">S</text>
+ <text class="primary unshifted" x="10" y="35">s</text>
+ <text class="secondary shifted" x="50" y="18">§</text>
+ <text class="secondary unshifted" x="50" y="35">ß</text>
+ <text class="secondary extra" x="50" y="52">̣</text>
+ </g>
+ <g class="characterKey" transform="translate(225, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">D</text>
+ <text class="primary unshifted" x="10" y="35">d</text>
+ <text class="secondary shifted" x="50" y="18">Ð</text>
+ <text class="secondary unshifted" x="50" y="35">ð</text>
+ <text class="secondary extra" x="50" y="52">̮</text>
+ </g>
+ <g class="characterKey" transform="translate(285, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">F</text>
+ <text class="primary unshifted" x="10" y="35">f</text>
+ <text class="secondary shifted" x="50" y="18">ª</text>
+ <text class="secondary unshifted" x="50" y="35">ʔ</text>
+ <text class="secondary extra" x="50" y="52">̭</text>
+ </g>
+ <g class="characterKey" transform="translate(345, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">G</text>
+ <text class="primary unshifted" x="10" y="35">g</text>
+ <text class="secondary shifted" x="50" y="18">Ŋ</text>
+ <text class="secondary unshifted" x="50" y="35">ŋ</text>
+ <text class="secondary extra" x="50" y="52">̱</text>
+ </g>
+ <g class="characterKey" transform="translate(405, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">H</text>
+ <text class="primary unshifted" x="10" y="35">h</text>
+ <text class="secondary shifted" x="50" y="18">Ɲ</text>
+ <text class="secondary unshifted" x="50" y="35">ɲ</text>
+ <text class="secondary extra" x="50" y="52">̲</text>
+ </g>
+ <g class="characterKey" transform="translate(465, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">J</text>
+ <text class="primary unshifted" x="10" y="35">j</text>
+ <text class="secondary shifted" x="50" y="18">IJ</text>
+ <text class="secondary unshifted" x="50" y="35">ij</text>
+ <text class="secondary extra" x="50" y="52">̥</text>
+ </g>
+ <g class="characterKey" transform="translate(525, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">K</text>
+ <text class="primary unshifted" x="10" y="35">k</text>
+ <text class="secondary shifted" x="50" y="18">̥</text>
+ <text class="secondary unshifted" x="50" y="35">ĸ</text>
+ <text class="secondary extra" x="50" y="52">̵</text>
+ </g>
+ <g class="characterKey" transform="translate(585, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">L</text>
+ <text class="primary unshifted" x="10" y="35">l</text>
+ <text class="secondary shifted" x="50" y="18">Ł</text>
+ <text class="secondary unshifted" x="50" y="35">ł</text>
+ <text class="secondary extra" x="50" y="52"≯</text>
+ </g>
+ <g class="characterKey" transform="translate(645, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">:</text>
+ <text class="primary unshifted" x="10" y="35">;</text>
+ <text class="secondary shifted" x="50" y="18">̋</text>
+ <text class="secondary unshifted" x="50" y="35">́</text>
+ <text class="secondary extra" x="50" y="52">°</text>
+ </g>
+ <g class="characterKey" transform="translate(705, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">"</text>
+ <text class="primary unshifted" x="10" y="35">'</text>
+ <text class="secondary shifted" x="50" y="18">ẞ</text>
+ <text class="secondary unshifted" x="50" y="35">ƛ</text>
+ <text class="secondary extra" x="50" y="52">′</text>
+ </g>
+ <g class="controlKey" transform="translate(765, 120)">
+ <rect x="1" y="1" width="133" height="58" rx="6" ry="6"/>
+ <text class="center" x="67.5" y="25">Enter</text>
+ <path d="M87,35 V45 H57" stroke-width="2" stroke="black" fill="none" marker-end="url(#arrow)"/>
+ </g>
</g>
-
- <g transform="translate(0, 240)">
- <rect x="0" y="0" width="105" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="52.5" y="35">Control</text>
- </g>
- <g transform="translate(105, 240)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="30" y="25">Win<tspan x="30" y="45">Key</tspan></text>
- </g>
- <g transform="translate(165, 240)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="30" y="35">Alt</text>
+
+ <g id="row-B">
+ <title>Row B</title>
+ <g class="controlKey" transform="translate(0, 180)">
+ <rect x="1" y="1" width="73" height="58" rx="6" ry="6"/>
+ <text class="center" x="37.5" y="25">Shift</text>
+ <use xlink:href="#shiftArrow" x="37.5" y="42"/>
+ </g>
+ <g class="specialKey" transform="translate(75, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"></text>
+ <text class="primary unshifted" x="10" y="35"> </text>
+ <text class="secondary shifted" x="50" y="18">¦</text>
+ <text class="secondary unshifted" x="50" y="35">ʼn</text>
+ <text class="secondary extra" x="50" y="52">♪</text>
+ </g>
+ <g class="characterKey" transform="translate(135, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">Z</text>
+ <text class="primary unshifted" x="10" y="35">z</text>
+ <text class="secondary shifted" x="50" y="18">Ʒ</text>
+ <text class="secondary unshifted" x="50" y="35">ʒ</text>
+ <text class="secondary extra" x="50" y="52">«</text>
+ </g>
+ <g class="characterKey" transform="translate(195, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">X</text>
+ <text class="primary unshifted" x="10" y="35">x</text>
+ <text class="secondary shifted" x="50" y="18">‚</text>
+ <text class="secondary unshifted" x="50" y="35">„</text>
+ <text class="secondary extra" x="50" y="52">»</text>
+ </g>
+ <g class="characterKey" transform="translate(255, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">C</text>
+ <text class="primary unshifted" x="10" y="35">c</text>
+ <text class="secondary shifted" x="50" y="18">©</text>
+ <text class="secondary unshifted" x="50" y="35">¢</text>
+ <text class="secondary extra" x="50" y="52">―</text>
+ </g>
+ <g class="characterKey" transform="translate(315, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">V</text>
+ <text class="primary unshifted" x="10" y="35">v</text>
+ <text class="secondary shifted" x="50" y="18">‘</text>
+ <text class="secondary unshifted" x="50" y="35">“</text>
+ <text class="secondary extra" x="50" y="52">‹</text>
+ </g>
+ <g class="characterKey" transform="translate(375, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">B</text>
+ <text class="primary unshifted" x="10" y="35">b</text>
+ <text class="secondary shifted" x="50" y="18">’</text>
+ <text class="secondary unshifted" x="50" y="35">”</text>
+ <text class="secondary extra" x="50" y="52">›</text>
+ </g>
+ <g class="characterKey" transform="translate(435, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">N</text>
+ <text class="primary unshifted" x="10" y="35">n</text>
+ <text class="secondary shifted" x="50" y="18">Ƞ</text>
+ <text class="secondary unshifted" x="50" y="35">ƞ</text>
+ <text class="secondary extra" x="50" y="52">–</text>
+ </g>
+ <g class="characterKey" transform="translate(495, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18">M</text>
+ <text class="primary unshifted" x="10" y="35">m</text>
+ <text class="secondary shifted" x="50" y="18">º</text>
+ <text class="secondary unshifted" x="50" y="35">µ</text>
+ <text class="secondary extra" x="50" y="52">—</text>
+ </g>
+ <g class="characterKey" transform="translate(555, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"></text>
+ <text class="primary unshifted" x="10" y="35"> </text>
+ <text class="secondary shifted" x="50" y="18">×</text>
+ <text class="secondary unshifted" x="50" y="35">…</text>
+ <text class="secondary extra" x="50" y="52">$</text>
+ </g>
+ <g class="characterKey" transform="translate(615, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"></text>
+ <text class="primary unshifted" x="10" y="35"> </text>
+ <text class="secondary shifted" x="50" y="18">÷</text>
+ <text class="secondary unshifted" x="50" y="35">·</text>
+ <text class="secondary extra" x="50" y="52">#</text>
+ </g>
+ <g class="characterKey" transform="translate(675, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"></text>
+ <text class="primary unshifted" x="10" y="35"> </text>
+ <text class="secondary shifted" x="50" y="18">Ŀ</text>
+ <text class="secondary unshifted" x="50" y="35">ŀ</text>
+ <text class="secondary extra" x="50" y="52">‑</text>
+ </g>
+ <g class="controlKey" transform="translate(735, 180)">
+ <rect x="1" y="1" width="163" height="58" rx="6" ry="6"/>
+ <text class="center" x="82.5" y="25">Shift</text>
+ <use xlink:href="#shiftArrow" x="82.5" y="42"/>
+ </g>
</g>
- <g transform="translate(225, 240)">
- <rect x="0" y="0" width="420" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="left top" x="10" y="18"> </text>
- <text class="mid" x="210" y="35">(Space)</text>
- <text class="right top" x="415" y="18" text-anchor="end">ZWNJ</text>
- <text class="right mid" x="415" y="35" text-anchor="end">‌ NNBSP</text>
- <text class="right bottom" x="415" y="52" text-anchor="end">  NBSP</text>
- </g>
- <g transform="translate(645, 240)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="30" y="25">Alt<tspan x="30" y="45">Graph</tspan></text>
- </g>
- <g transform="translate(705, 240)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="30" y="25">Win<tspan x="30" y="45">Key</tspan></text>
- </g>
- <g transform="translate(765, 240)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="30" y="35">Menu</text>
- </g>
- <g transform="translate(825, 240)">
- <rect x="0" y="0" width="75" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
- <text class="mid" x="37.5" y="35">Control</text>
+
+ <g id="row-A">
+ <title>Row A</title>
+ <g class="controlKey" transform="translate(0, 240)">
+ <rect x="1" y="1" width="103" height="58" rx="6" ry="6"/>
+ <text class="center" x="52.5" y="35">Control</text>
+ </g>
+ <g class="controlKey" transform="translate(105, 240)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="center" x="30" y="25">Win<tspan x="30" y="45">Key</tspan></text>
+ </g>
+ <g class="controlKey" transform="translate(165, 240)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="center" x="30" y="35">Alt</text>
+ </g>
+ <g class="characterKey" transform="translate(225, 240)">
+ <rect x="1" y="1" width="418" height="58" rx="6" ry="6"/>
+ <text class="primary shifted" x="10" y="18"> </text>
+ <text class="center" x="210" y="35">(Space)</text>
+ <text class="secondary shifted" x="415" y="18" text-anchor="end">ZWNJ</text>
+ <text class="secondary unshifted" x="415" y="35" text-anchor="end">‌ NNBSP</text>
+ <text class="secondary extra" x="415" y="52" text-anchor="end">  NBSP</text>
+ </g>
+ <g class="controlKey" transform="translate(645, 240)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="center" x="30" y="25">Alt<tspan x="30" y="45">Graph</tspan></text>
+ </g>
+ <g class="controlKey" transform="translate(705, 240)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="center" x="30" y="25">Win<tspan x="30" y="45">Key</tspan></text>
+ </g>
+ <g class="controlKey" transform="translate(765, 240)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
+ <text class="center" x="30" y="35">Menu</text>
+ </g>
+ <g class="controlKey" transform="translate(825, 240)">
+ <rect x="1" y="1" width="73" height="58" rx="6" ry="6"/>
+ <text class="center" x="37.5" y="35">Control</text>
+ </g>
</g>
</g>
+
</svg>
--- a/html/images/ISOIEC-9995-8-2006.svg Sun Sep 13 09:53:10 2009 +0900
+++ b/html/images/ISOIEC-9995-8-2006.svg Mon Sep 14 16:19:39 2009 +0900
@@ -2,83 +2,84 @@
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%" viewBox="-2 -2 184 244">
- <title>ISO/IEC 9995-8:2006 Allocation of letters to the keys of a numeric keypad</title>
+ <title>ISO/IEC 9995-8:2006, Allocation of letters to the keys of a numeric keypad</title>
<desc>A graphical depiction of an ISO standard defining layouts of numeric keypads, with distribution of letters on the keys.</desc>
<style type="text/css"><![CDATA[
- .left
- {
- fill: black;
- }
-
- .right
- {
- fill: blue;
- }
+ .key
+ {
+ fill: #f5f5f5;
+ stroke: #000000;
+ }
+ .key text
+ {
+ fill: #000000;
+ stroke: none;
+ }
]]></style>
- <rect id="keyboard" x="0" y="0" width="180" height="240" fill="gray" stroke="black" />
- <g font-family="'New Century Schoolbook', Palatino, Times, Courier, Helvetica, 'Cordia New', Ayuthaya, Tahoma, 'Arial Unicode MS', sans-serif" text-anchor="middle" font-size="15">
- <g transform="translate(0, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <rect id="keyboard" x="0" y="0" width="180" height="240" fill="#222222" stroke="black" />
+ <g class="key" font-family="'New Century Schoolbook', Palatino, Times, Courier, Helvetica, 'Cordia New', Ayuthaya, Tahoma, 'Arial Unicode MS', sans-serif" text-anchor="middle" font-size="15">
+ <g class="key" transform="translate(0, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">1</text>
</g>
- <g transform="translate(60, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(60, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">2</text>
<text class="mid" x="30" y="18"><tspan>A</tspan><tspan>B</tspan><tspan>C</tspan></text>
</g>
- <g transform="translate(120, 0)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(120, 0)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">3</text>
<text class="mid" x="30" y="18"><tspan>D</tspan><tspan>E</tspan><tspan>F</tspan></text>
</g>
- <g transform="translate(0, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(0, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">4</text>
<text class="mid" x="30" y="18"><tspan>G</tspan><tspan>H</tspan><tspan>I</tspan></text>
</g>
- <g transform="translate(60, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(60, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">5</text>
<text class="mid" x="30" y="18"><tspan>J</tspan><tspan>K</tspan><tspan>L</tspan></text>
</g>
- <g transform="translate(120, 60)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(120, 60)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">6</text>
<text class="mid" x="30" y="18"><tspan>M</tspan><tspan>N</tspan><tspan>O</tspan></text>
</g>
- <g transform="translate(0, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(0, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">7</text>
<text class="mid" x="30" y="18"><tspan>P</tspan><tspan>Q</tspan><tspan>R</tspan><tspan>S</tspan></text>
</g>
- <g transform="translate(60, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(60, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">8</text>
<text class="mid" x="30" y="18"><tspan>T</tspan><tspan>U</tspan><tspan>V</tspan></text>
</g>
- <g transform="translate(120, 120)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(120, 120)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">9</text>
<text class="mid" x="30" y="18"><tspan>W</tspan><tspan>X</tspan><tspan>Y</tspan><tspan>Z</tspan></text>
</g>
- <g transform="translate(0, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(0, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">*</text>
</g>
- <g transform="translate(60, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(60, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">0</text>
</g>
- <g transform="translate(120, 180)">
- <rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
+ <g class="key" transform="translate(120, 180)">
+ <rect x="1" y="1" width="58" height="58" rx="6" ry="6"/>
<text class="mid" x="30" y="35">#</text>
</g>
</g>