The picker uses the following css classes to style the picker.
The outer element for the widget.
The element for the calendar view header, next and previous actions.
The element for the action to change the calendar view. E.g. month -> year.
Applied to the widget element when the side by side option is in use.
The element for the action to change the calendar view, e.g. August -> July
The element for the action to change the calendar view, e.g. August -> September
Applied to any action that would violate any restriction options. ALso applied to an input field if the disabled function is called.
Applied to any date that is less than requested view, e.g. the last day of the previous month.
Applied to any date that is greater than of requested view, e.g. the last day of the previous month.
Applied to any date that is currently selected.
The outer most element for the calendar view.
The outer most element for the decades view.
Applied to elements within the decades container, e.g. 2020, 2030
The outer most element for the years view.
Applied to elements within the years container, e.g. 2021, 2021
The outer most element for the month view.
Applied to elements within the month container, e.g. January, February
The outer most element for the calendar view.
Applied to elements within the day container, e.g. 1, 2..31
If display.calendarWeeks is enabled, a column displaying the week of year is shown. This class is applied to each cell in that column.
Applied to the first row of the calendar view, e.g. Sunday, Monday
Applied to the current date on the calendar view.
Applied to the locale's weekend dates on the calendar view, e.g. Sunday, Saturday
The outer most element for all time related elements.
Applied the separator columns between time elements, e.g. hour *:* minute *:* second
The outer most element for the clock view.
The outer most element for the hours selection view.
The outer most element for the minutes selection view.
The outer most element for the seconds selection view.
Applied to each element in the hours selection view.
Applied to each element in the minutes selection view.
Applied to each element in the seconds selection view.
Applied the element of the current view mode, e.g. calendar or clock.
Applied to the currently showing view mode during a transition between calendar and clock views
Applied to the currently hidden view mode.
Applied to the widget when the option display.inline is enabled.
Applied to the widget when the option display.theme is light.
Applied to the widget when the option display.theme is dark.
Used for detecting if the system color preference is dark mode.