[Perl] DAQ system for the FAPG.
feat display title, no breadcrumbs, quick links on front page
- Use Bootstrap display-5 for the main dashboard title - Hide breadcrumbs on the homepage (empty breadcrumbs list) - Add quick links nav (Probes, Status, Downloads) under the title - Toolbar conditionally renders breadcrumbs only when non-empty
Changed files
roles/dashboard/lib/FAPG/DAQ/Dashboard/Controller/Dashboard.pm
@@ -9,7 +9,7 @@
9
9
$self->render(
10
10
template => 'dashboard/index',
11
11
probes => $self->probes,
12
Removed:
breadcrumbs => [ { label => 'Home' } ],
12
Added:
breadcrumbs => [],
13
13
);
14
14
}
15
15
roles/dashboard/t/00-homepage.t
@@ -20,13 +20,11 @@
20
20
->element_exists_not('.navbar-nav a.nav-link.active')
21
21
->element_exists(
22
22
'a.header-status-link[href="/status"][data-header-status]')
23
Removed:
->element_exists(
24
Removed:
'nav[aria-label="Breadcrumb"] [aria-current="page"]')
25
Removed:
->text_is(
26
Removed:
'nav[aria-label="Breadcrumb"] [aria-current="page"]', 'Home' )
27
Removed:
->element_exists_not(
28
Removed:
'div.toolbar-items a.status-summary[href="/status"][data-overview-status]'
29
Removed:
)
23
Added:
->element_exists_not('nav[aria-label="Breadcrumb"]')
24
Added:
->element_exists('h1.display-5')
25
Added:
->element_exists('nav[aria-label="Quick links"] a[href="/probes"]')
26
Added:
->element_exists('nav[aria-label="Quick links"] a[href="/status"]')
27
Added:
->element_exists('nav[aria-label="Quick links"] a[href="/downloads"]')
30
28
->element_exists(
31
29
'section.reading-quick-status [data-reading-quick-status]')
32
30
->element_exists('section.reading-quick-status h2')
roles/dashboard/templates/dashboard/index.html.ep
@@ -6,8 +6,15 @@
6
6
7
7
<section class="mb-4" aria-label="DAQ status overview">
8
8
<div class="mb-3">
9
Removed:
<h1 class="h4 fw-bold mb-1">FAPG DAQ Dashboard</h1>
10
Removed:
<p class="text-muted mb-0">Live aquaponic sensor readings</p>
9
Added:
<h1 class="display-5 fw-bold mb-1">FAPG DAQ Dashboard</h1>
10
Added:
<p class="text-muted mb-2">Live aquaponic sensor readings</p>
11
Added:
<nav aria-label="Quick links">
12
Added:
<ul class="list-inline mb-0">
13
Added:
<li class="list-inline-item"><a class="text-success fw-semibold text-decoration-none" href="/probes">Probes</a></li>
14
Added:
<li class="list-inline-item"><a class="text-success fw-semibold text-decoration-none" href="/status">Status</a></li>
15
Added:
<li class="list-inline-item"><a class="text-success fw-semibold text-decoration-none" href="/downloads">Downloads</a></li>
16
Added:
</ul>
17
Added:
</nav>
11
18
</div>
12
19
13
20
<section class="reading-quick-status" aria-label="Sensor reading quick status">
roles/dashboard/templates/dashboard/toolbar.html.ep
@@ -1,6 +1,7 @@
1
1
<!-- -*- mode: web; -*- -->
2
2
3
3
<div id="toolbar" class="d-flex flex-column flex-md-row align-items-start align-items-md-center justify-content-between gap-2 mb-3 toolbar">
4
Added:
% if ($breadcrumbs->@*) {
4
5
<nav aria-label="Breadcrumb">
5
6
<ol class="breadcrumb mb-0 bg-white border rounded-pill px-3 py-2 small fw-bold">
6
7
% for my $index (0 .. $breadcrumbs->$#*) {
@@ -16,6 +17,7 @@
16
17
% }
17
18
</ol>
18
19
</nav>
20
Added:
% }
19
21
% if (defined $graph_control_aria_label) {
20
22
<div class="toolbar-items d-flex align-items-center gap-2 ms-md-auto">
21
23
%= include 'dashboard/graph-control', aria_label => $graph_control_aria_label