Paul Smith's College Component Library

Sub Nav 

<div class="page_sub_nav">
    <a class="skip_link skip_subnav" id="skip_sub_link" href="#page_content">Skip Sub Navigation</a>
    <div class="page_sub_nav_flat">
        <div class="fs-row">
            <div class="fs-cell fs-lg-10 fs-lg-justify-center">
                <div class="page_sub_nav_flat_inner">

                    <nav class="sub_nav" aria-labelledby="basic_nav_title-7">
                        <div class="sub_nav_header">
                            <h2 class="sub_nav_title" id="basic_nav_title-7"></h2>
                        </div>
                        <ul class="sub_nav_list" aria-labelledby="basic_nav_title-7">
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <div class="page_sub_nav_toggle">

        <div class="js-nav-toggle-group js-sub-nav-group toggle_nav_group sub_nav_group">

            <button class="js-sub-nav-toggle js-nav-toggle-button js-swap sub_nav_toggle button_toggle" data-swap-target=".js-sub-nav-group" data-swap-linked="suv">
                <span class="sub_nav_toggle_inner_default sub_nav_toggle_inner button_toggle_inner_default button_toggle_inner">
                    <span class="sub_nav_toggle_label_default sub_nav_toggle_label button_toggle_label_default button_toggle_label">In This Section</span>
                    <span class="sub_nav_toggle_icon_default sub_nav_toggle_icon button_toggle_icon_default button_toggle_icon" aria-hidden="true">

                        <svg class="icon icon_chevron_down">
                            <use href="/images/icons.svg#chevron_down" />
                        </svg>

                    </span>
                </span>
                <span class="sub_nav_toggle_inner_active sub_nav_toggle_inner button_toggle_inner_active button_toggle_inner">
                    <span class="sub_nav_toggle_label_active sub_nav_toggle_label button_toggle_label_active button_toggle_label">Close</span>
                    <span class="sub_nav_toggle_icon_active sub_nav_toggle_icon button_toggle_icon_active button_toggle_icon" aria-hidden="true">

                        <svg class="icon icon_close">
                            <use href="/images/icons.svg#close" />
                        </svg>

                    </span>
                </span>
            </button>
            <div class="js-nav-toggle-panel js-sub-nav-panel toggle_nav_panel sub_nav_panel">
                <nav class="js-nav-toggle js-sub-nav toggle_nav sub_nav" aria-labelledby="toggle_nav_title-8">
                    <div class="toggle_nav_header sub_nav_header">
                        <h2 class="toggle_nav_title sub_nav_title" id="toggle_nav_title-8"></h2>
                    </div>
                    <ul class="js-nav-toggle-list js-sub-nav-list toggle_nav_list sub_nav_list" aria-labelledby="toggle_nav_title-8">
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</div>
 
{#
	{% render '@partial-sub-nav' with {
		page: page,
		_env: _env
	} %}
#}

{% if page.subNav != false  %}
	<div class="page_sub_nav">
		<a class="skip_link skip_subnav" id="skip_sub_link" href="#page_content">Skip Sub Navigation</a>
		<div class="page_sub_nav_flat">
			<div class="fs-row">
				<div class="fs-cell fs-lg-10 fs-lg-justify-center">
					<div class="page_sub_nav_flat_inner">
						{% include '@navigation-basic' with {
							class: 'sub',
							modifier: '',
							title: page.title,
							active_index: '',
							links: page.subNav
						} %}
					</div>
				</div>
			</div>
		</div>
		<div class="page_sub_nav_toggle">
			{% include '@navigation-toggle' with {
				class: 'sub',
				modifier: '',
				title: page.title|lower,
				links: page.subNav,
				icon: '',
				child_icon: '',
				toggle: {
					title: 'In This Section',
					icon: 'chevron_down',
					title_active: 'Close',
					icon_active: 'close',
					swap_target: '.js-sub-nav-group',
					swap_link: 'suv'
				}
			} %}
		</div>
	</div>
{% endif %}

No notes defined.