💄 Adding the style of the primevue select component

This commit is contained in:
Paul Valerie GOMA 2025-07-23 15:51:27 +02:00
parent fba4e36538
commit 4332b1b132

View File

@ -0,0 +1,47 @@
:root{
--p-select-background: var(--input-background);
--p-select-disabled-background: var(--input-disabled-background);
--p-select-border-color: var(--input-border-color);
--p-select-hover-border-color: var(--input-border-color);
--p-select-color: var(--input-color);
--p-select-disabled-color: var(--input-disabled-color);
--p-select-placeholder-color: var(--input-color);
--p-select-padding-x: var(--input-padding-x);
--p-select-padding-y: var(--input-padding-y);
--p-select-border-radius: var(--input-border-raduis);
--p-select-dropdown-width: 2rem;
--p-select-dropdown-color: var(--input-color);
--p-select-overlay-background: var(--input-background);
--p-select-overlay-border-color: var(--input-border-color);
--p-select-overlay-border-radius: 0px 0px 0.25rem 0.25rem;
--p-select-overlay-color: var(--input-color);
--p-select-overlay-shadow: var(--shadow);
--p-select-list-padding: 0.25rem;
--p-select-list-gap: 0.125rem;
--p-select-list-header-padding: 0.5rem 1rem;
/* options */
--p-select-option-selected-background: var(--background-active-blue-france);
--p-select-option-selected-focus-background: var(--background-active-blue-france);
--p-select-option-color: var(--input-color);
--p-select-option-focus-color: var(--input-color);
--p-select-option-selected-color: var(--text-inverted-blue-france);
--p-select-option-padding: 0.5rem 0.75rem;
--p-select-option-border-radius: 0px;
--p-select-option-group-background: var(--input-background);
--p-select-option-group-color: var(--input-color);
--p-select-option-group-font-weight: var(--text-body-MD-standard-text-Regular-weight);
--p-select-option-group-padding: 0.25rem;
--p-select-clear-icon-color: var(--input-color);
--p-select-checkmark-color: var(--input-color);
--p-select-checkmark-gutter-start: 0.125rem;
--p-select-checkmark-gutter-end: 0.125rem;
--p-select-empty-message-padding: 0.25rem;
/* focus */
--p-select-focus-border-color: var(--input-border-color);
--p-select-focus-ring-width: var(--focus-width);
--p-select-focus-ring-style: var(--focus-style);
--p-select-focus-ring-color: var(--focus-color);
--p-select-focus-ring-offset: var(--focus-offset);
--p-select-option-focus-background: var(--background-transparent-active);
--p-select-option-selected-focus-color: var(--text-inverted-blue-france);
}