Add nested menu items and update main region with divs instead of tables

This commit is contained in:
Luis Cielak 2018-05-29 14:48:27 -04:00
parent 20fb102e1b
commit 73d88c6aad
3 changed files with 47 additions and 30 deletions

View File

@ -2,9 +2,9 @@ from atst.handler import BaseHandler
class Request(BaseHandler): class Request(BaseHandler):
screens = [ screens = [
{ 'title' : 'first screen', }, { 'title' : 'Application Details', },
{ 'title' : 'second screen', }, { 'title' : 'Computation', },
{ 'title' : 'third screen', } { 'title' : 'Storage', }
] ]
def initialize(self, page): def initialize(self, page):

View File

@ -4,20 +4,18 @@
<main class="usa-grid usa-section usa-content usa-layout-docs" id="main-content"> <main class="usa-grid usa-section usa-content usa-layout-docs" id="main-content">
<table> <aside class="usa-width-one-fourth usa-layout-docs-sidenav">
<tr> {% include 'requests/sidebar.html.to' %}
<td style='width:30%;'> </aside>
{% include 'requests/sidebar.html.to' %} <div class="usa-width-three-fourths usa-layout-docs-main_content">
</td>
<td> {% block form %}
{% block form %} form goes here
form goes here {% end %}
{% end %} {% block next %}
{% block next %} <a class='usa-button usa-button-secondary' href='{{ reverse_url('request_form',next_screen) }}'>next page</a>
<a class='usa-button usa-button-secondary' href='{{ reverse_url('request_form',next_screen) }}'>next page</a> {% end %}
{% end %} </div>
</td>
</table>
</main> </main>
{% end %} {% end %}

View File

@ -1,14 +1,33 @@
<b>this is the sidebar</b>
{% for i,s in enumerate(screens) %} <ul class="usa-sidenav-list">
<li> <li>
{% if i+1==current %} <a class="usa-current" href="#details-of-use">1. Details of Use</a>
<b>{{ s['title'] }}</b> <ul class="usa-sidenav-sub_list">
{% else %} {% for i,s in enumerate(screens) %}
<a href="{{ reverse_url('request_form',i+1) }}"> <li>
{{ s['title'] }} {% if i+1==current %}
</a> <a class="usa-current" href="{{ reverse_url('request_form',i+1) }}">
{% end %} {{ s['title'] }}
</li> </a>
{% end %} {% else %}
<ul> <a href='{{ reverse_url('request_form',i+1) }}'>
{{ s['title'] }}
</a>
{% end %}
</li>
{% end %}
</ul>
</li>
<li>
<a href="#">2. Organizational Info</a>
</li>
<li>
<a href="#">3. Funding/Contracting</a>
</li>
<li>
<a href="#">4. Readiness Survey</a>
</li>
<li>
<a href="#">5. Review &amp; Submit</a>
</li>
</ul> </ul>