pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add styles to handle multiple number of items

Browse Source
This commit is contained in:
Luis Cielak
2018-07-19 16:37:34 -04:00
parent ed13cac995
commit 157561076c
3 changed files with 46 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
templates/requests/menu.html.to
View File

@@ -1,4 +1,4 @@
<div class="progress-menu">
<div class="progress-menu progress-menu--five">
<ul>
{% for i,s in enumerate(screens) %}
<li class="progress-menu__item">

28
templates/styleguide.html.to
View File

@@ -27,14 +27,34 @@
<div class='col col--grow'>
<div class="progress-menu">
<div class="progress-menu progress-menu--three">
<ul>
<li class="progress-menu__item progress-menu__item--complete"><a href="#">Details of Use</a></li>
<li class="progress-menu__item progress-menu__item--active"><a href="#">Organization Info</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Primary POC</a></li>
<li class="progress-menu__item progress-menu__item--complete"><a href="#">Step One</a></li>
<li class="progress-menu__item progress-menu__item--active"><a href="#">Step Two</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Step Three</a></li>
</ul>
</div>
<div class="progress-menu progress-menu--four">
<ul>
<li class="progress-menu__item progress-menu__item--complete"><a href="#">Step One</a></li>
<li class="progress-menu__item progress-menu__item--active"><a href="#">Step Two</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Step Three</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Step Four</a></li>
</ul>
</div>
<div class="progress-menu progress-menu--five">
<ul>
<li class="progress-menu__item progress-menu__item--complete"><a href="#">Step One</a></li>
<li class="progress-menu__item progress-menu__item--active"><a href="#">Step Two</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Step Three</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Step Four</a></li>
<li class="progress-menu__item progress-menu__item--incomplete"><a href="#">Step Five</a></li>
</ul>
</div>
<div class='panel'>
<div class='panel__content'>
<em>This is a panel content</em>