{%- set ROW_HEIGHT = 24 -%}
{%- set ROW_MARGIN = 2 -%}
{%- set FONT_SIZE_PERCENT = 75 -%}
{%- set FONT_SIZE = (ROW_HEIGHT - ROW_MARGIN) * FONT_SIZE_PERCENT / 100 -%}
{%- set ROWS = 1 + versions|length + (versions.values()|map('length')|sum) -%}
{%- set OUTER_MARGIN = 5 -%}
{%- set REPO_LEFT_MARGIN = 15 -%}
{%- set FONT_WIDENESS = 0.5 -%}
{# ugh. just ugh. #}
{%- set ns = namespace(longest_repo = 0, longest_version = 0) -%}
{%- for family_contents in versions.values() -%}
    {%- set this_longest_repo = family_contents.keys()|map('length')|max -%}
    {%- set this_longest_version = family_contents.values()|map('string')|map('length')|max -%}
    {%- set ns.longest_repo = [ns.longest_repo, this_longest_repo]|max -%}
    {%- set ns.longest_version = [ns.longest_version, this_longest_version]|max -%}
{%- endfor -%}
{%- set VERSION_X = OUTER_MARGIN + REPO_LEFT_MARGIN + ns.longest_repo * FONT_WIDENESS * FONT_SIZE -%}
{%- set VERSION_WIDTH = OUTER_MARGIN + ns.longest_version * FONT_WIDENESS * FONT_SIZE -%}
{%- set WIDTH = VERSION_X + VERSION_WIDTH -%}
{%- set ns = namespace(y = 0) -%}
{%- macro y(offset=0) -%}{{ ns.y + offset }}{%- endmacro -%}
{%- macro texty() -%}{{ y(FONT_SIZE) }}{%- endmacro -%}
{%- macro end_row() -%}{%- set ns.y = ns.y + ROW_HEIGHT %}{%- endmacro -%}
<?xml version="1.0" encoding="utf-8" ?>
<svg width="{{ WIDTH }}" height="{{ ROWS * ROW_HEIGHT }}" xmlns="http://www.w3.org/2000/svg" fill="white" font-size="{{ FONT_SIZE }}">
    <rect x="0" y="0" width="100%" height="100%" fill="black"></rect>
    <text x="5" y="{{ texty() }}" fill="white">Packaging Status</text>
    <line x1="0" y1="{{ y(ROW_HEIGHT - ROW_MARGIN / 2) }}" x2="{{ WIDTH }}" y2="{{ y(ROW_HEIGHT - ROW_MARGIN / 2) }}"
          stroke="white" stroke-width="{{ ROW_MARGIN }}"></line>{{ end_row() }}
    {% for family, family_contents in versions.items() %}
        <text x="{{ OUTER_MARGIN }}" y="{{ texty() }}">{{ family }}</text>{{ end_row() }}
        {% for repo, version in family_contents.items() %}
            <text x="{{ REPO_LEFT_MARGIN }}" y="{{ texty() }}">{{ repo }}</text>
            <rect x="{{ VERSION_X }}" y="{{ y() }}" width="{{ VERSION_WIDTH }}" height="{{ ROW_HEIGHT }}"
                  fill="{% if version < newest_version %}red{% else %}green{% endif %}"></rect>
            <text x="{{ VERSION_X + OUTER_MARGIN }}" y="{{ texty() }}">{{ version }}</text>{{ end_row() }}
        {% endfor %}
    {% endfor %}
</svg>