Want to contribute? Fork me on Codeberg.org!
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

67 lines
3.8 KiB

<svg version="1.1"
width="{{ dimensions.width }}" height="{{ dimensions.height }}"
xmlns="http://www.w3.org/2000/svg">
<defs>
<style type="text/css"><![CDATA[@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@700&display=swap');]]></style>
</defs>
{% let u = SVGMeasure::new(14.0, SVGUnit::Millimeter) %}
{% let padding = SVGMeasure::new(2.5, SVGUnit::Millimeter) %}
{% let dy = "0.125em" %}
{% for key in keyboard.keys %}
{% let x = u * key.x + padding * key.x + dimensions.margin %}
{% let y = u * key.y + padding * key.y + dimensions.margin %}
{% let width = u * key.width %}
{% let height = u * key.height %}
<g x="{{ x }}" y="{{ y }}" transform="translate({{ x.to_user_units() }},{{ y.to_user_units() }})" width="{{ width }}" height="{{ height }}">
<rect width="{{ width }}" height="{{ height }}" fill="none" stroke="#cccccc" stroke-width="1pt" rx="2mm" />
{# top-left #}
{% if let Some(legend) = key.legends[0] %}
<text x="{{ width * 0.25 }}" y="{{ height * 0.25 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# top-center #}
{% if let Some(legend) = key.legends[1] %}
<text x="{{ width * 0.5 }}" y="{{ height * 0.25 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# top-right #}
{% if let Some(legend) = key.legends[2] %}
<text x="{{ width * 0.75 }}" y="{{ height * 0.25 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# middle-left #}
{% if let Some(legend) = key.legends[3] %}
<text x="{{ width * 0.25 }}" y="{{ height * 0.5 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# middle-center #}
{% if let Some(legend) = key.legends[4] %}
<text x="{{ width * 0.5 }}" y="{{ height * 0.5 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# middle-right #}
{% if let Some(legend) = key.legends[5] %}
<text x="{{ width * 0.75 }}" y="{{ height * 0.5 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# bottom-left #}
{% if let Some(legend) = key.legends[6] %}
<text x="{{ width * 0.25 }}" y="{{ height * 0.75 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# bottom-center #}
{% if let Some(legend) = key.legends[7] %}
<text x="{{ width * 0.55 }}" y="{{ height * 0.75 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# bottom-right #}
{% if let Some(legend) = key.legends[8] %}
<text x="{{ width * 0.75 }}" y="{{ height * 0.75 }}" dominant-baseline="middle" text-anchor="middle" style="font-family: 'M PLUS Rounded 1c'" font-size="{{ legend.size|kle_font_units }}" dy="{{ dy }}">{{ legend.text }}</text>
{% endif %}
{# TODO 9-11 are side #}
</g>
{% endfor %}
</svg>