spouliot/PowderCoatingLogix
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
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:
Scott Pouliot
2026-05-10 18:05:29 -04:00
parent f6d457fe0e
commit 328b195127
80 changed files with 603 additions and 561 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/PowderCoating.Web/Views/Companies/CreateCompanyAdmin.cshtml
+3 -3
View File
@@ -1,4 +1,4 @@
@model PowderCoating.Application.DTOs.Company.CreateCompanyAdminDto
@model PowderCoating.Application.DTOs.Company.CreateCompanyAdminDto
@{
ViewData["Title"] = "Create Company Admin";
@@ -27,7 +27,7 @@
<h5 class="border-bottom pb-2 mb-3">
<i class="bi bi-building me-2 text-primary"></i>Company
</h5>
<div class="alert alert-info">
<div class="alert alert-info alert-permanent">
<i class="bi bi-info-circle me-2"></i>
Creating admin user for: <strong>@Model.CompanyName</strong>
</div>
@@ -109,7 +109,7 @@
</div>
<!-- Permissions Notice -->
<div class="alert alert-success mb-4">
<div class="alert alert-success alert-permanent mb-4">
<h6 class="alert-heading">
<i class="bi bi-shield-check me-2"></i>Administrator Permissions
</h6>
src/PowderCoating.Web/Views/Companies/Details.cshtml
+22 -22
View File
@@ -1,4 +1,4 @@
@model PowderCoating.Application.DTOs.Company.CompanyDto
@model PowderCoating.Application.DTOs.Company.CompanyDto
@{
ViewData["Title"] = Model.CompanyName;
@@ -470,7 +470,7 @@
<i class="bi bi-fire me-1"></i>Reset All Company Data
</h6>
<p class="text-muted small mb-0">
Permanently deletes <strong>all business data</strong> — customers, vendors, accounts, invoices, bills, jobs, quotes, inventory, catalog items, and more.
Permanently deletes <strong>all business data</strong> — customers, vendors, accounts, invoices, bills, jobs, quotes, inventory, catalog items, and more.
The company record, user accounts, and system configuration are preserved.
Use this to wipe a migration and start fresh.
</p>
@@ -491,7 +491,7 @@
There is no going back.
@if (Model.UserCount > 0)
{
<br /><strong class="text-danger">This company has @Model.UserCount user(s) — remove them first.</strong>
<br /><strong class="text-danger">This company has @Model.UserCount user(s) — remove them first.</strong>
}
</p>
</div>
@@ -523,7 +523,7 @@
<!-- Loading spinner -->
<div id="oc-loading" class="d-flex justify-content-center align-items-center py-5">
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden">Loading…</span>
<span class="visually-hidden">Loading…</span>
</div>
</div>
@@ -545,14 +545,14 @@
</div>
<table class="table table-sm table-borderless mb-0 small">
<tr><th style="width:38%;" class="text-muted fw-normal">Role</th><td id="oc-role">—</td></tr>
<tr><th class="text-muted fw-normal">Department</th><td id="oc-dept">—</td></tr>
<tr><th class="text-muted fw-normal">Position</th><td id="oc-position">—</td></tr>
<tr><th class="text-muted fw-normal">Phone</th><td id="oc-phone">—</td></tr>
<tr><th class="text-muted fw-normal">Hired</th><td id="oc-hire">—</td></tr>
<tr><th class="text-muted fw-normal">Account created</th><td id="oc-created">—</td></tr>
<tr><th class="text-muted fw-normal">Last login</th><td id="oc-lastlogin">—</td></tr>
<tr><th class="text-muted fw-normal">Email confirmed</th><td id="oc-emailconf">—</td></tr>
<tr><th style="width:38%;" class="text-muted fw-normal">Role</th><td id="oc-role">—</td></tr>
<tr><th class="text-muted fw-normal">Department</th><td id="oc-dept">—</td></tr>
<tr><th class="text-muted fw-normal">Position</th><td id="oc-position">—</td></tr>
<tr><th class="text-muted fw-normal">Phone</th><td id="oc-phone">—</td></tr>
<tr><th class="text-muted fw-normal">Hired</th><td id="oc-hire">—</td></tr>
<tr><th class="text-muted fw-normal">Account created</th><td id="oc-created">—</td></tr>
<tr><th class="text-muted fw-normal">Last login</th><td id="oc-lastlogin">—</td></tr>
<tr><th class="text-muted fw-normal">Email confirmed</th><td id="oc-emailconf">—</td></tr>
</table>
</div>
@@ -680,7 +680,7 @@
@Html.AntiForgeryToken()
<input type="hidden" id="resetUserId" name="id" />
<div class="modal-body">
<div class="alert alert-warning">
<div class="alert alert-warning alert-permanent">
<i class="bi bi-exclamation-triangle me-2"></i>
You are about to reset the password for <strong id="resetUserName"></strong>.
</div>
@@ -706,7 +706,7 @@
@section Scripts {
<script>
// Reset Data Modal — enable submit only when user types "DELETE"
// Reset Data Modal — enable submit only when user types "DELETE"
(function () {
var input = document.getElementById('resetDataConfirmInput');
var hidden = document.getElementById('resetDataConfirmHidden');
@@ -725,7 +725,7 @@
}
})();
// Hard Delete Modal — enable submit only when user types "DELETE"
// Hard Delete Modal — enable submit only when user types "DELETE"
(function () {
var input = document.getElementById('hardDeleteConfirmInput');
var hidden = document.getElementById('hardDeleteConfirmHidden');
@@ -760,7 +760,7 @@
});
}
// ── User Details Modal ────────────────────────────────────────────────
// ── User Details Modal ────────────────────────────────────────────────
(function () {
const offcanvasEl = document.getElementById('userDetailOffcanvas');
const oc = new bootstrap.Modal(offcanvasEl);
@@ -806,12 +806,12 @@
badge.textContent = u.isActive ? 'Active' : 'Inactive';
badge.className = 'badge ms-auto ' + (u.isActive ? 'bg-success' : 'bg-danger');
document.getElementById('oc-role').textContent = u.companyRole ? u.companyRole.replace('Company', '') : '—';
document.getElementById('oc-dept').textContent = u.department || '—';
document.getElementById('oc-position').textContent = u.position || '—';
document.getElementById('oc-phone').textContent = u.phone || '—';
document.getElementById('oc-hire').textContent = u.hireDate || '—';
document.getElementById('oc-created').textContent = u.createdAt || '—';
document.getElementById('oc-role').textContent = u.companyRole ? u.companyRole.replace('Company', '') : '—';
document.getElementById('oc-dept').textContent = u.department || '—';
document.getElementById('oc-position').textContent = u.position || '—';
document.getElementById('oc-phone').textContent = u.phone || '—';
document.getElementById('oc-hire').textContent = u.hireDate || '—';
document.getElementById('oc-created').textContent = u.createdAt || '—';
document.getElementById('oc-lastlogin').textContent = u.lastLoginDate || 'Never';
document.getElementById('oc-emailconf').innerHTML = u.emailConfirmed
? '<span class="text-success"><i class="bi bi-check-circle-fill me-1"></i>Yes</span>'
src/PowderCoating.Web/Views/Companies/Index.cshtml
+7 -7
View File
@@ -1,4 +1,4 @@
@model List<PowderCoating.Application.DTOs.Company.CompanyListDto>
@model List<PowderCoating.Application.DTOs.Company.CompanyListDto>
@section Styles {
<style>
@@ -58,7 +58,7 @@
<div class="input-group">
<span class="input-group-text"><i class="bi bi-search"></i></span>
<input type="text" name="searchTerm" class="form-control"
placeholder="Search by name, code, email, phone…"
placeholder="Search by name, code, email, phone…"
value="@searchTerm" />
</div>
</div>
@@ -230,7 +230,7 @@
</table>
</div>
<!-- Mobile card view — shown on screens < 992px (table-responsive hidden by mobile-cards.css) -->
<!-- Mobile card view — shown on screens < 992px (table-responsive hidden by mobile-cards.css) -->
<div class="mobile-card-view">
<div class="mobile-card-list">
@foreach (var company in Model)
@@ -274,7 +274,7 @@
}
</div>
<div class="mobile-card-footer">
<span class="btn btn-sm btn-outline-primary">View →</span>
<span class="btn btn-sm btn-outline-primary">View →</span>
</div>
</a>
}
@@ -286,7 +286,7 @@
{
<div class="card-footer d-flex justify-content-between align-items-center">
<div class="text-muted small">
Showing @((pageNumber - 1) * pageSize + 1)–@(Math.Min(pageNumber * pageSize, totalCount)) of @totalCount companies
Showing @((pageNumber - 1) * pageSize + 1)–@(Math.Min(pageNumber * pageSize, totalCount)) of @totalCount companies
</div>
<div class="d-flex align-items-center gap-3">
<div>
@@ -413,10 +413,10 @@
<h6 class="fw-bold text-danger"><i class="bi bi-fire me-2"></i>Hard Delete (Permanent)</h6>
<p class="text-muted small mb-2">
<strong class="text-danger">This cannot be undone.</strong>
All company data — users, jobs, quotes, customers, invoices, and everything else — will be
All company data — users, jobs, quotes, customers, invoices, and everything else — will be
<strong>permanently and irreversibly deleted</strong> from the database.
</p>
<div class="alert alert-danger py-2 mb-3">
<div class="alert alert-danger alert-permanent py-2 mb-3">
<i class="bi bi-exclamation-octagon-fill me-2"></i>
Type <strong>DELETE</strong> below to enable permanent deletion.
</div>