Global CSS API: Fields - Date
The following CSS custom properties are used for the date based field UI.
| Property | Description | Default |
|---|---|---|
| --gf-field-date-ctrl-padding-x-end | Horizontal end (right) padding for icons. | calc(var(--gf-ctrl-padding-x) + var(--gf-icon-font-size) + 4px) |
| --gf-field-date-icon-color | Icon color. | var(--gf-ctrl-icon-color) |
| --gf-field-date-icon-color-hover | Icon color on hover. | var(--gf-ctrl-icon-color-hover) |
| --gf-field-date-icon-transition | Icon transition. | var(--gf-ctrl-transition) |
| --gf-field-date-custom-icon-max-height | Max height for custom date icons. | 16px |
| --gf-field-date-custom-icon-max-width | Max width for custom date icons. | 16px |
| --gf-field-date-custom-icon-opacity | Opacity for custom date icons. | 0.6 |
| --gf-field-date-custom-icon-opacity-hover | Opacity for custom date icons on hover. | 1 |