diff options
Diffstat (limited to 'js/dojo-1.7.2/dijit/themes/claro/Calendar.css')
| -rw-r--r-- | js/dojo-1.7.2/dijit/themes/claro/Calendar.css | 284 |
1 files changed, 284 insertions, 0 deletions
diff --git a/js/dojo-1.7.2/dijit/themes/claro/Calendar.css b/js/dojo-1.7.2/dijit/themes/claro/Calendar.css new file mode 100644 index 0000000..a0f9597 --- /dev/null +++ b/js/dojo-1.7.2/dijit/themes/claro/Calendar.css @@ -0,0 +1,284 @@ +/* Calendar + * + * Styling Calendar mainly includes: + * + * 1. Calendar container + * .dijitCalendar - main container + * .dijitCalendarHover / .dijitCalendarActive - states e.g. hover,active + * + * 2. Month + * .dijitCalendarMonthContainer + * .dijitCalendarMonthLabel + * .dijitCalendarDecrease / .dijitCalendarDecrease - icons for switching to previous/next month + * .dijitCalendarArrowActive .dijitCalendarDecrease - states e.g. hover,active + * + * 3. Date + * .dijitCalendarDayLabelTemplate - week day column header e.g. S M T W T F S + * .dijitCalendarDateTemplate - date label wrapper + * .dijitCalendarPreviousMonth .dijitCalendarDateLabel - special labels for previous or next month + * .dijitCalendarSelectedDate .dijitCalendarDateLabel - styles for selected date + * .dijitCalendarDisabledDate .dijitCalendarDateLabel - styles for disabled date + * .dijitCalendarActiveDate .dijitCalendarDateLabel - states e.g. hover,active + * + * 4. Year + * .dijitCalendarYearContainer + * .dijitCalendarYearLabel + * .dijitCalendarPreviousYear /.dijitCalendarNextYear + * .dijitCalendarNextYearHover / .dijitCalendarPreviousYearHover - states e.g. hover,active + * + * 5. Dropdown Month Menu + * .dijitCalendarMonthMenu - menu container + * .dijitCalendarMonthMenu .dijitCalendarMonthLabel - month label in menu item + * .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover - menu item hover state + */ +.claro .dijitCalendar { + border: solid 1px #b5bcc7; + background-color: #cfe5fa; + background-image: url("images/calendarContainerImages.png"); + background-position: 0 -448px; + background-repeat: repeat-x; + text-align: center; + padding: 6px 5px 3px 5px; + -moz-border-radius: 4px; + border-radius: 4px; + border-collapse: separate; +} +.dj_ie6 .claro .dijitCalendar { + background-image: none; +} +.claro .dijitCalendar img { + border: none; +} +.claro .dijitCalendarHover, .claro .dijitCalendar:hover, .claro .dijitCalendarActive { + /* treat dijitCalenderActive like hover since there's + * no concept of clicking a Calendar as a whole (although you can click things inside the calendar) + */ + + background-color: #abd6ff; + border: solid 1px #759dc0; +} +.claro .dijitCalendarMonthContainer th { + text-align: center; + padding-bottom: 4px; + vertical-align: middle; +} +.claro .dijitCalendarMonthLabel { + color: #000000; + font-size: 1.091em; + padding: 0 4px; +} +/* next/previous month arrows */ +.claro .dijitCalendarIncrementControl { + width: 18px; + height: 16px; + background-image: url("images/calendarArrows.png"); + background-repeat: no-repeat; +} +.dj_ie6 .claro .dijitCalendarIncrementControl { + background-image: url("images/calendarArrows8bit.png"); +} +.claro .dijitCalendarIncrease { + background-position: -18px 0; +} +.claro .dijitCalendarArrowHover .dijitCalendarDecrease, .claro .dijitCalendarArrow:hover .dijitCalendarDecrease { + background-position: -36px 0; +} +.claro .dijitCalendarArrowHover .dijitCalendarIncrease, .claro .dijitCalendarArrow:hover .dijitCalendarIncrease { + background-position: -55px 0; +} +.claro .dijitCalendarArrowActive .dijitCalendarDecrease, .claro .dijitCalendarArrow:active .dijitCalendarDecrease { + background-position: -72px 0; +} +.claro .dijitCalendarArrowActive .dijitCalendarIncrease, .claro .dijitCalendarArrow:active .dijitCalendarIncrease { + background-position: -91px 0; +} +.claro .dijitA11ySideArrow { + /* text +/- labels instead of arrow icons, for high contrast mode */ + + display: none; +} +.claro .dijitCalendarDayLabelTemplate { + padding-bottom: 0; + text-align: center; + border-bottom: 1px solid #b5bcc7; + padding: 0 3px 2px; +} +.claro .dijitCalendarDayLabel { + padding: 0 4px 0 4px; + font-weight: bold; + font-size: 0.909em; + text-align: center; + color: #000000; +} +.claro .dijitCalendarDateTemplate { + text-align: center; + background-color: #ffffff; + background-image: url("images/calendarContainerImages.png"); + background-position: 0 0; + background-repeat: repeat-x; + border-bottom: 1px solid #d3d3d3; + padding-top: 0; + font-size: 0.909em; + font-family: Arial; + font-weight: bold; + letter-spacing: .05em; + text-align: center; + color: #000000; +} +.dj_ie6 .claro .dijitCalendarDateTemplate { + background-image: none; +} +.claro .dijitCalendarPreviousMonth, .claro .dijitCalendarNextMonth { + background-color: #e5f2fe; + background-image: none; + border-bottom: solid 1px #d3d3d3; + /* todo: redundant with above .dijitCalendarDateTemplate rule */ +} +.claro .dijitCalendarDateTemplate .dijitCalendarDateLabel { + text-decoration: none; + display: block; + padding: 3px 5px 3px 4px; + border: solid 1px #ffffff; + /* intentionally matches background-color, no visible border until hover/selection */ + + background-color: rgba(171, 212, 251, 0); + /* transparent causes black-flash animation problem on webkit */ + + -webkit-transition-property: background-color, border; + -moz-transition-property: background-color, border; + transition-property: background-color, border; + -webkit-transition-duration: 0.35s; + -moz-transition-duration: 0.35s; + transition-duration: 0.35s; +} +.claro .dijitCalendarPreviousMonth .dijitCalendarDateLabel, .claro .dijitCalendarNextMonth .dijitCalendarDateLabel { + color: #759dc0; + border-color: #e5f2fe; + /* intentionally matches background-color, no visible border until hover/selection */ + +} +.claro .dijitCalendarYearContainer { + vertical-align: middle; +} +.claro .dijitCalendarYearControl { + padding: 1px 2px 2px 2px; +} +.claro .dijitCalendarYearLabel { + padding: 2px 0 0 0; + margin: 0; + font-size: 1.17em; +} +.claro .dijitCalendarYearLabel span { + /* trying to center next/current/previous year vertically, doesn't work on IE6/7 though */ + + vertical-align: middle; +} +.claro .dijitCalendarSelectedYear { + padding: 0 3px; +} +.claro .dijitCalendarNextYear, .claro .dijitCalendarPreviousYear { + padding: 1px 6px 1px 6px; + font-size: 0.909em; +} +.claro .dijitCalendarSelectedYear { + font-size: 1.091em; + color: #000000; +} +/* End Normal Calendar Style */ +/* Hovered Calendar Style */ +.claro .dijitCalendarHoveredDate .dijitCalendarDateLabel, .claro .dijitCalendarEnabledDate:hover .dijitCalendarDateLabel { + background-color: #abd6ff; + border: solid 1px #759dc0; + color: #000000; + -webkit-transition-duration: 0.2s; + -moz-transition-duration: 0.2s; + transition-duration: 0.2s; +} +.claro .dijitCalendarNextYearHover, +.claro .dijitCalendarNextYear:hover, +.claro .dijitCalendarPreviousYearHover, +.claro .dijitCalendarPreviousYear:hover { + color: #000000; + border: solid 1px #ffffff; + padding: 0 5px 0 5px; + /* reduced by 1 to make room for border */ + + background-color: #e5f2fe; +} +/* End Hovered Calendar Style */ +/* Active Calendar Style */ +.claro .dijitCalendarNextYearActive, .claro .dijitCalendarNextYear:active.claro .dijitCalendarPreviousYearActive, .claro .dijitCalendarPreviousYear:active { + border: solid 1px #759dc0; + padding: 0 5px 0 5px; + /* reduced by 1 to make room for border */ + + background-color: #7dbdfa; +} +.claro .dijitCalendarActiveDate .dijitCalendarDateLabel, .claro .dijitCalendarEnabledDate:active .dijitCalendarDateLabel { + background-image: url("images/calendarContainerImages.png"); + background-position: 0 -300px; + background-color: #7dbdfa; + border: solid 1px #ffffff; + -webkit-transition-duration: 0.1s; + -moz-transition-duration: 0.1s; + transition-duration: 0.1s; +} +.dj_ie6 .claro .dijitCalendarActiveDate .dijitCalendarDateLabel { + background-image: none; +} +/* End Active Calendar Style */ +/* Selected Calendar Style */ +.claro .dijitCalendarSelectedDate .dijitCalendarDateLabel { + color: #000000; + background-color: #abd6ff; + border-color: #759dc0; +} +/* End Selected Calendar Style */ +/* Disabled Calendar Style*/ +.claro .dijitCalendarDisabledDate .dijitCalendarDateLabel { + color: #818181; + text-decoration: line-through; +} +/* End Disabled Calendar Style */ +/* Styling for month DropDownButton */ +.claro .dijitCalendar .dijitDropDownButton { + margin: 0; +} +.claro .dijitCalendar .dijitButtonText { + padding: 1px 0 3px; + margin-right: -4px; +} +.claro .dijitCalendar .dijitDropDownButton .dijitButtonNode { + background-color: transparent; + background-image: none; + padding: 0 3px 0 2px; + border: solid 1px #b5bcc7; + -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); + -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); + box-shadow: 0 0 0 rgba(0, 0, 0, 0); +} +.claro .dijitCalendar .dijitDropDownButtonHover .dijitButtonNode, .claro .dijitCalendar .dijitDropDownButton:hover .dijitButtonNode { + background-color: #e5f2fe; + border: solid 1px #ffffff; +} +/* Styling for month drop down list */ +.claro .dijitCalendarMonthMenu { + border-color: #759dc0; + background-color: #ffffff; + text-align: center; + background-image: none; +} +.claro .dijitCalendarMonthMenu .dijitCalendarMonthLabel { + border-top: solid 1px #ffffff; + /* intentionally invisible until hover */ + + border-bottom: solid 1px #ffffff; + padding: 2px 0; +} +.claro .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover, .claro .dijitCalendarMonthMenu .dijitCalendarMonthLabel:hover { + background-color: #abd6ff; + border-color: #759dc0; + border-width: 1px 0; + background-image: url("images/commonHighlight.png"); + background-repeat: repeat-x; +} |