Theming DateBox - Overview
An overall theme of DateBox is easy - just specify it like any other element. For jQueryMobile DateBox will do it’s best to inherit it’s theme from it’s parent(s) if you don’t specify, finally falling back on ‘a’.
For bootstrap and jQueryUI things work a bit differently - you’ll need to specify themes directly for those elements you wish to change.
An important thing to note is that the theme “names” are a part of a class name. For instance, in bootstrap mode, most themes are set to “primary” - for buttons, this results in the class “btn-primary” being added. There is no limitation to the string length, so you could certainly add additional arbitrary classes. In the example below, the “themeDate” option has been set to “warning annoying-blink”.
There are 3 really, really awful themes included in the jQueryUI css file to show how to be specific enough for your theme to apply.
The results from this are pretty hideous - but, DateBox provides a method in which to theme individual elements of each control, for the look you want.
These themes tend to appear, based on configuration in all of the display modes.
- “themeClearButton” : Theme for clear input button
- “themeTodayButton” : Theme for “Jump to Today” button
- “themeTomorrowButton” : Theme for “Jump to Tomorrow” button
- “themeCancelButton” : Theme for cancel button
- “themeSetButton” : Theme for set button
CalBox has the largest number of theme configuration options, as the date limiting options are most useful with this display mode.
- “themeDate” : Theme for otherwise un-specified date buttons
- “themeDateToday” : Theme for “today”
- “themeDatePick” : Theme for chosen date (used last after other options fail)
- “themeDayHigh” : Theme for highlighted DAYS
- “themeDateHigh” : Theme for highlighted DATES
- “themeDateHighAlt” : Theme for highlighted ALTERNATE DATES
- “themeDateHighRec” : Theme for highlighted RECURRING DATES
DateBox, TimeBox, and DurationBox have a small number of theme options.
FlipBox, TimeFlipBox and DurationFlipBox likewise have a small number of theme options.
SlideBox too has a small number of theme options.