carlosarias/seedproject-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

admin: fix white-on-white select dropdown in dark mode

Browse source 
Native <option> popups used the browser default (white) background; in dark
mode the var(--ink) text rendered near-white on it. Give the select a themed
background and style option explicitly. Fixes the Web Designer Page picker and
the project editor status dropdown.
This commit is contained in:
Carlos Arias 2026-07-24 02:34:04 +00:00
parent 497f55364b
commit a906ef026f
2 changed files with 4 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/src/pages/admin/designer.astro
View file

@ -78,9 +78,10 @@ const PAGES = [
textarea { width:100%; border:1px solid var(--rule); background:transparent; border-radius:2px; textarea { width:100%; border:1px solid var(--rule); background:transparent; border-radius:2px;
padding:.6rem .7rem; font-size:.9rem; color:var(--ink); font-family:var(--sans); line-height:1.55; resize:vertical; } padding:.6rem .7rem; font-size:.9rem; color:var(--ink); font-family:var(--sans); line-height:1.55; resize:vertical; }
textarea:focus { outline:none; border-color:var(--seal); } textarea:focus { outline:none; border-color:var(--seal); }
.sel select { width:100%; border:0; border-bottom:1px solid var(--rule); background:transparent; .sel select { width:100%; border:0; border-bottom:1px solid var(--rule); background:var(--paper);
padding:.5rem 0; font-size:.95rem; color:var(--ink); font-family:var(--sans); } padding:.5rem 0; font-size:.95rem; color:var(--ink); font-family:var(--sans); }
.sel select:focus { outline:none; border-bottom-color:var(--seal); } .sel select:focus { outline:none; border-bottom-color:var(--seal); }
.sel select option { background:var(--paper); color:var(--ink); }
.slug { display:flex; align-items:baseline; gap:.15rem; border-bottom:1px solid var(--rule); } .slug { display:flex; align-items:baseline; gap:.15rem; border-bottom:1px solid var(--rule); }
.slug span { color:var(--ink4); font-family:var(--mono); } .slug span { color:var(--ink4); font-family:var(--mono); }
.slug input { border:0; } .slug input { border:0; }

3
app/src/pages/admin/projects/edit.astro
View file

@ -102,9 +102,10 @@ import AdminLayout from "../../../layouts/AdminLayout.astro";
padding:.6rem .7rem; font-size:.9rem; color:var(--ink); font-family:var(--sans); line-height:1.55; resize:vertical; } padding:.6rem .7rem; font-size:.9rem; color:var(--ink); font-family:var(--sans); line-height:1.55; resize:vertical; }
textarea:focus { outline:none; border-color:var(--seal); } textarea:focus { outline:none; border-color:var(--seal); }
textarea.mono { font-family:var(--mono); font-size:.82rem; } textarea.mono { font-family:var(--mono); font-size:.82rem; }
.sel select { width:100%; border:0; border-bottom:1px solid var(--rule); background:transparent; .sel select { width:100%; border:0; border-bottom:1px solid var(--rule); background:var(--paper);
padding:.5rem 0; font-size:.95rem; color:var(--ink); font-family:var(--sans); } padding:.5rem 0; font-size:.95rem; color:var(--ink); font-family:var(--sans); }
.sel select:focus { outline:none; border-bottom-color:var(--seal); } .sel select:focus { outline:none; border-bottom-color:var(--seal); }
.sel select option { background:var(--paper); color:var(--ink); }
.btn.sm { padding:.35rem .7rem; font-size:.7rem; } .btn.sm { padding:.35rem .7rem; font-size:.7rem; }
.rows { display:flex; flex-direction:column; gap:.6rem; } .rows { display:flex; flex-direction:column; gap:.6rem; }
.row { display:flex; gap:.6rem; align-items:center; } .row { display:flex; gap:.6rem; align-items:center; }