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

Merge pull request #59 from dod-ccpo/ui/navigation

Browse Source 
Ui/navigation
This commit is contained in:
andrewdds
2018-07-09 14:52:42 -04:00
committed by GitHub
parent bc83ba9d14 bdf3191b41
commit ccb780e843
11 changed files with 216 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
templates/base.html.to
View File

@@ -14,6 +14,8 @@
{% include 'header.html.to' %}
<div class='panel-container'>
{% block sidenav %}{% end %}
{% block content %}
these are not the droids you are looking for
{% end %}

42
templates/header.html.to
View File

@@ -1,35 +1,11 @@
<header class="usa-header usa-header-basic" role="banner">
<div class="usa-nav-container">
<div class="usa-navbar">
<div class="usa-logo" id="basic-logo">
<em class="usa-logo-text">
<a href="/" title="Home" aria-label="Home">JEDI</a>
</em>
</div>
</div>
<header class="topbar">
<nav class="topbar__navigation">
<a href="/" class="topbar__link topbar__link--primary">
<span>JEDI</span>
</a>
<nav role="navigation" class="usa-nav">
<ul class="usa-nav-primary usa-accordion">
{% for item in [
['home', 'Home'],
['workspaces', 'Workspaces'],
['requests', 'Requests'],
['users', 'Users' ],
['reports', 'Reports' ],
]
%}
<li>
{% if item[0]==page %}
<a class="usa-nav-link usa-current" href='{{ reverse_url(item[0]) }}'><span>{{ item[1] }}</span></a>
{% else %}
<a class="usa-nav-link" href='{{ reverse_url(item[0]) }}'><span>{{ item[1] }}</span></a>
{% end %}
</li>
{% end %}
<li>Tech Lead</li>
</ul>
</nav>
</div>
<a href="/" class="topbar__link topbar__link--secondary">
<span>Tech Lead</span>
</a>
</nav>
</header>

59
templates/styleguide.html.to
View File

@@ -1,28 +1,47 @@
{% 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 %}
<div class='col'>
<div class='panel'>
<p>This is a panel</p>
</div>
</div>
<div class='col col--grow'>
<div class='panel'>
<p>This is a panel</p>
<div class='row'>
<div class='col col--grow'>col 1</div>
<div class='col col--grow'>col 2</div>
<div class='col'>
<div class='panel'>
<p>This is a panel</p>
</div>
</div>
<div class='panel'>
Another panel
<div class='col col--grow'>
<div class='panel'>
<p>This is a panel</p>
<div class='row'>
<div class='col col--grow'>col 1</div>
<div class='col col--grow'>col 2</div>
</div>
</div>
<div class='panel'>
Another panel
</div>
</div>
</div>
{% end %}