Refactor code structure for improved readability and maintainability

This commit is contained in:
Daniel Volz
2025-12-21 07:29:48 +01:00
parent 4ffbcef877
commit 3ffca8f333
10 changed files with 47 additions and 6 deletions
+13 -1
View File
@@ -3,7 +3,19 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Medassist</title> <title>MedAssist</title>
<!-- Favicons -->
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="manifest" href="/site.webmanifest" />
<!-- Theme color -->
<meta name="theme-color" content="#0f172a" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 8.3 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

+3
View File
File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 1.9 MiB

+21
View File
@@ -0,0 +1,21 @@
{
"name": "MedAssist",
"short_name": "MedAssist",
"icons": [
{
"src": "/web-app-manifest-192x192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/web-app-manifest-512x512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 159 KiB

+8 -5
View File
@@ -507,9 +507,12 @@ export default function App() {
return ( return (
<main className="page"> <main className="page">
<header className="hero"> <header className="hero">
<div> <div className="hero-title">
<p className="eyebrow">{pageInfo.eyebrow}</p> <img src="/favicon.svg" alt="MedAssist" className="hero-logo" />
<h1>{pageInfo.title}</h1> <div>
<p className="eyebrow">{pageInfo.eyebrow}</p>
<h1>{pageInfo.title}</h1>
</div>
</div> </div>
<div className="header-actions"> <div className="header-actions">
<div className="tabs"> <div className="tabs">
@@ -1405,7 +1408,7 @@ function getReminderStatusText(reminderDaysBefore: number, lowStock: Coverage[],
return ( return (
<> <>
<strong className="warning-text"> {medsNeedingReminder.length} med{medsNeedingReminder.length > 1 ? "s" : ""} need reorder</strong> <strong className="warning-text"> {medsNeedingReminder.length} med{medsNeedingReminder.length > 1 ? "s" : ""} need reorder</strong>
{" · "}Last email: {formatLastSent(lastSent)} {" · "}Last reminder: {formatLastSent(lastSent)}
</> </>
); );
} }
@@ -1435,7 +1438,7 @@ function getReminderStatusText(reminderDaysBefore: number, lowStock: Coverage[],
return ( return (
<> <>
<span className="success-text"> All stock OK</span> <span className="success-text"> All stock OK</span>
{" · "}Last email: {formatLastSent(lastSent)} {" · "}Last reminder: {formatLastSent(lastSent)}
</> </>
); );
} }
+2
View File
@@ -111,6 +111,8 @@ body {
[data-theme="light"] .icon-btn:hover { background: rgba(0, 0, 0, 0.08); } [data-theme="light"] .icon-btn:hover { background: rgba(0, 0, 0, 0.08); }
[data-theme="light"] .icon-btn.active { background: rgba(47, 134, 246, 0.12); } [data-theme="light"] .icon-btn.active { background: rgba(47, 134, 246, 0.12); }
.hero-title { display: flex; align-items: center; gap: 1rem; }
.hero-logo { width: 48px; height: 48px; }
.hero h1 { margin: 0.15rem 0 0; font-size: 1.6rem; font-weight: 600; } .hero h1 { margin: 0.15rem 0 0; font-size: 1.6rem; font-weight: 600; }
.sub { color: var(--text-secondary); margin: 0; } .sub { color: var(--text-secondary); margin: 0; }
.eyebrow { letter-spacing: 0.06em; text-transform: uppercase; color: #7ca7ff; font-size: 0.75rem; margin: 0; font-weight: 500; } .eyebrow { letter-spacing: 0.06em; text-transform: uppercase; color: #7ca7ff; font-size: 0.75rem; margin: 0; font-weight: 500; }