Merge branch 'master' into ui/styleguide
This commit is contained in:
@@ -13,7 +13,7 @@
|
||||
{% end %}
|
||||
<link rel="icon" type="image/x-icon" href="/static/img/favicon.ico">
|
||||
</head>
|
||||
<body>
|
||||
<body class="{% if modalOpen() %} modalOpen{% end %}">
|
||||
{% include 'navigation/topbar.html.to' %}
|
||||
|
||||
<div class='global-layout'>
|
||||
@@ -29,6 +29,8 @@
|
||||
</div>
|
||||
|
||||
{% include 'footer.html.to' %}
|
||||
|
||||
{% block modal %}{% end %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
7
templates/components/modal.html.to
Normal file
7
templates/components/modal.html.to
Normal file
@@ -0,0 +1,7 @@
|
||||
<div class='modal'>
|
||||
<div class='modal__dialog' role='dialog' aria-modal='true'>
|
||||
<div class='modal__body'>
|
||||
{% raw body %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@@ -6,4 +6,19 @@
|
||||
|
||||
<span class="sidenav__link-label">{{label}}</span>
|
||||
</a>
|
||||
|
||||
{% if subnav and active %}
|
||||
<ul>
|
||||
{% for item in subnav %}
|
||||
<li>
|
||||
<a class="sidenav__link {% if item["active"] %}sidenav__link--active{% end %}" href="{{item["href"]}}" title="{{item["label"]}}">
|
||||
{% if "icon" in item %}
|
||||
{% module Icon(item["icon"], classes="sidenav__link-icon") %}
|
||||
{% end %}
|
||||
<span class="sidenav__link-label">{{item["label"]}}</span>
|
||||
</a>
|
||||
</li>
|
||||
{% end %}
|
||||
</ul>
|
||||
{% end %}
|
||||
</li>
|
||||
|
@@ -1,10 +1,24 @@
|
||||
<div class="global-navigation sidenav global-navigation__context--{{context}}">
|
||||
<ul>
|
||||
{% if dev() %}
|
||||
{% module SidenavItem("Styleguide", href="/styleguide", icon="visible", active=matchesPath('/styleguide')) %}
|
||||
{% module SidenavItem("Styleguide",
|
||||
href="/styleguide",
|
||||
icon="visible",
|
||||
active=matchesPath('/styleguide'),
|
||||
subnav=[
|
||||
{"label":"Subnav 1", "href":"/styleguide?subnav1", "icon": "plus", "active": matchesPath('/styleguide?subnav1')},
|
||||
{"label":"Subnav 2", "href":"/styleguide?subnav2", "active": matchesPath('/styleguide?subnav2')},
|
||||
]) %}
|
||||
{% end %}
|
||||
|
||||
{% module SidenavItem("Requests", href="/requests", icon="document", active=matchesPath('/requests')) %}
|
||||
{% module SidenavItem("Requests",
|
||||
href="/requests",
|
||||
icon="document",
|
||||
active=matchesPath('/requests'),
|
||||
subnav=[
|
||||
{"label":"New Request", "href":"/requests/new", "icon": "plus", "active": matchesPath('/requests/new')},
|
||||
]
|
||||
) %}
|
||||
{% module SidenavItem("Workspaces", href="/workspaces", icon="cloud", active=matchesPath('/workspaces')) %}
|
||||
</ul>
|
||||
</div>
|
||||
|
@@ -11,7 +11,7 @@
|
||||
</a>
|
||||
|
||||
<a href="/" class="topbar__link">
|
||||
<span class="topbar__link-label">Sam Seeceepio</span>
|
||||
<span class="topbar__link-label">{{ current_user["first_name"] + " " + current_user["last_name"] }}</span>
|
||||
{% module Icon('avatar', classes='topbar__link-icon') %}
|
||||
</a>
|
||||
</div>
|
||||
|
@@ -3,49 +3,63 @@
|
||||
{% block content %}
|
||||
|
||||
|
||||
|
||||
{% module Alert('Pending Financial Verification',
|
||||
message="<p>Your next step is to create a Task Order (T.O.) associated with JEDI Cloud. Please consult a Contracting Officer (KO) or Contracting Officer Representative (COR) to help with this step.</p>"
|
||||
) %}
|
||||
|
||||
<div class="col col--grow">
|
||||
|
||||
<div class='panel'>
|
||||
<div class='row'>
|
||||
<div class='col col--grow col--pad'>
|
||||
<form class="usa-search usa-search-small">
|
||||
<label class="usa-sr-only" for="search-field-small">Search small</label>
|
||||
<input id="search-field-small" type="search" name="search" placeholder="Search by Order ID">
|
||||
<button type="submit">
|
||||
<span class="usa-sr-only">Search</span>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class='col col--grow col--pad'>
|
||||
<select id="filter_status" name="filter_status" required="">
|
||||
<option value="" selected disabled>Filter by status</option>
|
||||
<option value="">Active</option>
|
||||
<option value="">Pending</option>
|
||||
<option value="">Denied</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel">
|
||||
|
||||
<div class="panel__content">
|
||||
|
||||
<div class="panel__heading">
|
||||
<h1>Requests <a class="usa-button usa-button-secondary" href='{{ reverse_url('request_new') }}'>New Request</a></h1>
|
||||
</div>
|
||||
|
||||
<table class="usa-table-borderless" width="100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Order ID</th>
|
||||
<th scope="col">Request Date</th>
|
||||
<th scope="col">Requester</th>
|
||||
<th scope="col">Total Apps</th>
|
||||
<th scope="col">Status</th>
|
||||
<th scope="col">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for r in requests %}
|
||||
<tr>
|
||||
<th scope="row"><a href="{{ reverse_url('request_form_update', 1, r['order_id']) }}">{{ r['order_id'] }}</a>
|
||||
{% if r['is_new'] %}<span class="usa-label">New</span>
|
||||
</th>
|
||||
{% end %}
|
||||
<td>{{ r['date'] }}</td>
|
||||
<td>{{ r['full_name'] }}</td>
|
||||
<td>{{ r['app_count'] }}</td>
|
||||
<td>{{ r['status'] }}</td>
|
||||
<td><a href="">Download</a></td>
|
||||
</tr>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Order ID</th>
|
||||
<th>Request Date</th>
|
||||
<th>Requester</th>
|
||||
<th>Total Apps</th>
|
||||
<th>Status</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for r in requests %}
|
||||
<tr>
|
||||
<td><a href="{{ reverse_url('request_form_update', 1, r['order_id']) }}">{{ r['order_id'] }}</a>
|
||||
{% if r['is_new'] %}<span class="usa-label">New</span>
|
||||
</td>
|
||||
{% end %}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<td>{{ r['date'] }}</td>
|
||||
<td>{{ r['full_name'] }}</td>
|
||||
<td>{{ r['app_count'] }}</td>
|
||||
<td>{{ r['status'] }}</td>
|
||||
<td><a href="">Download</a></td>
|
||||
</tr>
|
||||
{% end %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@@ -1,5 +1,22 @@
|
||||
{% extends "base.html.to" %}
|
||||
|
||||
{% block modal %}
|
||||
{% if modalOpen() %}
|
||||
{% apply modal %}
|
||||
<h1>A modal dialog</h1>
|
||||
|
||||
<p>We count thirty Rebel ships, Lord Vader. But they're so small they're evading our turbo-lasers! We'll have to destroy them ship to ship. Get the crews to their fighters. Luke, let me know when you're going in. I'm on my way in now... Watch yourself! There's a lot of fire coming from the right side of that deflection tower. I'm on it. Squad leaders, we've picked up a new group of signals. Enemy fighters coming your way.</p>
|
||||
<p>I hope the old man got that tractor beam out if commission, or this is going to be a real short trip. Okay, hit it! We're coming up on the sentry ships. Hold 'em off! Angle the deflector shields while I charge up the main guns! I can't believe he's gone. There wasn't anything you could have done. Come on, buddy, we're not out of this yet! You in, kid? Okay, stay sharp!</p>
|
||||
|
||||
<div class='action-group'>
|
||||
<a href='/styleguide' class='action-group__action usa-button'>Close</a>
|
||||
<a href='/styleguide' class='action-group__action'>This also closes the modal</a>
|
||||
</div>
|
||||
{% end %}
|
||||
{% end %}
|
||||
{% end %}
|
||||
|
||||
|
||||
{% block content %}
|
||||
|
||||
{% module Alert('A Warning Alert',
|
||||
@@ -7,7 +24,7 @@
|
||||
<p>This is a message. It is a very important message. Please note, <strong>proper semantic markup is required</strong> here, such as paragraph tags. Don't omit paragraph tags!</p>\
|
||||
<p>Also note the same for actions below. You'll need to include the full link markup.</p>\
|
||||
",
|
||||
actions="<a href='/styleguide'>Do something</a>",
|
||||
actions="<a href='/styleguide?modal=True'>Open a Modal Dialog</a>",
|
||||
level='warning'
|
||||
) %}
|
||||
|
||||
@@ -191,5 +208,10 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class='action-group'>
|
||||
<a href='/styleguide' class='action-group__action usa-button usa-button-big'>Action Group Button</a>
|
||||
<a href='/styleguide' class='action-group__action'>Action group link</a>
|
||||
</div>
|
||||
</div>
|
||||
{% end %}
|
||||
|
Reference in New Issue
Block a user