]> git.wh0rd.org - tt-rss.git/blame - lib/dijit/themes/claro/Calendar.css
update dojo to 1.7.3
[tt-rss.git] / lib / dijit / themes / claro / Calendar.css
CommitLineData
81bea17a
AD
1/* Calendar
2 *
3 * Styling Calendar mainly includes:
4 *
5 * 1. Calendar container
6 * .dijitCalendar - main container
7 * .dijitCalendarHover / .dijitCalendarActive - states e.g. hover,active
8 *
9 * 2. Month
10 * .dijitCalendarMonthContainer
11 * .dijitCalendarMonthLabel
12 * .dijitCalendarDecrease / .dijitCalendarDecrease - icons for switching to previous/next month
13 * .dijitCalendarArrowActive .dijitCalendarDecrease - states e.g. hover,active
14 *
15 * 3. Date
16 * .dijitCalendarDayLabelTemplate - week day column header e.g. S M T W T F S
17 * .dijitCalendarDateTemplate - date label wrapper
18 * .dijitCalendarPreviousMonth .dijitCalendarDateLabel - special labels for previous or next month
19 * .dijitCalendarSelectedDate .dijitCalendarDateLabel - styles for selected date
20 * .dijitCalendarDisabledDate .dijitCalendarDateLabel - styles for disabled date
21 * .dijitCalendarActiveDate .dijitCalendarDateLabel - states e.g. hover,active
22 *
23 * 4. Year
24 * .dijitCalendarYearContainer
25 * .dijitCalendarYearLabel
26 * .dijitCalendarPreviousYear /.dijitCalendarNextYear
27 * .dijitCalendarNextYearHover / .dijitCalendarPreviousYearHover - states e.g. hover,active
28 *
29 * 5. Dropdown Month Menu
30 * .dijitCalendarMonthMenu - menu container
31 * .dijitCalendarMonthMenu .dijitCalendarMonthLabel - month label in menu item
32 * .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover - menu item hover state
33 */
2f01fe57 34.claro .dijitCalendar {
81bea17a
AD
35 border: solid 1px #b5bcc7;
36 background-color: #cfe5fa;
37 background-image: url("images/calendarContainerImages.png");
38 background-position: 0 -448px;
39 background-repeat: repeat-x;
40 text-align: center;
41 padding: 6px 5px 3px 5px;
42 -moz-border-radius: 4px;
43 border-radius: 4px;
1354d172 44 border-collapse: separate;
2f01fe57
AD
45}
46.dj_ie6 .claro .dijitCalendar {
81bea17a 47 background-image: none;
2f01fe57
AD
48}
49.claro .dijitCalendar img {
81bea17a 50 border: none;
2f01fe57 51}
1354d172 52.claro .dijitCalendarHover, .claro .dijitCalendar:hover, .claro .dijitCalendarActive {
81bea17a
AD
53 /* treat dijitCalenderActive like hover since there's
54 * no concept of clicking a Calendar as a whole (although you can click things inside the calendar)
55 */
56
57 background-color: #abd6ff;
1354d172 58 border: solid 1px #759dc0;
2f01fe57
AD
59}
60.claro .dijitCalendarMonthContainer th {
81bea17a
AD
61 text-align: center;
62 padding-bottom: 4px;
63 vertical-align: middle;
2f01fe57
AD
64}
65.claro .dijitCalendarMonthLabel {
81bea17a
AD
66 color: #000000;
67 font-size: 1.091em;
68 padding: 0 4px;
2f01fe57 69}
81bea17a 70/* next/previous month arrows */
2f01fe57 71.claro .dijitCalendarIncrementControl {
81bea17a
AD
72 width: 18px;
73 height: 16px;
74 background-image: url("images/calendarArrows.png");
75 background-repeat: no-repeat;
2f01fe57
AD
76}
77.dj_ie6 .claro .dijitCalendarIncrementControl {
81bea17a 78 background-image: url("images/calendarArrows8bit.png");
2f01fe57
AD
79}
80.claro .dijitCalendarIncrease {
81bea17a 81 background-position: -18px 0;
2f01fe57 82}
1354d172 83.claro .dijitCalendarArrowHover .dijitCalendarDecrease, .claro .dijitCalendarArrow:hover .dijitCalendarDecrease {
81bea17a 84 background-position: -36px 0;
2f01fe57 85}
1354d172 86.claro .dijitCalendarArrowHover .dijitCalendarIncrease, .claro .dijitCalendarArrow:hover .dijitCalendarIncrease {
81bea17a 87 background-position: -55px 0;
2f01fe57 88}
1354d172 89.claro .dijitCalendarArrowActive .dijitCalendarDecrease, .claro .dijitCalendarArrow:active .dijitCalendarDecrease {
81bea17a 90 background-position: -72px 0;
2f01fe57 91}
1354d172 92.claro .dijitCalendarArrowActive .dijitCalendarIncrease, .claro .dijitCalendarArrow:active .dijitCalendarIncrease {
81bea17a 93 background-position: -91px 0;
2f01fe57
AD
94}
95.claro .dijitA11ySideArrow {
81bea17a
AD
96 /* text +/- labels instead of arrow icons, for high contrast mode */
97
98 display: none;
2f01fe57 99}
2f01fe57 100.claro .dijitCalendarDayLabelTemplate {
81bea17a
AD
101 padding-bottom: 0;
102 text-align: center;
103 border-bottom: 1px solid #b5bcc7;
81bea17a 104 padding: 0 3px 2px;
2f01fe57 105}
1354d172
AD
106.claro .dijitCalendarDayLabel {
107 padding: 0 4px 0 4px;
108 font-weight: bold;
109 font-size: 0.909em;
110 text-align: center;
111 color: #000000;
112}
2f01fe57 113.claro .dijitCalendarDateTemplate {
81bea17a
AD
114 text-align: center;
115 background-color: #ffffff;
116 background-image: url("images/calendarContainerImages.png");
117 background-position: 0 0;
118 background-repeat: repeat-x;
119 border-bottom: 1px solid #d3d3d3;
120 padding-top: 0;
121 font-size: 0.909em;
122 font-family: Arial;
123 font-weight: bold;
124 letter-spacing: .05em;
125 text-align: center;
1354d172 126 color: #000000;
2f01fe57
AD
127}
128.dj_ie6 .claro .dijitCalendarDateTemplate {
81bea17a 129 background-image: none;
2f01fe57 130}
81bea17a 131.claro .dijitCalendarPreviousMonth, .claro .dijitCalendarNextMonth {
1354d172 132 background-color: #e5f2fe;
81bea17a
AD
133 background-image: none;
134 border-bottom: solid 1px #d3d3d3;
135 /* todo: redundant with above .dijitCalendarDateTemplate rule */
2f01fe57
AD
136}
137.claro .dijitCalendarDateTemplate .dijitCalendarDateLabel {
81bea17a
AD
138 text-decoration: none;
139 display: block;
140 padding: 3px 5px 3px 4px;
141 border: solid 1px #ffffff;
142 /* intentionally matches background-color, no visible border until hover/selection */
143
144 background-color: rgba(171, 212, 251, 0);
145 /* transparent causes black-flash animation problem on webkit */
146
147 -webkit-transition-property: background-color, border;
148 -moz-transition-property: background-color, border;
149 transition-property: background-color, border;
150 -webkit-transition-duration: 0.35s;
151 -moz-transition-duration: 0.35s;
152 transition-duration: 0.35s;
153}
154.claro .dijitCalendarPreviousMonth .dijitCalendarDateLabel, .claro .dijitCalendarNextMonth .dijitCalendarDateLabel {
1354d172
AD
155 color: #759dc0;
156 border-color: #e5f2fe;
81bea17a
AD
157 /* intentionally matches background-color, no visible border until hover/selection */
158
2f01fe57
AD
159}
160.claro .dijitCalendarYearContainer {
81bea17a 161 vertical-align: middle;
2f01fe57
AD
162}
163.claro .dijitCalendarYearControl {
81bea17a 164 padding: 1px 2px 2px 2px;
2f01fe57
AD
165}
166.claro .dijitCalendarYearLabel {
81bea17a
AD
167 padding: 2px 0 0 0;
168 margin: 0;
1354d172 169 font-size: 1.17em;
2f01fe57
AD
170}
171.claro .dijitCalendarYearLabel span {
81bea17a
AD
172 /* trying to center next/current/previous year vertically, doesn't work on IE6/7 though */
173
174 vertical-align: middle;
2f01fe57
AD
175}
176.claro .dijitCalendarSelectedYear {
81bea17a 177 padding: 0 3px;
2f01fe57 178}
81bea17a
AD
179.claro .dijitCalendarNextYear, .claro .dijitCalendarPreviousYear {
180 padding: 1px 6px 1px 6px;
181 font-size: 0.909em;
2f01fe57
AD
182}
183.claro .dijitCalendarSelectedYear {
81bea17a
AD
184 font-size: 1.091em;
185 color: #000000;
186}
187/* End Normal Calendar Style */
188/* Hovered Calendar Style */
1354d172 189.claro .dijitCalendarHoveredDate .dijitCalendarDateLabel, .claro .dijitCalendarEnabledDate:hover .dijitCalendarDateLabel {
81bea17a 190 background-color: #abd6ff;
1354d172 191 border: solid 1px #759dc0;
81bea17a
AD
192 color: #000000;
193 -webkit-transition-duration: 0.2s;
194 -moz-transition-duration: 0.2s;
195 transition-duration: 0.2s;
196}
1354d172
AD
197.claro .dijitCalendarNextYearHover,
198.claro .dijitCalendarNextYear:hover,
199.claro .dijitCalendarPreviousYearHover,
200.claro .dijitCalendarPreviousYear:hover {
81bea17a
AD
201 color: #000000;
202 border: solid 1px #ffffff;
203 padding: 0 5px 0 5px;
204 /* reduced by 1 to make room for border */
205
1354d172 206 background-color: #e5f2fe;
81bea17a
AD
207}
208/* End Hovered Calendar Style */
209/* Active Calendar Style */
1354d172
AD
210.claro .dijitCalendarNextYearActive, .claro .dijitCalendarNextYear:active.claro .dijitCalendarPreviousYearActive, .claro .dijitCalendarPreviousYear:active {
211 border: solid 1px #759dc0;
81bea17a
AD
212 padding: 0 5px 0 5px;
213 /* reduced by 1 to make room for border */
214
1354d172 215 background-color: #7dbdfa;
2f01fe57 216}
1354d172 217.claro .dijitCalendarActiveDate .dijitCalendarDateLabel, .claro .dijitCalendarEnabledDate:active .dijitCalendarDateLabel {
81bea17a
AD
218 background-image: url("images/calendarContainerImages.png");
219 background-position: 0 -300px;
1354d172 220 background-color: #7dbdfa;
81bea17a
AD
221 border: solid 1px #ffffff;
222 -webkit-transition-duration: 0.1s;
223 -moz-transition-duration: 0.1s;
224 transition-duration: 0.1s;
2f01fe57
AD
225}
226.dj_ie6 .claro .dijitCalendarActiveDate .dijitCalendarDateLabel {
81bea17a 227 background-image: none;
2f01fe57 228}
81bea17a
AD
229/* End Active Calendar Style */
230/* Selected Calendar Style */
2f01fe57 231.claro .dijitCalendarSelectedDate .dijitCalendarDateLabel {
81bea17a
AD
232 color: #000000;
233 background-color: #abd6ff;
1354d172 234 border-color: #759dc0;
2f01fe57 235}
81bea17a
AD
236/* End Selected Calendar Style */
237/* Disabled Calendar Style*/
2f01fe57 238.claro .dijitCalendarDisabledDate .dijitCalendarDateLabel {
81bea17a 239 color: #818181;
1354d172 240 text-decoration: line-through;
81bea17a
AD
241}
242/* End Disabled Calendar Style */
243/* Styling for month DropDownButton */
244.claro .dijitCalendar .dijitDropDownButton {
245 margin: 0;
246}
247.claro .dijitCalendar .dijitButtonText {
248 padding: 1px 0 3px;
249 margin-right: -4px;
250}
251.claro .dijitCalendar .dijitDropDownButton .dijitButtonNode {
252 background-color: transparent;
253 background-image: none;
254 padding: 0 3px 0 2px;
255 border: solid 1px #b5bcc7;
256 -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
257 -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
258 box-shadow: 0 0 0 rgba(0, 0, 0, 0);
259}
1354d172
AD
260.claro .dijitCalendar .dijitDropDownButtonHover .dijitButtonNode, .claro .dijitCalendar .dijitDropDownButton:hover .dijitButtonNode {
261 background-color: #e5f2fe;
81bea17a
AD
262 border: solid 1px #ffffff;
263}
264/* Styling for month drop down list */
265.claro .dijitCalendarMonthMenu {
1354d172 266 border-color: #759dc0;
81bea17a
AD
267 background-color: #ffffff;
268 text-align: center;
269 background-image: none;
270}
271.claro .dijitCalendarMonthMenu .dijitCalendarMonthLabel {
272 border-top: solid 1px #ffffff;
273 /* intentionally invisible until hover */
274
275 border-bottom: solid 1px #ffffff;
276 padding: 2px 0;
277}
1354d172 278.claro .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover, .claro .dijitCalendarMonthMenu .dijitCalendarMonthLabel:hover {
81bea17a 279 background-color: #abd6ff;
1354d172 280 border-color: #759dc0;
81bea17a
AD
281 border-width: 1px 0;
282 background-image: url("images/commonHighlight.png");
283 background-repeat: repeat-x;
2f01fe57 284}