MOVU Components

Tabs 

<div class="tabs">
    <div class="tabs-nav col-xs-12">
        <a class="movu-tab button-active" onclick="this.blur();"><i class="material-icons md-24 button-icon colorWord"><svg style="width:24px;height:24px" viewBox="0 0 24 24">
                    <path fill="#5C5C5C" d="M12,7H15C15.66,7.64 16,8.31 16,9V22H8V15C8,14.72 8.11,14.39 8.3,14L12,7M16,4L15,6H12V5L10,7H9L10,5V4H9V2H14.5A1.5,1.5 0 0,1 16,3.5V4Z" /> </i><span>Moving</span></a>

        <a class="movu-tab button-inactive" onclick="this.blur();"><i class="material-icons md-24 button-icon colorWord"><svg style="width:24px;height:24px" viewBox="0 0 24 24">
                    <path fill="#5C5C5C" d="M12,7H15C15.66,7.64 16,8.31 16,9V22H8V15C8,14.72 8.11,14.39 8.3,14L12,7M16,4L15,6H12V5L10,7H9L10,5V4H9V2H14.5A1.5,1.5 0 0,1 16,3.5V4Z" /> </i><span>Moving</span></a>

    </div>

    <div class="tabs-stage col-xs-12">
        <div id="tab-1">
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec neque nisi, dictum aliquet lectus.
            </p>
        </div>
        <div id="tab-2">
            <p>Phasellus pharetra aliquet viverra. Donec scelerisque tincidunt diam, eu fringilla urna auctor at.</p>
        </div>
    </div>
</div>
 
<div class="tabs">
    <div class="tabs-nav col-xs-12">
        {% render '@tab--active' %}
        {% render '@tab--inactive' %}
       
    </div>

    <div class="tabs-stage col-xs-12">
        <div id="tab-1">
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec neque nisi, dictum aliquet lectus.
            </p>
        </div>
        <div id="tab-2">
            <p>Phasellus pharetra aliquet viverra. Donec scelerisque tincidunt diam, eu fringilla urna auctor at.</p>
        </div>
    </div>
</div>
 
/* No context defined. */

No notes defined.