fix(illustrations): use svg images from keyboard-drawer
This commit is contained in:
16
README.md
16
README.md
@@ -45,7 +45,7 @@ base with GASC homerow mods.
|
||||
|
||||
The base layer looks like this:
|
||||
|
||||
|
||||
|
||||
|
||||
`PERMISSIVE_HOLD` is disabled on home row keys to avoid false positive on rolls,
|
||||
and enabled for thumb keys as there are few false positives in this case.
|
||||
@@ -53,18 +53,24 @@ and enabled for thumb keys as there are few false positives in this case.
|
||||
The internal thumb keys move to the nav/numpad layer on hold or space/tap on
|
||||
tap. This layer is the following:
|
||||
|
||||
|
||||
|
||||
|
||||
Finally, pressing both internal thumb keys (or left external one) leads to the
|
||||
Finally, holding both internal thumb keys (or holding left external one) leads to the
|
||||
function/mouse nav layer:
|
||||
|
||||
|
||||
|
||||
|
||||
This layer also allows accessing custom layers, such as here layer 3 that is the
|
||||
`qwerty-ergol` compatibility layer or the layer 4 which is a gaming layer (not
|
||||
described here).
|
||||
|
||||
When I’m using multiple xkeyboard layouts, my shortcut to switch between them is
|
||||
double shifts, that’s why there is also a binding for that (and why it’s the
|
||||
only one that is symmetrically correct in the homerow mods in the base layer).
|
||||
|
||||
The illustrations were made using
|
||||
[keymap-drawer](https://github.com/caksoylar/keymap-drawer/tree/main).
|
||||
|
||||
## Left to do
|
||||
|
||||
- [ ] Replace `png` images with `svg`
|
||||
- [ ] Automatize the firmware generations
|
||||
|
||||
BIN
img/Layer-0.png
BIN
img/Layer-0.png
Binary file not shown.
|
Before Width: | Height: | Size: 22 KiB |
298
img/Layer-0.svg
Normal file
298
img/Layer-0.svg
Normal file
@@ -0,0 +1,298 @@
|
||||
<svg width="732" height="455" viewBox="0 0 732 455" class="keymap" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<style>/* inherit to force styles through use tags */
|
||||
svg path {
|
||||
fill: inherit;
|
||||
}
|
||||
|
||||
/* font and background color specifications */
|
||||
svg.keymap {
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 14px;
|
||||
font-kerning: normal;
|
||||
text-rendering: optimizeLegibility;
|
||||
fill: #24292e;
|
||||
}
|
||||
|
||||
/* default key styling */
|
||||
rect.key {
|
||||
fill: #f6f8fa;
|
||||
}
|
||||
|
||||
rect.key, rect.combo {
|
||||
stroke: #c9cccf;
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
/* default key side styling, only used is draw_key_sides is set */
|
||||
rect.side {
|
||||
filter: brightness(90%);
|
||||
}
|
||||
|
||||
/* color accent for combo boxes */
|
||||
rect.combo, rect.combo-separate {
|
||||
fill: #cdf;
|
||||
}
|
||||
|
||||
/* color accent for held keys */
|
||||
rect.held, rect.combo.held {
|
||||
fill: #fdd;
|
||||
}
|
||||
|
||||
/* color accent for ghost (optional) keys */
|
||||
rect.ghost, rect.combo.ghost {
|
||||
stroke-dasharray: 4, 4;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
text {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: middle;
|
||||
}
|
||||
|
||||
/* styling for layer labels */
|
||||
text.label {
|
||||
font-weight: bold;
|
||||
text-anchor: start;
|
||||
stroke: white;
|
||||
stroke-width: 4;
|
||||
paint-order: stroke;
|
||||
}
|
||||
|
||||
/* styling for optional footer */
|
||||
text.footer {
|
||||
text-anchor: end;
|
||||
dominant-baseline: auto;
|
||||
stroke: white;
|
||||
stroke-width: 4;
|
||||
paint-order: stroke;
|
||||
}
|
||||
|
||||
/* styling for combo tap, and key non-tap label text */
|
||||
text.combo, text.hold, text.shifted, text.left, text.right {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
text.hold {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: auto;
|
||||
}
|
||||
|
||||
text.shifted {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: hanging;
|
||||
}
|
||||
|
||||
text.left {
|
||||
text-anchor: start;
|
||||
}
|
||||
|
||||
text.right {
|
||||
text-anchor: end;
|
||||
}
|
||||
|
||||
text.layer-activator {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* styling for hold/shifted label text in combo box */
|
||||
text.combo.hold, text.combo.shifted, text.combo.left, text.combo.right {
|
||||
font-size: 8px;
|
||||
}
|
||||
|
||||
/* lighter symbol for transparent keys */
|
||||
text.trans {
|
||||
fill: #7b7e81;
|
||||
}
|
||||
|
||||
/* styling for combo dendrons */
|
||||
path.combo {
|
||||
stroke-width: 1;
|
||||
stroke: gray;
|
||||
fill: none;
|
||||
}
|
||||
|
||||
/* Start Tabler Icons Cleanup */
|
||||
/* cannot use height/width with glyphs */
|
||||
.icon-tabler > path {
|
||||
fill: inherit;
|
||||
stroke: inherit;
|
||||
stroke-width: 2;
|
||||
}
|
||||
/* hide tabler's default box */
|
||||
.icon-tabler > path[stroke="none"][fill="none"] {
|
||||
visibility: hidden;
|
||||
}
|
||||
/* End Tabler Icons Cleanup */
|
||||
</style>
|
||||
<g transform="translate(30, 0)" class="layer-Base">
|
||||
<text x="0" y="28" class="label" id="Base">Base:</text>
|
||||
<g transform="translate(0, 56)">
|
||||
<g transform="translate(28, 81)" class="key keypos-0">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">Q</text>
|
||||
</g>
|
||||
<g transform="translate(84, 46)" class="key keypos-1">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">W</text>
|
||||
</g>
|
||||
<g transform="translate(140, 28)" class="key keypos-2">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">E</text>
|
||||
</g>
|
||||
<g transform="translate(196, 44)" class="key keypos-3">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">R</text>
|
||||
</g>
|
||||
<g transform="translate(252, 52)" class="key keypos-4">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">T</text>
|
||||
</g>
|
||||
<g transform="translate(420, 52)" class="key keypos-5">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">Y</text>
|
||||
</g>
|
||||
<g transform="translate(476, 44)" class="key keypos-6">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">U</text>
|
||||
</g>
|
||||
<g transform="translate(532, 28)" class="key keypos-7">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">I</text>
|
||||
</g>
|
||||
<g transform="translate(588, 46)" class="key keypos-8">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">O</text>
|
||||
</g>
|
||||
<g transform="translate(644, 81)" class="key keypos-9">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">P</text>
|
||||
</g>
|
||||
<g transform="translate(28, 137)" class="key keypos-10">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">A</text>
|
||||
<text x="0" y="24" class="key hold">LGUI</text>
|
||||
</g>
|
||||
<g transform="translate(84, 102)" class="key keypos-11">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">S</text>
|
||||
<text x="0" y="24" class="key hold">LALT</text>
|
||||
</g>
|
||||
<g transform="translate(140, 84)" class="key keypos-12">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">D</text>
|
||||
<text x="0" y="24" class="key hold">LSFT</text>
|
||||
</g>
|
||||
<g transform="translate(196, 100)" class="key keypos-13">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F</text>
|
||||
<text x="0" y="24" class="key hold">LCTL</text>
|
||||
</g>
|
||||
<g transform="translate(252, 108)" class="key keypos-14">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">G</text>
|
||||
</g>
|
||||
<g transform="translate(420, 108)" class="key keypos-15">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">H</text>
|
||||
</g>
|
||||
<g transform="translate(476, 100)" class="key keypos-16">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">J</text>
|
||||
<text x="0" y="24" class="key hold">LCTL</text>
|
||||
</g>
|
||||
<g transform="translate(532, 84)" class="key keypos-17">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">K</text>
|
||||
<text x="0" y="24" class="key hold">RSFT</text>
|
||||
</g>
|
||||
<g transform="translate(588, 102)" class="key keypos-18">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">L</text>
|
||||
<text x="0" y="24" class="key hold">LALT</text>
|
||||
</g>
|
||||
<g transform="translate(644, 137)" class="key keypos-19">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">;</text>
|
||||
<text x="0" y="24" class="key hold">LGUI</text>
|
||||
</g>
|
||||
<g transform="translate(28, 193)" class="key keypos-20">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">Z</text>
|
||||
</g>
|
||||
<g transform="translate(84, 158)" class="key keypos-21">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">X</text>
|
||||
</g>
|
||||
<g transform="translate(140, 140)" class="key keypos-22">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">C</text>
|
||||
</g>
|
||||
<g transform="translate(196, 156)" class="key keypos-23">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">V</text>
|
||||
</g>
|
||||
<g transform="translate(252, 164)" class="key keypos-24">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">B</text>
|
||||
</g>
|
||||
<g transform="translate(420, 164)" class="key keypos-25">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">N</text>
|
||||
</g>
|
||||
<g transform="translate(476, 156)" class="key keypos-26">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">M</text>
|
||||
</g>
|
||||
<g transform="translate(532, 140)" class="key keypos-27">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">,</text>
|
||||
</g>
|
||||
<g transform="translate(588, 158)" class="key keypos-28">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">.</text>
|
||||
</g>
|
||||
<g transform="translate(644, 193)" class="key keypos-29">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">/</text>
|
||||
</g>
|
||||
<g transform="translate(221, 221) rotate(15.0)" class="key keypos-30">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">SPC</text>
|
||||
<text x="0" y="24" class="key hold">NavNum</text>
|
||||
</g>
|
||||
<g transform="translate(279, 245) rotate(30.0)" class="key keypos-31">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">ENT</text>
|
||||
<text x="0" y="24" class="key hold"><tspan style="font-size: 88%">FunMouse</tspan></text>
|
||||
</g>
|
||||
<g transform="translate(393, 245) rotate(-30.0)" class="key keypos-32">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">ESC</text>
|
||||
<text x="0" y="24" class="key hold">RALT</text>
|
||||
</g>
|
||||
<g transform="translate(451, 221) rotate(-15.0)" class="key keypos-33">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">TAB</text>
|
||||
<text x="0" y="24" class="key hold">NavNum</text>
|
||||
</g>
|
||||
<g class="combo combopos-0">
|
||||
<path d="M336,197 h-109 a6.0,6.0 0 0 0 -6.0,6.0 v-1" class="combo"/>
|
||||
<path d="M336,197 h109 a6.0,6.0 0 0 1 6.0,6.0 v-1" class="combo"/>
|
||||
<rect rx="6" ry="6" x="311" y="184" width="50" height="26" class="combo"/>
|
||||
<text x="336" y="197" class="combo tap"><tspan style="font-size: 88%">FunMouse</tspan></text>
|
||||
</g>
|
||||
<g class="combo combopos-1">
|
||||
<path d="M365,330 h-80 a6.0,6.0 0 0 1 -6.0,-6.0 v-60" class="combo"/>
|
||||
<path d="M365,330 h80 a6.0,6.0 0 0 0 6.0,-6.0 v-84" class="combo"/>
|
||||
<rect rx="6" ry="6" x="340" y="317" width="50" height="26" class="combo"/>
|
||||
<text x="365" y="330" class="combo tap">Compose</text>
|
||||
</g>
|
||||
<g class="combo combopos-2">
|
||||
<path d="M307,302 h-80 a6.0,6.0 0 0 1 -6.0,-6.0 v-56" class="combo"/>
|
||||
<path d="M307,302 h80 a6.0,6.0 0 0 0 6.0,-6.0 v-32" class="combo"/>
|
||||
<rect rx="6" ry="6" x="282" y="289" width="50" height="26" class="combo"/>
|
||||
<text x="307" y="302" class="combo tap">Compose</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 10 KiB |
BIN
img/Layer-1.png
BIN
img/Layer-1.png
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB |
268
img/Layer-1.svg
Normal file
268
img/Layer-1.svg
Normal file
@@ -0,0 +1,268 @@
|
||||
<svg width="732" height="395" viewBox="0 0 732 395" class="keymap" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<style>/* inherit to force styles through use tags */
|
||||
svg path {
|
||||
fill: inherit;
|
||||
}
|
||||
|
||||
/* font and background color specifications */
|
||||
svg.keymap {
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 14px;
|
||||
font-kerning: normal;
|
||||
text-rendering: optimizeLegibility;
|
||||
fill: #24292e;
|
||||
}
|
||||
|
||||
/* default key styling */
|
||||
rect.key {
|
||||
fill: #f6f8fa;
|
||||
}
|
||||
|
||||
rect.key, rect.combo {
|
||||
stroke: #c9cccf;
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
/* default key side styling, only used is draw_key_sides is set */
|
||||
rect.side {
|
||||
filter: brightness(90%);
|
||||
}
|
||||
|
||||
/* color accent for combo boxes */
|
||||
rect.combo, rect.combo-separate {
|
||||
fill: #cdf;
|
||||
}
|
||||
|
||||
/* color accent for held keys */
|
||||
rect.held, rect.combo.held {
|
||||
fill: #fdd;
|
||||
}
|
||||
|
||||
/* color accent for ghost (optional) keys */
|
||||
rect.ghost, rect.combo.ghost {
|
||||
stroke-dasharray: 4, 4;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
text {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: middle;
|
||||
}
|
||||
|
||||
/* styling for layer labels */
|
||||
text.label {
|
||||
font-weight: bold;
|
||||
text-anchor: start;
|
||||
stroke: white;
|
||||
stroke-width: 4;
|
||||
paint-order: stroke;
|
||||
}
|
||||
|
||||
/* styling for optional footer */
|
||||
text.footer {
|
||||
text-anchor: end;
|
||||
dominant-baseline: auto;
|
||||
stroke: white;
|
||||
stroke-width: 4;
|
||||
paint-order: stroke;
|
||||
}
|
||||
|
||||
/* styling for combo tap, and key non-tap label text */
|
||||
text.combo, text.hold, text.shifted, text.left, text.right {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
text.hold {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: auto;
|
||||
}
|
||||
|
||||
text.shifted {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: hanging;
|
||||
}
|
||||
|
||||
text.left {
|
||||
text-anchor: start;
|
||||
}
|
||||
|
||||
text.right {
|
||||
text-anchor: end;
|
||||
}
|
||||
|
||||
text.layer-activator {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* styling for hold/shifted label text in combo box */
|
||||
text.combo.hold, text.combo.shifted, text.combo.left, text.combo.right {
|
||||
font-size: 8px;
|
||||
}
|
||||
|
||||
/* lighter symbol for transparent keys */
|
||||
text.trans {
|
||||
fill: #7b7e81;
|
||||
}
|
||||
|
||||
/* styling for combo dendrons */
|
||||
path.combo {
|
||||
stroke-width: 1;
|
||||
stroke: gray;
|
||||
fill: none;
|
||||
}
|
||||
|
||||
/* Start Tabler Icons Cleanup */
|
||||
/* cannot use height/width with glyphs */
|
||||
.icon-tabler > path {
|
||||
fill: inherit;
|
||||
stroke: inherit;
|
||||
stroke-width: 2;
|
||||
}
|
||||
/* hide tabler's default box */
|
||||
.icon-tabler > path[stroke="none"][fill="none"] {
|
||||
visibility: hidden;
|
||||
}
|
||||
/* End Tabler Icons Cleanup */
|
||||
</style>
|
||||
<g transform="translate(30, 0)" class="layer-NavNum">
|
||||
<text x="0" y="28" class="label" id="NavNum">NavNum:</text>
|
||||
<g transform="translate(0, 56)">
|
||||
<g transform="translate(28, 81)" class="key keypos-0">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">/</text>
|
||||
</g>
|
||||
<g transform="translate(84, 46)" class="key keypos-1">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">7</text>
|
||||
</g>
|
||||
<g transform="translate(140, 28)" class="key keypos-2">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">8</text>
|
||||
</g>
|
||||
<g transform="translate(196, 44)" class="key keypos-3">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">9</text>
|
||||
</g>
|
||||
<g transform="translate(252, 52)" class="key keypos-4">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">`</text>
|
||||
</g>
|
||||
<g transform="translate(420, 52)" class="key keypos-5">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">HOME</text>
|
||||
</g>
|
||||
<g transform="translate(476, 44)" class="key keypos-6">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">PGDN</text>
|
||||
</g>
|
||||
<g transform="translate(532, 28)" class="key keypos-7">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">PGUP</text>
|
||||
</g>
|
||||
<g transform="translate(588, 46)" class="key keypos-8">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">END</text>
|
||||
</g>
|
||||
<g transform="translate(644, 81)" class="key keypos-9">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">PSCR</text>
|
||||
</g>
|
||||
<g transform="translate(28, 137)" class="key keypos-10">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">+</text>
|
||||
</g>
|
||||
<g transform="translate(84, 102)" class="key keypos-11">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">4</text>
|
||||
</g>
|
||||
<g transform="translate(140, 84)" class="key keypos-12">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">5</text>
|
||||
</g>
|
||||
<g transform="translate(196, 100)" class="key keypos-13">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">6</text>
|
||||
</g>
|
||||
<g transform="translate(252, 108)" class="key keypos-14">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">0</text>
|
||||
</g>
|
||||
<g transform="translate(420, 108)" class="key keypos-15">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">←</text>
|
||||
</g>
|
||||
<g transform="translate(476, 100)" class="key keypos-16">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">↓</text>
|
||||
</g>
|
||||
<g transform="translate(532, 84)" class="key keypos-17">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">↑</text>
|
||||
</g>
|
||||
<g transform="translate(588, 102)" class="key keypos-18">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">→</text>
|
||||
</g>
|
||||
<g transform="translate(644, 137)" class="key keypos-19">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">BSPC</text>
|
||||
</g>
|
||||
<g transform="translate(28, 193)" class="key keypos-20">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">,</text>
|
||||
</g>
|
||||
<g transform="translate(84, 158)" class="key keypos-21">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">1</text>
|
||||
</g>
|
||||
<g transform="translate(140, 140)" class="key keypos-22">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">2</text>
|
||||
</g>
|
||||
<g transform="translate(196, 156)" class="key keypos-23">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">3</text>
|
||||
</g>
|
||||
<g transform="translate(252, 164)" class="key keypos-24">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">.</text>
|
||||
</g>
|
||||
<g transform="translate(420, 164)" class="key keypos-25">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">PLAY</text>
|
||||
</g>
|
||||
<g transform="translate(476, 156)" class="key keypos-26">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">VOL</tspan><tspan x="0" dy="1.2em">DWN</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(532, 140)" class="key keypos-27">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">VOL</tspan><tspan x="0" dy="1.2em">UP</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(588, 158)" class="key keypos-28">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">MUTE</text>
|
||||
</g>
|
||||
<g transform="translate(644, 193)" class="key keypos-29">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">DEL</text>
|
||||
</g>
|
||||
<g transform="translate(221, 221) rotate(15.0)" class="key keypos-30">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
<g transform="translate(279, 245) rotate(30.0)" class="key keypos-31">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
<g transform="translate(393, 245) rotate(-30.0)" class="key keypos-32">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
<g transform="translate(451, 221) rotate(-15.0)" class="key keypos-33">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.5 KiB |
BIN
img/Layer-2.png
BIN
img/Layer-2.png
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
291
img/Layer-2.svg
Normal file
291
img/Layer-2.svg
Normal file
@@ -0,0 +1,291 @@
|
||||
<svg width="732" height="395" viewBox="0 0 732 395" class="keymap" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<style>/* inherit to force styles through use tags */
|
||||
svg path {
|
||||
fill: inherit;
|
||||
}
|
||||
|
||||
/* font and background color specifications */
|
||||
svg.keymap {
|
||||
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
|
||||
font-size: 14px;
|
||||
font-kerning: normal;
|
||||
text-rendering: optimizeLegibility;
|
||||
fill: #24292e;
|
||||
}
|
||||
|
||||
/* default key styling */
|
||||
rect.key {
|
||||
fill: #f6f8fa;
|
||||
}
|
||||
|
||||
rect.key, rect.combo {
|
||||
stroke: #c9cccf;
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
/* default key side styling, only used is draw_key_sides is set */
|
||||
rect.side {
|
||||
filter: brightness(90%);
|
||||
}
|
||||
|
||||
/* color accent for combo boxes */
|
||||
rect.combo, rect.combo-separate {
|
||||
fill: #cdf;
|
||||
}
|
||||
|
||||
/* color accent for held keys */
|
||||
rect.held, rect.combo.held {
|
||||
fill: #fdd;
|
||||
}
|
||||
|
||||
/* color accent for ghost (optional) keys */
|
||||
rect.ghost, rect.combo.ghost {
|
||||
stroke-dasharray: 4, 4;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
text {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: middle;
|
||||
}
|
||||
|
||||
/* styling for layer labels */
|
||||
text.label {
|
||||
font-weight: bold;
|
||||
text-anchor: start;
|
||||
stroke: white;
|
||||
stroke-width: 4;
|
||||
paint-order: stroke;
|
||||
}
|
||||
|
||||
/* styling for optional footer */
|
||||
text.footer {
|
||||
text-anchor: end;
|
||||
dominant-baseline: auto;
|
||||
stroke: white;
|
||||
stroke-width: 4;
|
||||
paint-order: stroke;
|
||||
}
|
||||
|
||||
/* styling for combo tap, and key non-tap label text */
|
||||
text.combo, text.hold, text.shifted, text.left, text.right {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
text.hold {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: auto;
|
||||
}
|
||||
|
||||
text.shifted {
|
||||
text-anchor: middle;
|
||||
dominant-baseline: hanging;
|
||||
}
|
||||
|
||||
text.left {
|
||||
text-anchor: start;
|
||||
}
|
||||
|
||||
text.right {
|
||||
text-anchor: end;
|
||||
}
|
||||
|
||||
text.layer-activator {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* styling for hold/shifted label text in combo box */
|
||||
text.combo.hold, text.combo.shifted, text.combo.left, text.combo.right {
|
||||
font-size: 8px;
|
||||
}
|
||||
|
||||
/* lighter symbol for transparent keys */
|
||||
text.trans {
|
||||
fill: #7b7e81;
|
||||
}
|
||||
|
||||
/* styling for combo dendrons */
|
||||
path.combo {
|
||||
stroke-width: 1;
|
||||
stroke: gray;
|
||||
fill: none;
|
||||
}
|
||||
|
||||
/* Start Tabler Icons Cleanup */
|
||||
/* cannot use height/width with glyphs */
|
||||
.icon-tabler > path {
|
||||
fill: inherit;
|
||||
stroke: inherit;
|
||||
stroke-width: 2;
|
||||
}
|
||||
/* hide tabler's default box */
|
||||
.icon-tabler > path[stroke="none"][fill="none"] {
|
||||
visibility: hidden;
|
||||
}
|
||||
/* End Tabler Icons Cleanup */
|
||||
</style>
|
||||
<g transform="translate(30, 0)" class="layer-FunMouse">
|
||||
<text x="0" y="28" class="label" id="FunMouse">FunMouse:</text>
|
||||
<g transform="translate(0, 56)">
|
||||
<g transform="translate(28, 81)" class="key keypos-0">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F5</text>
|
||||
</g>
|
||||
<g transform="translate(84, 46)" class="key keypos-1">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F6</text>
|
||||
</g>
|
||||
<g transform="translate(140, 28)" class="key keypos-2">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F7</text>
|
||||
</g>
|
||||
<g transform="translate(196, 44)" class="key keypos-3">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F8</text>
|
||||
</g>
|
||||
<g transform="translate(252, 52)" class="key keypos-4">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-1.2em">LSFT</tspan><tspan x="0" dy="1.2em">+</tspan><tspan x="0" dy="1.2em">RSFT</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(420, 52)" class="key keypos-5">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">PWR</text>
|
||||
</g>
|
||||
<g transform="translate(476, 44)" class="key keypos-6">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">SLEP</text>
|
||||
</g>
|
||||
<g transform="translate(532, 28)" class="key keypos-7">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">WAKE</text>
|
||||
</g>
|
||||
<g transform="translate(588, 46)" class="key keypos-8">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">Base</text>
|
||||
<text x="0" y="24" class="key hold">toggle</text>
|
||||
</g>
|
||||
<g transform="translate(644, 81)" class="key keypos-9">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">WHLU</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(28, 137)" class="key keypos-10">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F1</text>
|
||||
</g>
|
||||
<g transform="translate(84, 102)" class="key keypos-11">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F2</text>
|
||||
</g>
|
||||
<g transform="translate(140, 84)" class="key keypos-12">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F3</text>
|
||||
</g>
|
||||
<g transform="translate(196, 100)" class="key keypos-13">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F4</text>
|
||||
</g>
|
||||
<g transform="translate(252, 108)" class="key keypos-14">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">Compat</text>
|
||||
<text x="0" y="24" class="key hold">toggle</text>
|
||||
</g>
|
||||
<g transform="translate(420, 108)" class="key keypos-15">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">LEFT</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(476, 100)" class="key keypos-16">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">DOWN</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(532, 84)" class="key keypos-17">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">UP</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(588, 102)" class="key keypos-18">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">RGHT</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(644, 137)" class="key keypos-19">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">WHLD</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(28, 193)" class="key keypos-20">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F9</text>
|
||||
</g>
|
||||
<g transform="translate(84, 158)" class="key keypos-21">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F10</text>
|
||||
</g>
|
||||
<g transform="translate(140, 140)" class="key keypos-22">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F11</text>
|
||||
</g>
|
||||
<g transform="translate(196, 156)" class="key keypos-23">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">F12</text>
|
||||
</g>
|
||||
<g transform="translate(252, 164)" class="key keypos-24">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">Gaming</text>
|
||||
<text x="0" y="24" class="key hold">toggle</text>
|
||||
</g>
|
||||
<g transform="translate(420, 164)" class="key keypos-25">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">BTN4</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(476, 156)" class="key keypos-26">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">BTN1</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(532, 140)" class="key keypos-27">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">BTN3</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(588, 158)" class="key keypos-28">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">BTN2</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(644, 193)" class="key keypos-29">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
<text x="0" y="0" class="key tap">
|
||||
<tspan x="0" dy="-0.6em">MS</tspan><tspan x="0" dy="1.2em">BTN5</tspan>
|
||||
</text>
|
||||
</g>
|
||||
<g transform="translate(221, 221) rotate(15.0)" class="key keypos-30">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
<g transform="translate(279, 245) rotate(30.0)" class="key keypos-31">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
<g transform="translate(393, 245) rotate(-30.0)" class="key keypos-32">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
<g transform="translate(451, 221) rotate(-15.0)" class="key keypos-33">
|
||||
<rect rx="6" ry="6" x="-26" y="-26" width="52" height="52" class="key"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 9.4 KiB |
Reference in New Issue
Block a user