1 /*! |
|
2 * FullCalendar v1.6.4 Stylesheet |
|
3 * Docs & License: http://arshaw.com/fullcalendar/ |
|
4 * (c) 2013 Adam Shaw |
|
5 */ |
|
6 |
|
7 |
|
8 .fc { |
|
9 direction: ltr; |
|
10 text-align: left; |
|
11 } |
|
12 |
|
13 .fc table { |
|
14 border-collapse: collapse; |
|
15 border-spacing: 0; |
|
16 } |
|
17 |
|
18 html .fc, |
|
19 .fc table { |
|
20 font-size: 1em; |
|
21 } |
|
22 |
|
23 .fc td, |
|
24 .fc th { |
|
25 padding: 0; |
|
26 vertical-align: top; |
|
27 } |
|
28 |
|
29 |
|
30 |
|
31 /* Header |
|
32 ------------------------------------------------------------------------*/ |
|
33 |
|
34 .fc-header td { |
|
35 white-space: nowrap; |
|
36 } |
|
37 |
|
38 .fc-header-left { |
|
39 width: 25%; |
|
40 text-align: left; |
|
41 } |
|
42 |
|
43 .fc-header-center { |
|
44 text-align: center; |
|
45 } |
|
46 |
|
47 .fc-header-right { |
|
48 width: 25%; |
|
49 text-align: right; |
|
50 } |
|
51 |
|
52 .fc-header-title { |
|
53 display: inline-block; |
|
54 vertical-align: top; |
|
55 } |
|
56 |
|
57 .fc-header-title h2 { |
|
58 margin-top: 0; |
|
59 white-space: nowrap; |
|
60 } |
|
61 |
|
62 .fc .fc-header-space { |
|
63 padding-left: 10px; |
|
64 } |
|
65 |
|
66 .fc-header .fc-button { |
|
67 margin-bottom: 1em; |
|
68 vertical-align: top; |
|
69 } |
|
70 |
|
71 /* buttons edges butting together */ |
|
72 |
|
73 .fc-header .fc-button { |
|
74 margin-right: -1px; |
|
75 } |
|
76 |
|
77 .fc-header .fc-corner-right, /* non-theme */ |
|
78 .fc-header .ui-corner-right { /* theme */ |
|
79 margin-right: 0; /* back to normal */ |
|
80 } |
|
81 |
|
82 /* button layering (for border precedence) */ |
|
83 |
|
84 .fc-header .fc-state-hover, |
|
85 .fc-header .ui-state-hover { |
|
86 z-index: 2; |
|
87 } |
|
88 |
|
89 .fc-header .fc-state-down { |
|
90 z-index: 3; |
|
91 } |
|
92 |
|
93 .fc-header .fc-state-active, |
|
94 .fc-header .ui-state-active { |
|
95 z-index: 4; |
|
96 } |
|
97 |
|
98 |
|
99 |
|
100 /* Content |
|
101 ------------------------------------------------------------------------*/ |
|
102 |
|
103 .fc-content { |
|
104 clear: both; |
|
105 zoom: 1; /* for IE7, gives accurate coordinates for [un]freezeContentHeight */ |
|
106 } |
|
107 |
|
108 .fc-view { |
|
109 width: 100%; |
|
110 overflow: hidden; |
|
111 } |
|
112 |
|
113 |
|
114 |
|
115 /* Cell Styles |
|
116 ------------------------------------------------------------------------*/ |
|
117 |
|
118 .fc-widget-header, /* <th>, usually */ |
|
119 .fc-widget-content { /* <td>, usually */ |
|
120 border: 1px solid #ddd; |
|
121 } |
|
122 |
|
123 .fc-state-highlight { /* <td> today cell */ /* TODO: add .fc-today to <th> */ |
|
124 background: #fcf8e3; |
|
125 } |
|
126 |
|
127 .fc-cell-overlay { /* semi-transparent rectangle while dragging */ |
|
128 background: #bce8f1; |
|
129 opacity: .3; |
|
130 filter: alpha(opacity=30); /* for IE */ |
|
131 } |
|
132 |
|
133 |
|
134 |
|
135 /* Buttons |
|
136 ------------------------------------------------------------------------*/ |
|
137 |
|
138 .fc-button { |
|
139 position: relative; |
|
140 display: inline-block; |
|
141 padding: 0 .6em; |
|
142 overflow: hidden; |
|
143 height: 1.9em; |
|
144 line-height: 1.9em; |
|
145 white-space: nowrap; |
|
146 cursor: pointer; |
|
147 } |
|
148 |
|
149 .fc-state-default { /* non-theme */ |
|
150 border: 1px solid; |
|
151 } |
|
152 |
|
153 .fc-state-default.fc-corner-left { /* non-theme */ |
|
154 border-top-left-radius: 4px; |
|
155 border-bottom-left-radius: 4px; |
|
156 } |
|
157 |
|
158 .fc-state-default.fc-corner-right { /* non-theme */ |
|
159 border-top-right-radius: 4px; |
|
160 border-bottom-right-radius: 4px; |
|
161 } |
|
162 |
|
163 /* |
|
164 Our default prev/next buttons use HTML entities like ‹ › « » |
|
165 and we'll try to make them look good cross-browser. |
|
166 */ |
|
167 |
|
168 .fc-text-arrow { |
|
169 margin: 0 .1em; |
|
170 font-size: 2em; |
|
171 font-family: "Courier New", Courier, monospace; |
|
172 vertical-align: baseline; /* for IE7 */ |
|
173 } |
|
174 |
|
175 .fc-button-prev .fc-text-arrow, |
|
176 .fc-button-next .fc-text-arrow { /* for ‹ › */ |
|
177 font-weight: bold; |
|
178 } |
|
179 |
|
180 /* icon (for jquery ui) */ |
|
181 |
|
182 .fc-button .fc-icon-wrap { |
|
183 position: relative; |
|
184 float: left; |
|
185 top: 50%; |
|
186 } |
|
187 |
|
188 .fc-button .ui-icon { |
|
189 position: relative; |
|
190 float: left; |
|
191 margin-top: -50%; |
|
192 *margin-top: 0; |
|
193 *top: -50%; |
|
194 } |
|
195 |
|
196 /* |
|
197 button states |
|
198 borrowed from twitter bootstrap (http://twitter.github.com/bootstrap/) |
|
199 */ |
|
200 |
|
201 .fc-state-default { |
|
202 background-color: #f5f5f5; |
|
203 background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); |
|
204 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6)); |
|
205 background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); |
|
206 background-image: -o-linear-gradient(top, #ffffff, #e6e6e6); |
|
207 background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); |
|
208 background-repeat: repeat-x; |
|
209 border-color: #e6e6e6 #e6e6e6 #bfbfbf; |
|
210 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); |
|
211 color: #333; |
|
212 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); |
|
213 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); |
|
214 } |
|
215 |
|
216 .fc-state-hover, |
|
217 .fc-state-down, |
|
218 .fc-state-active, |
|
219 .fc-state-disabled { |
|
220 color: #333333; |
|
221 background-color: #e6e6e6; |
|
222 } |
|
223 |
|
224 .fc-state-hover { |
|
225 color: #333333; |
|
226 text-decoration: none; |
|
227 background-position: 0 -15px; |
|
228 -webkit-transition: background-position 0.1s linear; |
|
229 -moz-transition: background-position 0.1s linear; |
|
230 -o-transition: background-position 0.1s linear; |
|
231 transition: background-position 0.1s linear; |
|
232 } |
|
233 |
|
234 .fc-state-down, |
|
235 .fc-state-active { |
|
236 background-color: #cccccc; |
|
237 background-image: none; |
|
238 outline: 0; |
|
239 box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); |
|
240 } |
|
241 |
|
242 .fc-state-disabled { |
|
243 cursor: default; |
|
244 background-image: none; |
|
245 opacity: 0.65; |
|
246 filter: alpha(opacity=65); |
|
247 box-shadow: none; |
|
248 } |
|
249 |
|
250 |
|
251 |
|
252 /* Global Event Styles |
|
253 ------------------------------------------------------------------------*/ |
|
254 |
|
255 .fc-event-container > * { |
|
256 z-index: 8; |
|
257 } |
|
258 |
|
259 .fc-event-container > .ui-draggable-dragging, |
|
260 .fc-event-container > .ui-resizable-resizing { |
|
261 z-index: 9; |
|
262 } |
|
263 |
|
264 .fc-event { |
|
265 border: 1px solid #3a87ad; /* default BORDER color */ |
|
266 background-color: #3a87ad; /* default BACKGROUND color */ |
|
267 color: #fff; /* default TEXT color */ |
|
268 font-size: .85em; |
|
269 cursor: default; |
|
270 } |
|
271 |
|
272 a.fc-event { |
|
273 text-decoration: none; |
|
274 } |
|
275 |
|
276 a.fc-event, |
|
277 .fc-event-draggable { |
|
278 cursor: pointer; |
|
279 } |
|
280 |
|
281 .fc-rtl .fc-event { |
|
282 text-align: right; |
|
283 } |
|
284 |
|
285 .fc-event-inner { |
|
286 width: 100%; |
|
287 height: 100%; |
|
288 overflow: hidden; |
|
289 } |
|
290 |
|
291 .fc-event-time, |
|
292 .fc-event-title { |
|
293 padding: 0 1px; |
|
294 } |
|
295 |
|
296 .fc .ui-resizable-handle { |
|
297 display: block; |
|
298 position: absolute; |
|
299 z-index: 99999; |
|
300 overflow: hidden; /* hacky spaces (IE6/7) */ |
|
301 font-size: 300%; /* */ |
|
302 line-height: 50%; /* */ |
|
303 } |
|
304 |
|
305 |
|
306 |
|
307 /* Horizontal Events |
|
308 ------------------------------------------------------------------------*/ |
|
309 |
|
310 .fc-event-hori { |
|
311 border-width: 1px 0; |
|
312 margin-bottom: 1px; |
|
313 } |
|
314 |
|
315 .fc-ltr .fc-event-hori.fc-event-start, |
|
316 .fc-rtl .fc-event-hori.fc-event-end { |
|
317 border-left-width: 1px; |
|
318 border-top-left-radius: 3px; |
|
319 border-bottom-left-radius: 3px; |
|
320 } |
|
321 |
|
322 .fc-ltr .fc-event-hori.fc-event-end, |
|
323 .fc-rtl .fc-event-hori.fc-event-start { |
|
324 border-right-width: 1px; |
|
325 border-top-right-radius: 3px; |
|
326 border-bottom-right-radius: 3px; |
|
327 } |
|
328 |
|
329 /* resizable */ |
|
330 |
|
331 .fc-event-hori .ui-resizable-e { |
|
332 top: 0 !important; /* importants override pre jquery ui 1.7 styles */ |
|
333 right: -3px !important; |
|
334 width: 7px !important; |
|
335 height: 100% !important; |
|
336 cursor: e-resize; |
|
337 } |
|
338 |
|
339 .fc-event-hori .ui-resizable-w { |
|
340 top: 0 !important; |
|
341 left: -3px !important; |
|
342 width: 7px !important; |
|
343 height: 100% !important; |
|
344 cursor: w-resize; |
|
345 } |
|
346 |
|
347 .fc-event-hori .ui-resizable-handle { |
|
348 _padding-bottom: 14px; /* IE6 had 0 height */ |
|
349 } |
|
350 |
|
351 |
|
352 |
|
353 /* Reusable Separate-border Table |
|
354 ------------------------------------------------------------*/ |
|
355 |
|
356 table.fc-border-separate { |
|
357 border-collapse: separate; |
|
358 } |
|
359 |
|
360 .fc-border-separate th, |
|
361 .fc-border-separate td { |
|
362 border-width: 1px 0 0 1px; |
|
363 } |
|
364 |
|
365 .fc-border-separate th.fc-last, |
|
366 .fc-border-separate td.fc-last { |
|
367 border-right-width: 1px; |
|
368 } |
|
369 |
|
370 .fc-border-separate tr.fc-last th, |
|
371 .fc-border-separate tr.fc-last td { |
|
372 border-bottom-width: 1px; |
|
373 } |
|
374 |
|
375 .fc-border-separate tbody tr.fc-first td, |
|
376 .fc-border-separate tbody tr.fc-first th { |
|
377 border-top-width: 0; |
|
378 } |
|
379 |
|
380 |
|
381 |
|
382 /* Month View, Basic Week View, Basic Day View |
|
383 ------------------------------------------------------------------------*/ |
|
384 |
|
385 .fc-grid th { |
|
386 text-align: center; |
|
387 } |
|
388 |
|
389 .fc .fc-week-number { |
|
390 width: 22px; |
|
391 text-align: center; |
|
392 } |
|
393 |
|
394 .fc .fc-week-number div { |
|
395 padding: 0 2px; |
|
396 } |
|
397 |
|
398 .fc-grid .fc-day-number { |
|
399 float: right; |
|
400 padding: 0 2px; |
|
401 } |
|
402 |
|
403 .fc-grid .fc-other-month .fc-day-number { |
|
404 opacity: 0.3; |
|
405 filter: alpha(opacity=30); /* for IE */ |
|
406 /* opacity with small font can sometimes look too faded |
|
407 might want to set the 'color' property instead |
|
408 making day-numbers bold also fixes the problem */ |
|
409 } |
|
410 |
|
411 .fc-grid .fc-day-content { |
|
412 clear: both; |
|
413 padding: 2px 2px 1px; /* distance between events and day edges */ |
|
414 } |
|
415 |
|
416 /* event styles */ |
|
417 |
|
418 .fc-grid .fc-event-time { |
|
419 font-weight: bold; |
|
420 } |
|
421 |
|
422 /* right-to-left */ |
|
423 |
|
424 .fc-rtl .fc-grid .fc-day-number { |
|
425 float: left; |
|
426 } |
|
427 |
|
428 .fc-rtl .fc-grid .fc-event-time { |
|
429 float: right; |
|
430 } |
|
431 |
|
432 |
|
433 |
|
434 /* Agenda Week View, Agenda Day View |
|
435 ------------------------------------------------------------------------*/ |
|
436 |
|
437 .fc-agenda table { |
|
438 border-collapse: separate; |
|
439 } |
|
440 |
|
441 .fc-agenda-days th { |
|
442 text-align: center; |
|
443 } |
|
444 |
|
445 .fc-agenda .fc-agenda-axis { |
|
446 width: 50px; |
|
447 padding: 0 4px; |
|
448 vertical-align: middle; |
|
449 text-align: right; |
|
450 white-space: nowrap; |
|
451 font-weight: normal; |
|
452 } |
|
453 |
|
454 .fc-agenda .fc-week-number { |
|
455 font-weight: bold; |
|
456 } |
|
457 |
|
458 .fc-agenda .fc-day-content { |
|
459 padding: 2px 2px 1px; |
|
460 } |
|
461 |
|
462 /* make axis border take precedence */ |
|
463 |
|
464 .fc-agenda-days .fc-agenda-axis { |
|
465 border-right-width: 1px; |
|
466 } |
|
467 |
|
468 .fc-agenda-days .fc-col0 { |
|
469 border-left-width: 0; |
|
470 } |
|
471 |
|
472 /* all-day area */ |
|
473 |
|
474 .fc-agenda-allday th { |
|
475 border-width: 0 1px; |
|
476 } |
|
477 |
|
478 .fc-agenda-allday .fc-day-content { |
|
479 min-height: 34px; /* TODO: doesnt work well in quirksmode */ |
|
480 _height: 34px; |
|
481 } |
|
482 |
|
483 /* divider (between all-day and slots) */ |
|
484 |
|
485 .fc-agenda-divider-inner { |
|
486 height: 2px; |
|
487 overflow: hidden; |
|
488 } |
|
489 |
|
490 .fc-widget-header .fc-agenda-divider-inner { |
|
491 background: #eee; |
|
492 } |
|
493 |
|
494 /* slot rows */ |
|
495 |
|
496 .fc-agenda-slots th { |
|
497 border-width: 1px 1px 0; |
|
498 } |
|
499 |
|
500 .fc-agenda-slots td { |
|
501 border-width: 1px 0 0; |
|
502 background: none; |
|
503 } |
|
504 |
|
505 .fc-agenda-slots td div { |
|
506 height: 20px; |
|
507 } |
|
508 |
|
509 .fc-agenda-slots tr.fc-slot0 th, |
|
510 .fc-agenda-slots tr.fc-slot0 td { |
|
511 border-top-width: 0; |
|
512 } |
|
513 |
|
514 .fc-agenda-slots tr.fc-minor th, |
|
515 .fc-agenda-slots tr.fc-minor td { |
|
516 border-top-style: dotted; |
|
517 } |
|
518 |
|
519 .fc-agenda-slots tr.fc-minor th.ui-widget-header { |
|
520 *border-top-style: solid; /* doesn't work with background in IE6/7 */ |
|
521 } |
|
522 |
|
523 |
|
524 |
|
525 /* Vertical Events |
|
526 ------------------------------------------------------------------------*/ |
|
527 |
|
528 .fc-event-vert { |
|
529 border-width: 0 1px; |
|
530 } |
|
531 |
|
532 .fc-event-vert.fc-event-start { |
|
533 border-top-width: 1px; |
|
534 border-top-left-radius: 3px; |
|
535 border-top-right-radius: 3px; |
|
536 } |
|
537 |
|
538 .fc-event-vert.fc-event-end { |
|
539 border-bottom-width: 1px; |
|
540 border-bottom-left-radius: 3px; |
|
541 border-bottom-right-radius: 3px; |
|
542 } |
|
543 |
|
544 .fc-event-vert .fc-event-time { |
|
545 white-space: nowrap; |
|
546 font-size: 10px; |
|
547 } |
|
548 |
|
549 .fc-event-vert .fc-event-inner { |
|
550 position: relative; |
|
551 z-index: 2; |
|
552 } |
|
553 |
|
554 .fc-event-vert .fc-event-bg { /* makes the event lighter w/ a semi-transparent overlay */ |
|
555 position: absolute; |
|
556 z-index: 1; |
|
557 top: 0; |
|
558 left: 0; |
|
559 width: 100%; |
|
560 height: 100%; |
|
561 background: #fff; |
|
562 opacity: .25; |
|
563 filter: alpha(opacity=25); |
|
564 } |
|
565 |
|
566 .fc .ui-draggable-dragging .fc-event-bg, /* TODO: something nicer like .fc-opacity */ |
|
567 .fc-select-helper .fc-event-bg { |
|
568 display: none\9; /* for IE6/7/8. nested opacity filters while dragging don't work */ |
|
569 } |
|
570 |
|
571 /* resizable */ |
|
572 |
|
573 .fc-event-vert .ui-resizable-s { |
|
574 bottom: 0 !important; /* importants override pre jquery ui 1.7 styles */ |
|
575 width: 100% !important; |
|
576 height: 8px !important; |
|
577 overflow: hidden !important; |
|
578 line-height: 8px !important; |
|
579 font-size: 11px !important; |
|
580 font-family: monospace; |
|
581 text-align: center; |
|
582 cursor: s-resize; |
|
583 } |
|
584 |
|
585 .fc-agenda .ui-resizable-resizing { /* TODO: better selector */ |
|
586 _overflow: hidden; |
|
587 } |
|
588 |
|
589 |
|