| Issue 299: | Day numbers not visible in certain jQuery UI themes | |
| 2 people starred this issue and may be notified of changes. | Back to list |
When I set theme=true and am using the jQuery 'start' theme from
themeroller, the day numbers are not visible in the month view. This is
because the 'start' theme has color: #ffffff, as you can see here:
.ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid
#77d5f7; background: #0078ae url(images/ui-bg_glass_45_0078ae_1x400.png)
50% 50% repeat-x; font-weight: normal; color: #ffffff; outline: none; }
My solution is to just override this css for my calendar only:
.calendar .ui-state-default, .ui-widget-content .ui-state-default { color:
#222222; }
However, I'm wondering if perhaps a different UI element should be used for
the day numbers since there is no guarantee that this one will be visible
on a white background.
Feb 5, 2010
hmm yeah, this is a tough one. its because fullcalendar is using the ui-state-default classes for the day cells, but removing the backgrounds. gotta think more about a universal solution
Oct 7, 2010
i think the best solution for this would be to add a text:inherit...
.fc-content .fc-not-today {
background: none;
color: inherit
}
thanks for bring this problem to my attention. will research solutions more...
Summary:
Day numbers not visible in certain jQuery UI themes
Status: Accepted
Feb 26, 2011
What is the recommended approach to target IE7 and earlier which do not support inherit ?
Mar 20, 2011
this is fixed in 1.5 (just released). see blog post... http://blog.arshaw.com/1/post/2011/03/fullcalendar-15-released.html
Status:
Fixed
Aug 13, 2013
(No comment was entered for this change.)
Status:
Implemented
Aug 13, 2013
(No comment was entered for this change.)
Status:
Released
|
|
| ► Sign in to add a comment |
There are two issues with the CSS posted above: 1. Doesn't specify .calendar on the second selector, so ".ui-widget-content .ui- state-default" was getting changed across all jquery UI components. 2. The weekday names in the column headers were getting changed to #222, but they look better as the default #fff. Added tbody to only target the day numbers. Here is the revised version: /* Override 'start' theme color so that month view day numbers are * visible, while leaving weekday headers alone */ .calendar tbody .ui-state-default, .calendar tbody .ui-widget-content .ui-state-default { color: #222222; } I wonder how many other UI themes might not behave properly with fullcalendar.