2413 lines
48 KiB
XML
2413 lines
48 KiB
XML
|
|
<svg width='732px'
|
|
height='300px'
|
|
viewBox='0 0 732 300'
|
|
xmlns='http://www.w3.org/2000/svg'
|
|
xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
|
|
<style type='text/css'>
|
|
.keycap .border { stroke: black; stroke-width: 2; }
|
|
.keycap .inner.border { stroke: rgba(0,0,0,.1); }
|
|
</style>
|
|
<defs>
|
|
<linearGradient id="DCS">
|
|
<stop offset="0%" stop-color="black" stop-opacity="0"/>
|
|
<stop offset="40%" stop-color="black" stop-opacity="0.1"/>
|
|
<stop offset="60%" stop-color="black" stop-opacity="0.1"/>
|
|
<stop offset="100%" stop-color="black" stop-opacity="0"/>
|
|
</linearGradient>
|
|
<linearGradient id="SPACE" x1="0%" x2="0%" y1="0%" y2="100%">
|
|
<stop offset="0%" stop-color="black" stop-opacity="0.1"/>
|
|
<stop offset="20%" stop-color="black" stop-opacity="0.0"/>
|
|
<stop offset="40%" stop-color="black" stop-opacity="0.0"/>
|
|
<stop offset="100%" stop-color="black" stop-opacity="0.1"/>
|
|
</linearGradient>
|
|
<radialGradient id="DSA">
|
|
<stop offset="0%" stop-color="black" stop-opacity="0.1"/>
|
|
<stop offset="10%" stop-color="black" stop-opacity="0.1"/>
|
|
<stop offset="100%" stop-color="black" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<radialGradient id="SA" xlink:href="#DSA" />
|
|
</defs>
|
|
|
|
<g transform='translate(10,10)'>
|
|
<rect width="712" height="280"
|
|
stroke="#ddd" stroke-width="1" fill="#656565" rx="6"/>
|
|
<g transform='translate(5,5)'>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="2" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="2" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="3" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="3" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="3" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="56" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="56" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="57" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="57" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="57" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="110" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="110" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="111" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="111" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="111" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="164" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="164" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="165" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="165" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="165" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="218" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="218" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="219" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="219" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="219" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="272" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="272" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="273" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="273" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="273" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="326" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="326" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="327" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="327" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="327" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="380" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="380" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="381" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="381" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="381" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="434" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="434" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="435" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="435" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="435" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="488" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="488" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="489" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="489" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="489" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="542" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="542" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="543" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="543" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="543" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="596" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<rect x="596" y="2"
|
|
width="104" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="596" y="2"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
<rect x="596" y="2"
|
|
width="104" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="597" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<rect x="597" y="3"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="597" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
<rect x="597" y="3"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<linearGradient id="_fill11" xlink:href="#FLAT" gradientUnits="userSpaceOnUse"
|
|
x1="596" y1="2" x2="646" y2="2"/>
|
|
|
|
<rect x="597" y="3"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949"/>
|
|
<rect x="597" y="3"
|
|
width="102" height="48"
|
|
rx="5" fill="url(#_fill11)"/>
|
|
<rect x="597" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
<rect x="597" y="3"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#_fill11)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="2" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="2" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="3" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="3" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="3" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="56" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="56" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="57" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="57" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="57" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="110" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="110" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="111" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="111" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="111" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="164" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="164" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="165" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="165" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="165" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="218" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="218" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="219" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="219" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="219" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="272" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="272" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="273" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="273" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="273" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="326" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="326" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="327" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="327" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="327" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="380" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="380" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="381" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="381" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="381" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="434" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="434" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="435" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="435" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="435" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="488" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="488" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="489" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="489" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="489" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="542" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="542" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="543" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="543" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="543" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="596" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="596" y="56"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="597" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="597" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="597" y="57"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="650" y="56"
|
|
width="50" height="104"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="650" y="56"
|
|
width="50" height="104"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="651" y="57"
|
|
width="48" height="102"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="651" y="57"
|
|
width="48" height="102"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="651" y="57"
|
|
width="48" height="102"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="2" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="2" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="3" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="3" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="3" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="56" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="56" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="57" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="57" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="57" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="110" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="110" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="111" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="111" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="111" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="164" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="164" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="165" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="165" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="165" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="218" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="218" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="219" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="219" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="219" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="272" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="272" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="273" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="273" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="273" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="326" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="326" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="327" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="327" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="327" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="380" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="380" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="381" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="381" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="381" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="434" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="434" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="435" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="435" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="435" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="488" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="488" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="489" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="489" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="489" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="542" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="542" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="543" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="543" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="543" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="596" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="596" y="110"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="597" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="597" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="597" y="111"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="2" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="2" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="3" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="3" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="3" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="56" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="56" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="57" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="57" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="57" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="110" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="110" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="111" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="111" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="111" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="164" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="164" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="165" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="165" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="165" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="218" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="218" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="219" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="219" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="219" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="272" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="272" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="273" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="273" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="273" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="326" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="326" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="327" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="327" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="327" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="380" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="380" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="381" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="381" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="381" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="434" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="434" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="435" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="435" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="435" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="488" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="488" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="489" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="489" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="489" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="542" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="542" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="543" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="543" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="543" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="596" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<rect x="596" y="164"
|
|
width="104" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="596" y="164"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
<rect x="596" y="164"
|
|
width="104" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="597" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<rect x="597" y="165"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="597" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
<rect x="597" y="165"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<linearGradient id="_fill48" xlink:href="#FLAT" gradientUnits="userSpaceOnUse"
|
|
x1="596" y1="164" x2="646" y2="164"/>
|
|
|
|
<rect x="597" y="165"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949"/>
|
|
<rect x="597" y="165"
|
|
width="102" height="48"
|
|
rx="5" fill="url(#_fill48)"/>
|
|
<rect x="597" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
<rect x="597" y="165"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#_fill48)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="2" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="2" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="3" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="3" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="3" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="56" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="56" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="57" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="57" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="57" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="110" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="110" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="111" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="111" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="111" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="164" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="164" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="165" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="165" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="165" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="218" y="218"
|
|
width="104" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<rect x="218" y="218"
|
|
width="158" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="218" y="218"
|
|
width="104" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
<rect x="218" y="218"
|
|
width="158" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="219" y="219"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<rect x="219" y="219"
|
|
width="156" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="219" y="219"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
<rect x="219" y="219"
|
|
width="156" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<linearGradient id="_fill53" xlink:href="#FLAT" gradientUnits="userSpaceOnUse"
|
|
x1="218" y1="218" x2="322" y2="218"/>
|
|
|
|
<rect x="219" y="219"
|
|
width="156" height="48"
|
|
rx="5" fill="#494949"/>
|
|
<rect x="219" y="219"
|
|
width="156" height="48"
|
|
rx="5" fill="url(#_fill53)"/>
|
|
<rect x="219" y="219"
|
|
width="102" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
<rect x="219" y="219"
|
|
width="102" height="48"
|
|
rx="5" fill="url(#_fill53)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="380" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="380" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="381" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="381" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="381" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="434" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="434" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="435" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="435" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="435" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="488" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="488" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="489" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="489" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="489" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="542" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="542" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="543" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="543" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="543" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="596" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="596" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="597" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="597" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="597" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
<g class=' keycap'
|
|
>
|
|
|
|
|
|
<!-- Outer Border -->
|
|
<rect x="650" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d" class="outer border"/>
|
|
|
|
<!-- Outer Fill -->
|
|
<rect x="650" y="218"
|
|
width="50" height="50"
|
|
rx="5" fill="#3d3d3d"/>
|
|
|
|
|
|
|
|
<!-- Inner Border -->
|
|
<rect x="651" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949" class="inner border"/>
|
|
|
|
<!-- Inner Fill -->
|
|
<rect x="651" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="#494949"/>
|
|
|
|
|
|
|
|
|
|
<rect x="651" y="219"
|
|
width="48" height="48"
|
|
rx="5" fill="url(#FLAT)"/>
|
|
|
|
|
|
|
|
|
|
</g>
|
|
|
|
</g>
|
|
</g>
|
|
</svg>
|