Rawlings Conservatory Component Library

Main 

<nav class="p-nav-main" aria-labelledby="nav-main--header-main">
    <header class="p-nav-main__head">
        <h2 class="p-nav-main__title" id="nav-main--header-main">
            Header Main
        </h2>
    </header>

    <ul>
        <li>
            <a href="#">
                Visit
            </a>

            <ul>
                <li>
                    <a href="#">
                        Child One
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Two
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Three
                    </a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#">
                Learn
            </a>

            <ul>
                <li>
                    <a href="#">
                        Child One
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Two
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Three
                    </a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#">
                Events
            </a>

            <ul>
                <li>
                    <a href="#">
                        Child One
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Two
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Three
                    </a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#">
                Support
            </a>

            <ul>
                <li>
                    <a href="#">
                        Child One
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Two
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Three
                    </a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#">
                Rent
            </a>

            <ul>
                <li>
                    <a href="#">
                        Child One
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Two
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Three
                    </a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#">
                About
            </a>

            <ul>
                <li>
                    <a href="#">
                        Child One
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Two
                    </a>
                </li>
                <li>
                    <a href="#">
                        Child Three
                    </a>
                </li>
            </ul>
        </li>
    </ul>
</nav>
 
<nav class="p-nav-main" aria-labelledby="nav-main--{{ name }}">
	<header class="p-nav-main__head">
		<h2 class="p-nav-main__title" id="nav-main--{{ name }}">
			{{ title }}
		</h2>
	</header>

	<ul>
		{% for item in items %}
			<li>
				<a href="#">
					{{ item.label }}
				</a>

				{% if item.children|length %}
					<ul>
						{% for child in item.children %}
							<li>
								<a href="#">
									{{ child }}
								</a>
							</li>
						{% endfor %}
					</ul>
				{% endif %}
			</li>
		{% endfor %}
	</ul>
</nav>

No notes defined.