Panel Header

No notes defined.

<div class="sds-panelHeader">

    <div class="sds-panelHeader__actionGroup">
        <nav role="navigation" class="sds-linkTabs">
            <ul class="sds-linkTabs__inner nav nav-tabs">

                <li class="nav-item">
                    <a class="nav-link active" href="">Horaire Mobile</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" href="">Demandes</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" href="">Réservations</a>
                </li>

            </ul>
        </nav>
    </div>

    <div class="sds-panelHeader__alignEnd">

        <div class="sds-panelHeader__actionGroup">
            <div class="dropdown">
                <button type="button" class="sds-btn -iconBtn -btnSecondary" data-toggle="dropdown">

                    <span class="sds-icon sds-icon-filter"></span>

                </button>
                <div aria-labelledby="" class="sds-actionMenu dropdown-menu list-unstyled dropdown-menu-right">
                    <div class="sds-staticStackMd">
                        <fieldset>
                            <legend class="dropdown-header">Type</legend>
                            <ul class="list-unstyled">
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-1" class="sr-only custom-control-input " id="action-menu-radio-1" checked><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-1">
                                            Tout
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-1" class="sr-only custom-control-input " id="action-menu-radio-2"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-2">
                                            Congé
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-1" class="sr-only custom-control-input " id="action-menu-radio-3"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-3">
                                            CET
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-1" class="sr-only custom-control-input " id="action-menu-radio-3"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-3">
                                            Téléavail
                                        </label>

                                    </div>
                                </li>
                            </ul>
                        </fieldset>
                        <fieldset>
                            <legend class="dropdown-header">Statut</legend>
                            <ul class="list-unstyled">
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-2" class="sr-only custom-control-input " id="action-menu-radio-4" checked><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-4">
                                            Tous
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-2" class="sr-only custom-control-input " id="action-menu-radio-5"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-5">
                                            En attente
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-2" class="sr-only custom-control-input " id="action-menu-radio-6"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-6">
                                            Validé
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-2" class="sr-only custom-control-input " id="action-menu-radio-7"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-7">
                                            Rejeté
                                        </label>

                                    </div>
                                </li>
                                <li class="dropdown-item">
                                    <div class="sds-radio custom-control custom-radio">
                                        <input value="radio-value" type="radio" name="radio-dropdown-2" class="sr-only custom-control-input " id="action-menu-radio-8"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                        <label class="custom-control-label" for="action-menu-radio-8">
                                            Annulé
                                        </label>

                                    </div>
                                </li>
                            </ul>
                        </fieldset>
                    </div>
                </div>

            </div>
        </div>

    </div>

</div>
{% extends "@snet-panel-header-frame" %}
{% block contentStart %}
    <div class="{{ namespace }}panelHeader__actionGroup">
        {% render "@snet-link-tabs",linkTabsOptions,true %}
    </div>
{% endblock %}
{% block contentEnd %}
<div class="{{ namespace }}panelHeader__actionGroup">
	<div class="dropdown">
		{% render '@icon-btn-secondary',{
			icon: "icon-filter",
			attrs: {
				"data-toggle": "dropdown"
			}
		}, true %}
		{% render "@msp-action-menu",{
			modifiers: ["dropdown-menu-right"]
		},true %}
	</div>
</div>
{% endblock %}