{% extends 'snowebsvg/common/svg.html' %}

{% load svg_utils %}


{% block svg_content %}
    {% unique_id as id %}
    <clipPath id="clip-path-{{ id }}">
        <circle cx="50" cy="50" r="50"></circle>
    </clipPath>

    <circle {% variant_manager variant 'attrs' %}
            class="svg-fill-primary"
            cx="50"
            cy="50"
            r="50">
    </circle>

    <g clip-path="url(#clip-path-{{ id }})">

        <g transform="{% scale 0.7 %}">
            {% parse "0;50 50;100 100;50 50;0" as props %}
            {% for prop in props %}
                <circle {% variant_manager variant 'attrs' %}
                        transform="{% scale 1 x=prop.0|to_int y=prop.1|to_int %}"
                        style="mix-blend-mode: screen;"
                        class="svg-fill-primary svg-builder-circle svg-keep"
                        cx="{{ prop.0 }}"
                        cy="{{ prop.1 }}"
                        r="0">
                </circle>
            {% endfor %}
        </g>

        <g transform="rotate(45, 50, 50) {% scale 0.7 %}">
            {% parse "0;50 50;100 100;50 50;0" as props %}
            {% for prop in props %}
                <circle {% variant_manager variant 'attrs' %}
                        transform="{% scale 1 x=prop.0|to_int y=prop.1|to_int %}"
                        style="mix-blend-mode: screen;"
                        class="svg-fill-primary svg-builder-circle svg-keep"
                        cx="{{ prop.0 }}"
                        cy="{{ prop.1 }}"
                        r="0">
                </circle>
            {% endfor %}
        </g>

    </g>
{% endblock %}