Skip to content

Commit

Permalink
Audit dashboard now looks nice on mobile devices (#212)
Browse files Browse the repository at this point in the history 
* Audit dashboard now looks nice on mobile devices

* Added space between filter and results
  • Loading branch information
@KaydenML
KaydenML authored Dec 8, 2023
1 parent ff4abae commit c37e2d7
Show file tree
Hide file tree
Showing 2 changed files with 51 additions and 49 deletions.
66 changes: 32 additions & 34 deletions glados-web/templates/audit_dashboard.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,43 +7,41 @@
{% block content %}
<div class="row">
<div class="col">
<ul>
<br />
<h1 class="header text-center">Audit Dashboard</h1>
<div class="d-flex justify-content-center flex-wrap">
<div id="content-buttons" class="btn-group mx-1" role="group">
<button id="all-content-button" filter="All" class="btn btn-outline-secondary"
type="button">All</button>
<button id="headers-button" filter="Headers" class="btn btn-outline-secondary"
type="button">Headers</button>
<button id="bodies-button" filter="Bodies" class="btn btn-outline-secondary"
type="button">Bodies</button>
<button id="receipts-button" filter="Receipts" class="btn btn-outline-secondary"
type="button">Receipts</button>
</div>
<div id="strategy-buttons" class="btn-group mx-1" role="group">
<button id="all-strategy-button" filter="All" class="btn btn-outline-secondary"
type="button">All</button>
<button id="latest-button" filter="Latest" class="btn btn-outline-secondary"
type="button">Latest</button>
<button id="random-button" filter="Random" class="btn btn-outline-secondary"
type="button">Random</button>
<button id="oldest-button" filter="Oldest" class="btn btn-outline-secondary" type="button">Oldest
Unaudited</button>
</div>
<div id="success-buttons" class="btn-group mx-1 " role="group">
<button id="all-success-button" filter="All" class="btn btn-outline-secondary"
type="button">All</button>
<button id="success-button" filter="Success" class="btn btn-outline-secondary"
type="button">Success</button>
<button id="failure-button" filter="Failure" class="btn btn-outline-secondary"
type="button">Failure</button>
</div>
<br />
<h1 class="header text-center">Audit Dashboard</h1>
<div class="d-flex justify-content-center flex-wrap">
<div id="content-buttons" class="btn-group mx-1" role="group">
<button id="all-content-button" filter="All" class="btn btn-outline-secondary"
type="button">All</button>
<button id="headers-button" filter="Headers" class="btn btn-outline-secondary"
type="button">Headers</button>
<button id="bodies-button" filter="Bodies" class="btn btn-outline-secondary"
type="button">Bodies</button>
<button id="receipts-button" filter="Receipts" class="btn btn-outline-secondary"
type="button">Receipts</button>
</div>

</ul>
<div id="strategy-buttons" class="btn-group mx-1" role="group">
<button id="all-strategy-button" filter="All" class="btn btn-outline-secondary"
type="button">All</button>
<button id="latest-button" filter="Latest" class="btn btn-outline-secondary"
type="button">Latest</button>
<button id="random-button" filter="Random" class="btn btn-outline-secondary"
type="button">Random</button>
<button id="oldest-button" filter="Oldest" class="btn btn-outline-secondary" type="button">Oldest
Unaudited</button>
</div>
<div id="success-buttons" class="btn-group mx-1 " role="group">
<button id="all-success-button" filter="All" class="btn btn-outline-secondary"
type="button">All</button>
<button id="success-button" filter="Success" class="btn btn-outline-secondary"
type="button">Success</button>
<button id="failure-button" filter="Failure" class="btn btn-outline-secondary"
type="button">Failure</button>
</div>
</div>
</div>
</div>
<br/>
<div id="audit-table"></div>
<style>
.btn-outline-secondary.active {
Expand Down
34 changes: 19 additions & 15 deletions glados-web/templates/audit_table.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
<div class="container">
<div class="card shadow-sm content-card bx-2 mb-3">
<table class="table">
<thead>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th scope="col">Period</th>
<th scope="col">Total audits</th>
Expand All @@ -11,8 +12,8 @@
<th scope="col"><span class="badge text-bg-danger">Failure rate</span> (%)</th>
<th scope="col">Audits per minute</th>
</tr>
</thead>
<tbody>
</thead>
<tbody>
{% for stat in stats %}
<tr>
<th scope="row">{{ stat.period.to_string() }}</th>
Expand All @@ -24,16 +25,18 @@
<td>{{ stat.audits_per_minute }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col">
<ul class="list-unstyled">
<div class="card shadow-sm content-card">
<div class="card-body">
<table class="table">
<thead>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th scope="col">Audit</th>
<th scope="col">Result</th>
Expand All @@ -45,12 +48,12 @@
<th scope="col">Audited at</th>
<th scope="col">Client</th>
</tr>
</thead>
<tbody>
</thead>
<tbody>
{% for (audit, content, client_info) in audits %}
<tr>
<td>{% if audit.trace != "" %}<a href="/audit/id/{{ audit.id }}">{{ audit.id
}}</a>{%
}}</a>{%
else
%}
{{ audit.id }}{% endif %}
Expand All @@ -61,10 +64,10 @@
<td>{{ content.protocol_id.as_text() }}</td>
<td>{{ audit.strategy_as_text() }}</td>
<td><a href="/content/key/{{content.key_as_hex()}}/">{{ content.key_as_hex_short()
}}</a>
}}</a>
</td>
<td><a href="/content/id/{{content.id_as_hex()}}/">{{ content.id_as_hex_short()
}}</a>
}}</a>
</td>
<td title="{{ content.available_at_local_time() }}">{{
content.available_at_humanized()
Expand All @@ -74,8 +77,9 @@
<td>{{ client_info.version_info }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</tbody>
</table>
</div>
</div>
</div>
</ul>
Expand Down

0 comments on commit c37e2d7

Please sign in to comment.