boha_admin/app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 26 Wiki Activity

fix(ui): add admin-btn-danger variant so category delete confirm is styled

Browse Source 
admin-btn-danger was referenced but never defined, so the 'Opravdu smazat' confirm rendered as a plain button. Define a solid danger button (uses --danger), matching the primary button's structure; the per-row delete trigger stays an outline via plan.css. (Includes the transparent-border button refinement so variants don't layout-shift.)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
BOHA
2026-06-06 01:15:12 +02:00
parent 4d47897e27
commit fce27633a9
2 changed files with 28 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/admin/buttons.css
View File

@@ -8,7 +8,10 @@
justify-content: center;
gap: 0.5rem;
padding: 8px 14px;
border: none;
/* 1px transparent border on ALL buttons so switching between primary
and secondary doesn't cause a 1px layout shift (the border is always
1px — only the colour changes). */
border: 1px solid transparent;
border-radius: var(--border-radius-sm);
font-size: 13px;
font-weight: 550;
@@ -38,11 +41,13 @@
.admin-btn-primary {
background: var(--accent-color);
border-color: var(--accent-color);
color: #fff;
}
.admin-btn-primary:hover:not(:disabled) {
background: var(--accent-hover);
border-color: var(--accent-hover);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(214, 48, 49, 0.3);
}
@@ -75,6 +80,24 @@
color: var(--text-primary);
}
.admin-btn-danger {
background: var(--danger);
border-color: var(--danger);
color: #fff;
}
.admin-btn-danger:hover:not(:disabled) {
background: color-mix(in srgb, var(--danger) 88%, #000);
border-color: color-mix(in srgb, var(--danger) 88%, #000);
transform: translateY(-1px);
box-shadow: 0 4px 12px color-mix(in srgb, var(--danger) 30%, transparent);
}
.admin-btn-danger .admin-spinner {
border-color: rgba(255, 255, 255, 0.3);
border-top-color: #fff;
}
.admin-btn-icon {
display: inline-flex;
align-items: center;

7
src/admin/plan.css
View File

@@ -1015,9 +1015,10 @@
button it turns into; keep it an outline until the user commits. */
.plan-cat-delete.admin-btn-danger {
background: transparent;
color: #dc2626;
border: 1px solid color-mix(in srgb, #dc2626 40%, transparent);
color: var(--danger);
border: 1px solid color-mix(in srgb, var(--danger) 40%, transparent);
}
.plan-cat-delete.admin-btn-danger:hover:not(:disabled) {
background: color-mix(in srgb, #dc2626 12%, transparent);
background: color-mix(in srgb, var(--danger) 12%, transparent);
color: var(--danger);
}