Datepicker and ThemeRoller - additional rules for disabled/unselectable items
Hi all,
Thought I'd share some styles additional to ThemeRoller's for use with
datepicker.
When the month next/prev buttons are disabled (because of the date
range), I didn't like that a label with '<Prev' or 'Next>' was
displaying. I now use this rule to hide them:
.ui-datepicker-next label, .ui-datepicker-prev label { display:
none; }
You could style them differently - e.g. visible but disabled - by
using attributes from the ".ui-datepicker-next a, .ui-datepicker-prev
a" rule.
The individual date cells which were disabled (again, due to date
range) didn't line up for me, so I use the following rule:
table.ui-datepicker td.ui-datepicker-unselectable {
padding: .1em .3em .1em 0;
color: #555555;
border: 1px solid #ffffff;
}
Hope this helps someone,
--rob