root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(FN-3073): tokenize MissionManager and TaskDetailModal CSS spacing and

Browse Source 
Merges three commits: tokenizes MissionManager CSS spacing and colors to align with the design system, fixes a mobile viewport teardown bug when closing planning mode, and resolves token and focus regressions in the task detail modal. Also adds a new test for the planning mode viewport fix.

Fusion-Task-Id: FN-3073
This commit is contained in:
Fusion
2026-05-04 05:55:15 -07:00
committed by gsxdsm
parent 08d655abc4
commit 78972add1b
1 changed files with 23 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
packages/dashboard/app/components/TaskDetailModal.css
View File

@@ -39,23 +39,23 @@
letter-spacing: 0.5px; letter-spacing: 0.5px;
} }
.badge-triage { .badge-triage {
background: rgba(210, 153, 34, 0.15); background: var(--status-triage-bg);
color: var(--triage); color: var(--triage);
} }
.badge-todo { .badge-todo {
background: rgba(88, 166, 255, 0.15); background: var(--status-todo-bg);
color: var(--todo); color: var(--todo);
} }
.badge-in-progress { .badge-in-progress {
background: rgba(188, 140, 255, 0.15); background: var(--status-in-progress-bg);
color: var(--in-progress); color: var(--in-progress);
} }
.badge-in-review { .badge-in-review {
background: rgba(63, 185, 80, 0.15); background: var(--status-in-review-bg);
color: var(--in-review); color: var(--in-review);
} }
.badge-done { .badge-done {
background: rgba(139, 148, 158, 0.15); background: var(--status-done-bg);
color: var(--done); color: var(--done);
} }
@@ -448,8 +448,8 @@
padding: 0; padding: 0;
border: none; border: none;
border-radius: 50%; border-radius: 50%;
background: rgba(0, 0, 0, 0.6); background: color-mix(in srgb, var(--bg) 65%, var(--text));
color: #fff; color: var(--text);
cursor: pointer; cursor: pointer;
font-size: 12px; font-size: 12px;
line-height: 20px; line-height: 20px;
@@ -561,13 +561,13 @@
.detail-actions-menu-item:hover, .detail-actions-menu-item:hover,
.detail-move-menu-item:hover { .detail-move-menu-item:hover {
background: var(--surface-hover); background: var(--surface-hover, color-mix(in srgb, var(--text) 6%, transparent));
} }
.detail-actions-menu-item:focus, .detail-actions-menu-item:focus,
.detail-move-menu-item:focus { .detail-move-menu-item:focus {
outline: none; outline: none;
background: var(--surface-hover); background: var(--surface-hover, color-mix(in srgb, var(--text) 6%, transparent));
} }
.detail-actions-menu-note { .detail-actions-menu-note {
@@ -617,7 +617,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: rgba(0, 0, 0, 0.7); background: color-mix(in srgb, var(--bg) 70%, transparent);
z-index: 100; z-index: 100;
} }
@@ -843,19 +843,19 @@
/* Semantic status colors for changed-file entries — theme-aware via CSS variables */ /* Semantic status colors for changed-file entries — theme-aware via CSS variables */
.changes-file-status--added { .changes-file-status--added {
color: var(--status-color-added, #3fb950); color: var(--color-success);
} }
.changes-file-status--modified { .changes-file-status--modified {
color: var(--status-color-modified, #58a6ff); color: var(--color-info);
} }
.changes-file-status--deleted { .changes-file-status--deleted {
color: var(--status-color-deleted, #f85149); color: var(--color-error-dark);
} }
.changes-file-status--unknown { .changes-file-status--unknown {
color: var(--status-color-unknown, #8b949e); color: var(--text-muted);
} }
/* Stat summary in changes header */ /* Stat summary in changes header */
@@ -869,11 +869,11 @@
} }
.changes-stat-summary .diff-add { .changes-stat-summary .diff-add {
color: var(--status-color-added, #3fb950); color: var(--color-success);
} }
.changes-stat-summary .diff-del { .changes-stat-summary .diff-del {
color: var(--status-color-deleted, #f85149); color: var(--color-error-dark);
} }
/* Task-specific changes header: stacked title + stats layout */ /* Task-specific changes header: stacked title + stats layout */
@@ -919,7 +919,7 @@
.changes-diff-patch { .changes-diff-patch {
margin: 0; margin: 0;
padding: var(--space-sm) 0; padding: var(--space-sm) 0;
background: rgba(0, 0, 0, 0.14); background: color-mix(in srgb, var(--bg) 86%, var(--text));
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 11px;
line-height: 1.5; line-height: 1.5;
@@ -940,14 +940,14 @@
/* Summary section - styled for done tasks with success accent */ /* Summary section - styled for done tasks with success accent */
.detail-summary { .detail-summary {
background: rgba(63, 185, 80, 0.08); background: color-mix(in srgb, var(--color-success) 8%, transparent);
border: 1px solid rgba(63, 185, 80, 0.25); border: 1px solid color-mix(in srgb, var(--color-success) 25%, transparent);
border-radius: var(--radius-md); border-radius: var(--radius-md);
padding: var(--space-lg); padding: var(--space-lg);
} }
.detail-summary h4 { .detail-summary h4 {
color: var(--color-success, #3fb950); color: var(--color-success);
margin-bottom: var(--space-md); margin-bottom: var(--space-md);
} }
@@ -1248,9 +1248,9 @@
color: var(--text); color: var(--text);
} }
.modal-edit-btn:focus { .modal-edit-btn:focus-visible {
outline: 1px solid var(--todo); outline: none;
outline-offset: 1px; box-shadow: var(--focus-ring-strong);
} }
.modal-edit-form { .modal-edit-form {