From b163fdaa62f7b4a06aa047892b64a5d5b8669400 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Beatrice=20Dellac=C3=A0?= Date: Tue, 24 Feb 2026 10:37:36 +0100 Subject: [PATCH] update styles, v0.1.17 --- package.json | 2 +- src/styles/components.css | 86 +++++++++++++++++++++++++-------------- 2 files changed, 56 insertions(+), 32 deletions(-) diff --git a/package.json b/package.json index 7031734..1b6c097 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@panic/web-ui", - "version": "0.1.16", + "version": "0.1.17", "license": "AGPL-3.0-only", "description": "Core components for panic.haus web applications", "type": "module", diff --git a/src/styles/components.css b/src/styles/components.css index 63ed576..38aaffb 100644 --- a/src/styles/components.css +++ b/src/styles/components.css @@ -35,49 +35,73 @@ .field[type='date']::-webkit-datetime-edit-year-field, .field[type='time']::-webkit-datetime-edit-hour-field, .field[type='time']::-webkit-datetime-edit-minute-field, -.field[type='time']::-webkit-datetime-edit-ampm-field, .field[type='datetime-local']::-webkit-datetime-edit-day-field, .field[type='datetime-local']::-webkit-datetime-edit-month-field, .field[type='datetime-local']::-webkit-datetime-edit-year-field, .field[type='datetime-local']::-webkit-datetime-edit-hour-field, -.field[type='datetime-local']::-webkit-datetime-edit-minute-field, -.field[type='datetime-local']::-webkit-datetime-edit-ampm-field { +.field[type='datetime-local']::-webkit-datetime-edit-minute-field { border-radius: 0.375rem; } -.field[type='date']::-webkit-datetime-edit-day-field:focus, -.field[type='date']::-webkit-datetime-edit-month-field:focus, -.field[type='date']::-webkit-datetime-edit-year-field:focus, -.field[type='time']::-webkit-datetime-edit-hour-field:focus, -.field[type='time']::-webkit-datetime-edit-minute-field:focus, -.field[type='time']::-webkit-datetime-edit-ampm-field:focus, -.field[type='datetime-local']::-webkit-datetime-edit-day-field:focus, -.field[type='datetime-local']::-webkit-datetime-edit-month-field:focus, -.field[type='datetime-local']::-webkit-datetime-edit-year-field:focus, -.field[type='datetime-local']::-webkit-datetime-edit-hour-field:focus, -.field[type='datetime-local']::-webkit-datetime-edit-minute-field:focus, -.field[type='datetime-local']::-webkit-datetime-edit-ampm-field:focus { +.field[type='date']::-webkit-datetime-edit-day-field:focus { border-radius: 0.375rem; background-color: var(--field-selection-bg) !important; color: var(--field-selection-text) !important; -webkit-text-fill-color: var(--field-selection-text) !important; } - -.field[type='date']::-webkit-datetime-edit-day-field::selection, -.field[type='date']::-webkit-datetime-edit-month-field::selection, -.field[type='date']::-webkit-datetime-edit-year-field::selection, -.field[type='time']::-webkit-datetime-edit-hour-field::selection, -.field[type='time']::-webkit-datetime-edit-minute-field::selection, -.field[type='time']::-webkit-datetime-edit-ampm-field::selection, -.field[type='datetime-local']::-webkit-datetime-edit-day-field::selection, -.field[type='datetime-local']::-webkit-datetime-edit-month-field::selection, -.field[type='datetime-local']::-webkit-datetime-edit-year-field::selection, -.field[type='datetime-local']::-webkit-datetime-edit-hour-field::selection, -.field[type='datetime-local']::-webkit-datetime-edit-minute-field::selection, -.field[type='datetime-local']::-webkit-datetime-edit-ampm-field::selection { - background-color: var(--field-selection-bg); - color: var(--field-selection-text); - -webkit-text-fill-color: var(--field-selection-text); +.field[type='date']::-webkit-datetime-edit-month-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='date']::-webkit-datetime-edit-year-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='time']::-webkit-datetime-edit-hour-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='time']::-webkit-datetime-edit-minute-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='datetime-local']::-webkit-datetime-edit-day-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='datetime-local']::-webkit-datetime-edit-month-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='datetime-local']::-webkit-datetime-edit-year-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='datetime-local']::-webkit-datetime-edit-hour-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; +} +.field[type='datetime-local']::-webkit-datetime-edit-minute-field:focus { + border-radius: 0.375rem; + background-color: var(--field-selection-bg) !important; + color: var(--field-selection-text) !important; + -webkit-text-fill-color: var(--field-selection-text) !important; } .field:disabled {