webapp: fix a11y contrast, heading hierarchy, prefix-safe modal actions
- Accessibility: dark ink (#00003d) on warning/success buttons, badges, and success alert - white text on #ff9500/#0ad64f failed WCAG AA (~2:1); dark-on-bright now passes. - Heading hierarchy: sidebar brand h1 -> div.brand-title (with matching CSS selector), and standardized all page-header titles to a single <h1> per page (8 templates were h2). - Prefix-safe modal JS: dashboard/backups/reports/enrollment delete+clone actions now build their form action from url_for(...'__K__'/'__F__').replace(...) instead of hardcoded paths, so they survive a URL-prefix mount.
This commit is contained in:
@@ -144,7 +144,7 @@ a { color: var(--link); }
|
||||
max-width: 100%;
|
||||
filter: brightness(0) invert(1);
|
||||
}
|
||||
.sidebar-header h1 {
|
||||
.sidebar-header .brand-title {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
@@ -412,12 +412,12 @@ a { color: var(--link); }
|
||||
.pxe-btn-primary:hover, .btn-primary:hover { background: var(--primary-dark); color: #fff; }
|
||||
.pxe-btn-secondary, .btn-secondary { background: var(--secondary); color: #fff; border-color: var(--secondary); }
|
||||
.pxe-btn-secondary:hover, .btn-secondary:hover { background: var(--secondary-dark); color: #fff; }
|
||||
.pxe-btn-success, .btn-success { background: var(--success); color: #fff; border-color: var(--success); }
|
||||
.pxe-btn-success:hover, .btn-success:hover { background: var(--success-dark); color: #fff; }
|
||||
.pxe-btn-success, .btn-success { background: var(--success); color: #00003d; border-color: var(--success); }
|
||||
.pxe-btn-success:hover, .btn-success:hover { background: var(--success-dark); color: #00003d; }
|
||||
.pxe-btn-info, .btn-info { background: var(--info); color: #fff; border-color: var(--info); }
|
||||
.pxe-btn-info:hover, .btn-info:hover { background: var(--info-dark); color: #fff; }
|
||||
.pxe-btn-warning, .btn-warning { background: var(--warning); color: #fff; border-color: var(--warning); }
|
||||
.pxe-btn-warning:hover, .btn-warning:hover { background: var(--warning-dark); color: #fff; }
|
||||
.pxe-btn-warning, .btn-warning { background: var(--warning); color: #00003d; border-color: var(--warning); }
|
||||
.pxe-btn-warning:hover, .btn-warning:hover { background: var(--warning-dark); color: #00003d; }
|
||||
.pxe-btn-danger, .btn-danger { background: var(--danger); color: #fff; border-color: var(--danger); }
|
||||
.pxe-btn-danger:hover, .btn-danger:hover { background: var(--danger-dark); color: #fff; }
|
||||
|
||||
@@ -440,7 +440,7 @@ a { color: var(--link); }
|
||||
.btn-outline-danger:hover { background: var(--danger); color: #fff; }
|
||||
.btn-outline-secondary:hover { background: var(--secondary); color: #fff; }
|
||||
.btn-outline-success { color: var(--success); border-color: var(--success); }
|
||||
.btn-outline-success:hover { background: var(--success); color: #fff; }
|
||||
.btn-outline-success:hover { background: var(--success); color: #00003d; }
|
||||
.btn-outline-info { color: var(--info); border-color: var(--info); }
|
||||
.btn-outline-info:hover { background: var(--info); color: #fff; }
|
||||
|
||||
@@ -630,8 +630,8 @@ input[type="radio"] {
|
||||
white-space: nowrap;
|
||||
color: #fff;
|
||||
}
|
||||
.badge-success, .badge.bg-success { background: var(--success); color: #fff; }
|
||||
.badge-warning, .badge.bg-warning { background: var(--warning); color: #fff; }
|
||||
.badge-success, .badge.bg-success { background: var(--success); color: #00003d; }
|
||||
.badge-warning, .badge.bg-warning { background: var(--warning); color: #00003d; }
|
||||
.badge-danger, .badge.bg-danger { background: var(--danger); color: #fff; }
|
||||
.badge-info, .badge.bg-info { background: var(--info); color: #fff; }
|
||||
.badge-primary, .badge.bg-primary { background: var(--primary); color: #fff; }
|
||||
@@ -709,7 +709,7 @@ input[type="radio"] {
|
||||
.settings-success,
|
||||
.alert-success {
|
||||
background: var(--success);
|
||||
color: #fff;
|
||||
color: #00003d;
|
||||
border-color: var(--success);
|
||||
}
|
||||
.alert-warning {
|
||||
|
||||
Reference in New Issue
Block a user