Design consistency audit fixes: alerts, cards, dark mode, utilities

Alert sweep (113 alerts, 79 files):
  All persistent static banners now carry alert-permanent so the
  layout's 5-second auto-dismiss cannot swallow guidance, warnings,
  or validation errors. Transient dismissible toasts left untouched.

CSS fixes (site.css):
  .card.shadow-sm      — strips rogue border from ~40 drifted cards
  .card-header.bg-white — rebinds to var(--bs-body-bg) so card
                          headers follow dark/light theme correctly
  Typography utilities  — .text-2xs (.68rem), .text-xs (.73rem)
  Token color classes   — .text-ember, .text-ok, .text-bad,
                          .text-warn, .text-cool, .bg-paper-2
  Layout utilities      — .mw-xs/sm/md/lg replace inline max-width
  Comment              — documents text-ember vs text-primary intent

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-10 18:05:29 -04:00
parent f6d457fe0e
commit 328b195127
80 changed files with 603 additions and 561 deletions
@@ -43,7 +43,7 @@
<input type="hidden" asp-for="CompanyName" />
<input type="hidden" asp-for="CreatedAt" />
<input type="hidden" asp-for="CompanyId" />
<div asp-validation-summary="ModelOnly" class="alert alert-danger" role="alert"></div>
<div asp-validation-summary="ModelOnly" class="alert alert-danger alert-permanent" role="alert"></div>
<div class="mb-3">
<label asp-for="Title" class="form-label fw-semibold">
@@ -1,4 +1,4 @@
@model PowderCoating.Application.DTOs.BugReport.CreateBugReportDto
@model PowderCoating.Application.DTOs.BugReport.CreateBugReportDto
@using PowderCoating.Core.Enums
@{
ViewData["Title"] = "Report a Bug";
@@ -35,7 +35,7 @@
</div>
<div class="card-body">
<form asp-action="Submit" method="post" enctype="multipart/form-data">
<div asp-validation-summary="ModelOnly" class="alert alert-danger" role="alert"></div>
<div asp-validation-summary="ModelOnly" class="alert alert-danger alert-permanent" role="alert"></div>
<div class="mb-3">
<label asp-for="Title" class="form-label fw-semibold">
@@ -59,10 +59,10 @@
<div class="mb-4">
<label asp-for="Priority" class="form-label fw-semibold">Priority</label>
<select asp-for="Priority" class="form-select">
<option value="@((int)BugReportPriority.Low)">Low Minor inconvenience, workaround exists</option>
<option value="@((int)BugReportPriority.Normal)" selected>Normal Affects workflow but not critical</option>
<option value="@((int)BugReportPriority.High)">High Significantly impacts operations</option>
<option value="@((int)BugReportPriority.Critical)">Critical System unusable or data loss risk</option>
<option value="@((int)BugReportPriority.Low)">Low – Minor inconvenience, workaround exists</option>
<option value="@((int)BugReportPriority.Normal)" selected>Normal – Affects workflow but not critical</option>
<option value="@((int)BugReportPriority.High)">High – Significantly impacts operations</option>
<option value="@((int)BugReportPriority.Critical)">Critical – System unusable or data loss risk</option>
</select>
<span asp-validation-for="Priority" class="text-danger small"></span>
</div>
@@ -104,7 +104,7 @@
const li = document.createElement('li');
const sizeMb = (f.size / 1024 / 1024).toFixed(1);
if (f.size > maxBytes) {
li.innerHTML = `<i class="bi bi-exclamation-triangle text-danger"></i> ${f.name} (${sizeMb} MB) exceeds 100 MB limit`;
li.innerHTML = `<i class="bi bi-exclamation-triangle text-danger"></i> ${f.name} (${sizeMb} MB) — exceeds 100 MB limit`;
} else {
li.innerHTML = `<i class="bi bi-file-earmark text-secondary"></i> ${f.name} (${sizeMb} MB)`;
}