Add sidenav example to styleguide
This commit is contained in:
parent
3e0f323ce3
commit
7dc746c7e1
@ -1,15 +1,36 @@
|
|||||||
{% extends "base.html.to" %}
|
{% extends "base.html.to" %}
|
||||||
|
|
||||||
|
{% block sidenav %}
|
||||||
|
<nav class='sidenav'>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<a href='/' class='sidenav__link sidenav__link--active' aria-current='true'>Navigation Item</a>
|
||||||
|
<ul>
|
||||||
|
<li><a href='/' class='sidenav__link sidenav__link--active'>Sub Navigation</a></li>
|
||||||
|
<li><a href='/' class='sidenav__link'>Sub Navigation</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li><a href='/' class='sidenav__link'>Navigation Item</a>
|
||||||
|
<ul>
|
||||||
|
<li><a href='/' class='sidenav__link'>Sub Navigation</a></li>
|
||||||
|
<li><a href='/' class='sidenav__link'>Sub Navigation</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li><a href='/' class='sidenav__link'>Navigation Item</a></li>
|
||||||
|
<li><a href='/' class='sidenav__link'>Navigation Item</a></li>
|
||||||
|
<li><a href='/' class='sidenav__link sidenav__link--disabled' aria-disabled='true'>Navigation Item</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
{% end %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
<div class='col'>
|
||||||
|
|
||||||
<div class='col'>
|
|
||||||
<div class='panel'>
|
<div class='panel'>
|
||||||
<p>This is a panel</p>
|
<p>This is a panel</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class='col col--grow'>
|
<div class='col col--grow'>
|
||||||
<div class='panel'>
|
<div class='panel'>
|
||||||
<p>This is a panel</p>
|
<p>This is a panel</p>
|
||||||
|
|
||||||
@ -22,7 +43,5 @@
|
|||||||
<div class='panel'>
|
<div class='panel'>
|
||||||
Another panel
|
Another panel
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{% end %}
|
{% end %}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user