BAGS — Design System

Selection Hepa 

<form action="#" class="selection selection--hepa">
    <div class="package package--01"><input type="radio" id="package-01" name="package" value="package-01">
        <label for="package-01">
            1 ks
        </label>
        <div class="package__price">180 Kč

        </div>
        <div class="package__benefits">
            <div class="package__benefit">
                <div class="icon">
                    <i aria-hidden="true" class="icon-save-hand"></i>
                </div>
                <div class="text">Sleva
                    <strong>0 %</strong>
                </div>
            </div>
        </div>
    </div>
    <div class="package package--01 package--selected"><input type="radio" id="package-01" name="package" value="package-01" checked="">
        <label for="package-01">
            2 ks
        </label>
        <div class="package__price">160 Kč
            <div class="package__price-before">180 Kč</div>
        </div>
        <div class="package__benefits">
            <div class="package__benefit">
                <div class="icon">
                    <i aria-hidden="true" class="icon-save-hand"></i>
                </div>
                <div class="text">Sleva
                    <strong>10 %</strong>
                </div>
            </div>
        </div>
    </div>
    <div class="package package--03"><input type="radio" id="package-03" name="package" value="package-03">
        <label for="package-03">
            3 ks
        </label>
        <div class="package__price">140 Kč
            <div class="package__price-before">180 Kč</div>
        </div>
        <div class="package__benefits">
            <div class="package__benefit">
                <div class="icon">
                    <i aria-hidden="true" class="icon-save-hand"></i>
                </div>
                <div class="text">Sleva
                    <strong>20 %</strong>
                </div>
            </div>
        </div>
    </div>
</form>

<script type="text/javascript" src="../../js/selection-hepa.js"></script>
 
<form action="#" class="selection selection--hepa">
    {% render '@selection-hepa-01' %}
    {% render '@selection-hepa-02' %}
    {% render '@selection-hepa-03' %}
</form>

{# FIXME: this is redundant code #}
<script type="text/javascript" src="{{ '/js/selection-hepa.js' | path }}"></script>
 
/* No context defined. */

No notes defined.