fix(microsd): match the SD Card upload panel to the dark property dialog

The panel was styled with light-theme CSS-var fallbacks that render wrong on
the editor's dark (#2d2d2d) property dialog:
- "Add files" button used `var(--surface, #f6f6f6)` + light border, so it
  rendered a washed-out light-gray box that looked broken. Restyle it as a
  primary action like `.rotate-button` (solid #007acc, white text, hover lift).
- Section divider and secondary text used light fallbacks (#e2e2e2 / #777);
  switch to the dialog's dark values (#444 border, #aaa text).

Cosmetic only.
This commit is contained in:
David Montero 2026-06-11 05:19:40 +02:00
parent 2408ccde54
commit 878e84e98a
1 changed files with 13 additions and 8 deletions

View File

@ -331,7 +331,7 @@
/* ── microSD "SD Card" upload panel ─────────────────────────────────────── */
.sd-card-section {
border-top: 1px solid var(--border-color, #e2e2e2);
border-top: 1px solid #444;
padding: 8px 10px;
display: flex;
flex-direction: column;
@ -356,7 +356,7 @@
}
.sd-card-hint {
font-size: 11px;
color: var(--text-secondary, #777);
color: #aaa;
line-height: 1.3;
}
.sd-card-file {
@ -373,7 +373,7 @@
}
.sd-card-file-size {
flex: 0 0 auto;
color: var(--text-secondary, #777);
color: #aaa;
font-variant-numeric: tabular-nums;
}
.sd-card-file-remove {
@ -399,17 +399,22 @@
}
.sd-card-add {
font-size: 12px;
padding: 4px 10px;
border: 1px solid var(--border-color, #ccc);
font-weight: 500;
padding: 5px 12px;
border: none;
border-radius: 4px;
background: var(--surface, #f6f6f6);
background-color: #007acc;
color: #fff;
cursor: pointer;
transition: all 0.2s;
}
.sd-card-add:hover {
background: var(--surface-hover, #ececec);
background-color: #005a9e;
transform: translateY(-1px);
box-shadow: 0 2px 8px rgba(0, 122, 204, 0.3);
}
.sd-card-total {
font-size: 11px;
color: var(--text-secondary, #777);
color: #aaa;
font-variant-numeric: tabular-nums;
}