fix: icono de calendario invisible en campos de fecha con tema oscuro

Reportado en produccion: el icono nativo del input type="date" se
dibujaba negro sobre fondo oscuro. Se agrega color-scheme: dark para
esos inputs cuando data-theme="dark", asi el navegador elige un icono
claro automaticamente. Verificado en dev con Playwright.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Milton Gonzalez
2026-09-14 08:51:40 -05:00
parent d7c7d17ead
commit d3ef86c1db
5 changed files with 14 additions and 3 deletions
+5
View File
@@ -95,6 +95,11 @@ button { font-family: inherit; }
}
.input:focus, .textarea:focus, select.input:focus { outline: 2px solid rgb(var(--accent)); outline-offset: -1px; }
.input:disabled, .textarea:disabled { opacity: .6; }
/* El icono nativo de fecha/hora se dibuja segun color-scheme; sin esto en tema oscuro sale negro
sobre fondo oscuro (invisible). Regla dura: cualquier input type=date/time/datetime-local va aqui. */
:root[data-theme="dark"] input[type="date"],
:root[data-theme="dark"] input[type="time"],
:root[data-theme="dark"] input[type="datetime-local"] { color-scheme: dark; }
.textarea { min-height: 70px; resize: vertical; }
.field-row { display: flex; gap: 12px; flex-wrap: wrap; }
.field-row > .field { flex: 1; min-width: 180px; }