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

Merge pull request #92 from dod-ccpo/ui/responsive-tables

Browse Source 
Assorted table and layout fixes
This commit is contained in:
andrewdds
2018-07-24 14:26:39 -04:00
committed by GitHub
parent e8a988f90f e66deefb6c
commit 51ed8c2169
5 changed files with 101 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
templates/requests.html.to
View File

@@ -20,46 +20,39 @@
</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">
<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>
<div class='responsive-table-wrapper'>
<table>
<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>
{% 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>
{% end %}
</tbody>
</table>
</tbody>
</table>
</div>
</div>
</div>

62
templates/styleguide.html.to
View File

@@ -175,39 +175,41 @@
</ul>
</section>
<table class='col--grow'>
<thead>
<tr>
<th class='table-cell--expand'>Expanded Column</th>
<th>Normal Column</th>
<th class='table-cell--align-right'>Right Aligned</th>
<th class='table-cell--shrink'>Shrunk</th>
</tr>
</thead>
<div class='responsive-table-wrapper'>
<table>
<thead>
<tr>
<th class='table-cell--expand'>Expanded Column</th>
<th class='table-cell--hide-small'>Hidden on Small</th>
<th class='table-cell--align-right'>Right Aligned</th>
<th class='table-cell--shrink'>Shrunk</th>
</tr>
</thead>
<tbody>
<tr>
<td class='table-cell--expand'>Table Cell</td>
<td>Table Cell</td>
<td class='table-cell--align-right'>1,234.56</td>
<td class='table-cell--shrink'>Table Cell</td>
</tr>
<tbody>
<tr>
<td class='table-cell--expand'>Table Cell</td>
<td class='table-cell--hide-small'>Table Cell</td>
<td class='table-cell--align-right'>1,234.56</td>
<td class='table-cell--shrink'>Table Cell</td>
</tr>
<tr>
<td class='table-cell--expand'>Table Cell</td>
<td>Table Cell</td>
<td class='table-cell--align-right'>1,231,253.43</td>
<td class='table-cell--shrink'>Table Cell</td>
</tr>
<tr>
<td class='table-cell--expand'>Table Cell</td>
<td class='table-cell--hide-small'>Table Cell</td>
<td class='table-cell--align-right'>1,231,253.43</td>
<td class='table-cell--shrink'>Table Cell</td>
</tr>
<tr>
<td class='table-cell--expand'>Table Cell</td>
<td>Table Cell</td>
<td class='table-cell--align-right'>564.54</td>
<td class='table-cell--shrink'>Table Cell</td>
</tr>
</tbody>
</table>
<tr>
<td class='table-cell--expand'>Table Cell</td>
<td class='table-cell--hide-small'>Table Cell</td>
<td class='table-cell--align-right'>564.54</td>
<td class='table-cell--shrink'>Table Cell</td>
</tr>
</tbody>
</table>
</div>
<div class='action-group'>
<a href='/styleguide' class='action-group__action usa-button usa-button-big'>Action Group Button</a>