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
+6
View File
@@ -1,5 +1,11 @@
# Changelog - project.linkedcorp.net # Changelog - project.linkedcorp.net
## [1.12.2] - 2026-09-14
### Fixed
- El icono nativo de calendario en campos `type="date"`/`time`/`datetime-local` salía negro sobre
fondo oscuro en tema oscuro (invisible). Se agrega `color-scheme: dark` a esos inputs cuando
`data-theme="dark"`, para que el navegador dibuje el icono en un tono claro.
## [1.12.1] - 2026-09-11 ## [1.12.1] - 2026-09-11
### Added ### Added
- Tareas recurrentes: campo opcional "Hasta" (fecha de fin). Vacío = se repite sin fin (como - Tareas recurrentes: campo opcional "Hasta" (fecha de fin). Vacío = se repite sin fin (como
+1 -1
View File
@@ -1 +1 @@
1.12.1 1.12.2
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "project-linkedcorp-backend", "name": "project-linkedcorp-backend",
"version": "1.12.1", "version": "1.12.2",
"private": true, "private": true,
"type": "module", "type": "module",
"main": "src/server.js", "main": "src/server.js",
+1 -1
View File
@@ -1,7 +1,7 @@
{ {
"name": "project-linkedcorp-frontend", "name": "project-linkedcorp-frontend",
"private": true, "private": true,
"version": "1.12.1", "version": "1.12.2",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
+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:focus, .textarea:focus, select.input:focus { outline: 2px solid rgb(var(--accent)); outline-offset: -1px; }
.input:disabled, .textarea:disabled { opacity: .6; } .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; } .textarea { min-height: 70px; resize: vertical; }
.field-row { display: flex; gap: 12px; flex-wrap: wrap; } .field-row { display: flex; gap: 12px; flex-wrap: wrap; }
.field-row > .field { flex: 1; min-width: 180px; } .field-row > .field { flex: 1; min-width: 180px; }