Design Seeds Boiler - Component Library

Filter 

<div class="filter u-bg-color__7">
    <div class="filter__inner">
        <p>Use the filter below to find what you're looking for</p>
        <div class="l-grid l-grid--3 l-grid--no-margin">
            <div class="filter__item">
                <div class="form__select">
                    <select class="form__select-input" name="" id="">
                        <option value=""> Output type</option>
                        <option value=""> one</option>
                        <option value=""> two</option>
                    </select>
                </div>
            </div>
            <div class="filter__item">
                <div class="form__select">
                    <select class="form__select-input" name="" id="">
                        <option value=""> Theme</option>
                        <option value=""> one</option>
                        <option value=""> two</option>
                    </select>
                </div>
            </div>
            <div class="filter__item">
                <div class="form__select">
                    <select class="form__select-input" name="" id="">
                        <option value=""> Year published</option>
                        <option value=""> one</option>
                        <option value=""> two</option>
                    </select>
                </div>
            </div>
        </div>
    </div>

</div>
 
<div class="filter u-bg-color__7">
    <div class="filter__inner">
        <p>Use the filter below to find what you're looking for</p>
        <div class="l-grid l-grid--3 l-grid--no-margin">
            <div class="filter__item">{% render "@form-select" with { 'options': ['Output type', 'one','two'] } %}</div>
            <div class="filter__item">{% render "@form-select" with { 'options': ['Theme', 'one','two'] } %}</div>
            <div class="filter__item">{% render "@form-select" with { 'options': ['Year published', 'one','two'] } %}</div>
        </div>
    </div>
        
    
</div>
 
/* No context defined. */

No notes defined.