dashboard upgrade

2026-06-27 14:19:17 -04:00
parent ddb2d58e2f
commit 2d9a5b52b7
8 changed files with 795 additions and 65 deletions
--- a/src/SportsDivision.Web/Views/Shared/_HelpLayout.cshtml
+++ b/src/SportsDivision.Web/Views/Shared/_HelpLayout.cshtml
@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>@ViewData["Title"] - Sports Division Help</title>
+    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    <style>
+        :root {
+            --help-primary: #003366;
+            --help-accent: #FFD700;
+        }
+        body {
+            background-color: #f4f6f9;
+            color: #212529;
+        }
+        .help-topbar {
+            background-color: var(--help-primary);
+            color: #fff;
+            padding: .6rem 1rem;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            position: sticky;
+            top: 0;
+            z-index: 1030;
+            box-shadow: 0 2px 6px rgba(0,0,0,.15);
+        }
+        .help-topbar .brand { font-weight: 600; font-size: 1.1rem; }
+        .help-topbar .brand i { color: var(--help-accent); }
+        .help-topbar a.back-link { color: #fff; text-decoration: none; }
+        .help-topbar a.back-link:hover { color: var(--help-accent); }
+
+        .help-wrap { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 4rem; }
+
+        .help-hero {
+            background: linear-gradient(135deg, var(--help-primary), #004080);
+            color: #fff;
+            border-radius: .75rem;
+            padding: 2rem;
+            margin-bottom: 1.25rem;
+        }
+        .help-search-bar {
+            position: sticky;
+            top: 56px;
+            z-index: 1020;
+            background: #f4f6f9;
+            padding: .75rem 0;
+            margin-bottom: 1rem;
+        }
+        .help-search-bar input {
+            font-size: 1.05rem;
+            padding: .65rem 1rem .65rem 2.6rem;
+        }
+        .help-search-icon {
+            position: absolute; left: .9rem; top: 50%; transform: translateY(-50%);
+            color: #6c757d; pointer-events: none;
+        }
+        .help-layout { display: grid; grid-template-columns: 240px 1fr; gap: 1.5rem; }
+        @@media (max-width: 800px) { .help-layout { grid-template-columns: 1fr; } .help-toc { display: none; } }
+
+        .help-toc {
+            position: sticky; top: 130px; align-self: start;
+            max-height: calc(100vh - 150px); overflow-y: auto;
+        }
+        .help-toc a {
+            display: block; padding: .3rem .5rem; color: #495057; text-decoration: none;
+            border-left: 3px solid transparent; font-size: .92rem; border-radius: 0 .25rem .25rem 0;
+        }
+        .help-toc a:hover { background: #e9ecef; border-left-color: var(--help-accent); color: var(--help-primary); }
+
+        .help-section { scroll-margin-top: 130px; margin-bottom: 2rem; }
+        .help-section > h2 {
+            color: var(--help-primary); border-bottom: 2px solid var(--help-accent);
+            padding-bottom: .35rem; margin-bottom: 1rem; font-size: 1.45rem;
+        }
+        .help-entry {
+            background: #fff; border: 1px solid #e3e6ea; border-radius: .5rem;
+            padding: 1rem 1.25rem; margin-bottom: .85rem; box-shadow: 0 1px 2px rgba(0,0,0,.04);
+        }
+        .help-entry h3 { font-size: 1.08rem; margin-bottom: .5rem; color: #003366; }
+        .help-entry h3 i { color: var(--help-accent); }
+        .help-entry p:last-child, .help-entry ul:last-child, .help-entry ol:last-child { margin-bottom: 0; }
+        .help-entry code, .help-formula {
+            background: #eef2f7; border-radius: .25rem; padding: .1rem .35rem; font-size: .92em;
+        }
+        .help-formula { display: inline-block; padding: .4rem .7rem; margin: .25rem 0; font-weight: 600; }
+        mark { background: var(--help-accent); padding: 0 .1rem; }
+        .help-noresults { display: none; }
+    </style>
+</head>
+<body>
+    <div class="help-topbar">
+        <span class="brand"><i class="bi bi-life-preserver"></i> Sports Division Help</span>
+        <a class="back-link" asp-controller="Dashboard" asp-action="Index"><i class="bi bi-arrow-left-circle me-1"></i>Back to App</a>
+    </div>
+
+    <div class="help-wrap">
+        @RenderBody()
+    </div>
+
+    <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
+    @await RenderSectionAsync("Scripts", required: false)
+</body>
+</html>
--- a/src/SportsDivision.Web/Views/Shared/_LoginPartial.cshtml
+++ b/src/SportsDivision.Web/Views/Shared/_LoginPartial.cshtml
@@ -29,6 +29,12 @@
            <span class="d-none d-sm-inline">@displayName</span>
        </button>
        <ul class="dropdown-menu dropdown-menu-end">
+            <li>
+                <a class="dropdown-item" asp-controller="Help" asp-action="Index">
+                    <i class="bi bi-question-circle me-2"></i>Help &amp; User Guide
+                </a>
+            </li>
+            <li><hr class="dropdown-divider" /></li>
            <li>
                <form asp-controller="Account" asp-action="Logout" method="post">
                    @Html.AntiForgeryToken()