From 15bb0c5ae53fd00b5f5c9268e2969a7ced10585c Mon Sep 17 00:00:00 2001
From: charclayt <ukfeature@gmail.com>
Date: Thu, 6 Apr 2023 19:23:00 +0100
Subject: [PATCH] Reports page editing
Added 4 fields at top of reports page to display data.
---
src/index.css | 12 ++++++++
src/reports.html | 72 +++++++++++++++++++++++++++++++++++++++++++++++-
2 files changed, 83 insertions(+), 1 deletion(-)
diff --git a/src/index.css b/src/index.css
index 6e57aeed..dc4e084c 100644
--- a/src/index.css
+++ b/src/index.css
@@ -66,4 +66,16 @@ p {
h1 {
color: var(--text-colour);
+}
+
+div.report_item {
+ width: 4rem;
+ height: 4rem;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+div.report_box {
+ padding-bottom: 1.25rem;
}
\ No newline at end of file
diff --git a/src/reports.html b/src/reports.html
index 37b63c98..e54ff229 100644
--- a/src/reports.html
+++ b/src/reports.html
@@ -51,7 +51,77 @@
<div class="col-xl-10 d-flex flex-column">
<main class="row overflow-auto">
<div class="col pt-5">
- <!-- Page content goes here -->
+ <div class="content" style="width: 90%; padding: 1.75rem 1.75rem 1px; margin: 0 auto;">
+ <div class="d-flex flex-column flex-md-row justify-content-md-between align-items-md-center py-2 text-center text-md-start">
+ <div class="flex-grow-1 mb-1 mb-md-0">
+ <h1 class="h3 fw-bold mb-2 text-reset">
+ Dashboard reports
+ </h1>
+ <h2 class="h6 fw-medium fw-medium text-muted mb-0">
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit.
+ </h2>
+ </div>
+ </div>
+ </div>
+ <div class="content mt-3" style="width: 90%; padding: 1.75rem 1.75rem 1px; margin: 0 auto;">
+ <div class="row">
+ <div class="report_box col-12 col-md-6 col-xl-3">
+ <div class="rounded d-flex flex-column h-100 mb-0" style="background-color: rgb(212, 212, 212);">
+ <div class="content flex-grow-1 d-flex justify-content-between align-items-center" style="padding: 1.25rem;">
+ <dl class="mb-0">
+ <dt class="fs-3 fw-bold">64</dt>
+ <dd class="fs-sm fw-medium fs-sm fw-medium text-muted mb-0">Patients admitted</dd>
+ </dl>
+ <div class="report_item rounded bg-dark">
+ <i class="bi-people" style="font-size:2rem; color: white;"></i>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="report_box col-12 col-md-6 col-xl-3">
+ <div class="rounded d-flex flex-column h-100 mb-0" style="background-color: rgb(212, 212, 212);">
+ <div class="content flex-grow-1 d-flex justify-content-between align-items-center" style="padding: 1.25rem;">
+ <dl class="mb-0">
+ <dt class="fs-3 fw-bold">32</dt>
+ <dd class="fs-sm fw-medium fs-sm fw-medium text-muted mb-0">Referrals recommended</dd>
+ </dl>
+ <div class="report_item rounded bg-dark">
+ <i class="bi-person-exclamation" style="font-size:2rem; color: white;"></i>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="report_box col-12 col-md-6 col-xl-3">
+ <div class="rounded d-flex flex-column h-100 mb-0" style="background-color: rgb(212, 212, 212);">
+ <div class="content flex-grow-1 d-flex justify-content-between align-items-center" style="padding: 1.25rem;">
+ <dl class="mb-0">
+ <dt class="fs-3 fw-bold">8</dt>
+ <dd class="fs-sm fw-medium fs-sm fw-medium text-muted mb-0">Patients referred</dd>
+ </dl>
+ <div class="report_item rounded bg-dark">
+ <i class="bi-person-check" style="font-size:2rem; color: white;"></i>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="report_box col-12 col-md-6 col-xl-3">
+ <div class="rounded d-flex flex-column h-100 mb-0" style="background-color: rgb(212, 212, 212);">
+ <div class="content flex-grow-1 d-flex justify-content-between align-items-center" style="padding: 1.25rem;">
+ <dl class="mb-0">
+ <dt class="fs-3 fw-bold">12.5%</dt>
+ <dd class="fs-sm fw-medium fs-sm fw-medium text-muted mb-0">Of patients referred</dd>
+ </dl>
+ <div class="report_item rounded bg-dark">
+ <i class="bi-pie-chart" style="font-size:2rem; color: white;"></i>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="row">
+
+ </div>
+ </div>
</div>
</main>
</div>
--
GitLab