1/*! 2 * FullCalendar v3.10.5 3 * Docs & License: https://fullcalendar.io/ 4 * (c) 2019 Adam Shaw 5 */ 6.fc { 7 direction: ltr; 8 text-align: left; } 9 10.fc-rtl { 11 text-align: right; } 12 13body .fc { 14 /* extra precedence to overcome jqui */ 15 font-size: 1em; } 16 17/* Colors 18--------------------------------------------------------------------------------------------------*/ 19.fc-highlight { 20 /* when user is selecting cells */ 21 background: #bce8f1; 22 opacity: .3; } 23 24.fc-bgevent { 25 /* default look for background events */ 26 background: #8fdf82; 27 opacity: .3; } 28 29.fc-nonbusiness { 30 /* default look for non-business-hours areas */ 31 /* will inherit .fc-bgevent's styles */ 32 background: #d7d7d7; } 33 34/* Buttons (styled <button> tags, normalized to work cross-browser) 35--------------------------------------------------------------------------------------------------*/ 36.fc button { 37 /* force height to include the border and padding */ 38 -moz-box-sizing: border-box; 39 -webkit-box-sizing: border-box; 40 box-sizing: border-box; 41 /* dimensions */ 42 margin: 0; 43 height: 2.1em; 44 padding: 0 .6em; 45 /* text & cursor */ 46 font-size: 1em; 47 /* normalize */ 48 white-space: nowrap; 49 cursor: pointer; } 50 51/* Firefox has an annoying inner border */ 52.fc button::-moz-focus-inner { 53 margin: 0; 54 padding: 0; } 55 56.fc-state-default { 57 /* non-theme */ 58 border: 1px solid; } 59 60.fc-state-default.fc-corner-left { 61 /* non-theme */ 62 border-top-left-radius: 4px; 63 border-bottom-left-radius: 4px; } 64 65.fc-state-default.fc-corner-right { 66 /* non-theme */ 67 border-top-right-radius: 4px; 68 border-bottom-right-radius: 4px; } 69 70/* icons in buttons */ 71.fc button .fc-icon { 72 /* non-theme */ 73 position: relative; 74 top: -0.05em; 75 /* seems to be a good adjustment across browsers */ 76 margin: 0 .2em; 77 vertical-align: middle; } 78 79/* 80 button states 81 borrowed from twitter bootstrap (http://twitter.github.com/bootstrap/) 82*/ 83.fc-state-default { 84 background-color: #f5f5f5; 85 background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); 86 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6)); 87 background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); 88 background-image: -o-linear-gradient(top, #ffffff, #e6e6e6); 89 background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); 90 background-repeat: repeat-x; 91 border-color: #e6e6e6 #e6e6e6 #bfbfbf; 92 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); 93 color: #333; 94 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); 95 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); } 96 97.fc-state-hover, 98.fc-state-down, 99.fc-state-active, 100.fc-state-disabled { 101 color: #333333; 102 background-color: #e6e6e6; } 103 104.fc-state-hover { 105 color: #333333; 106 text-decoration: none; 107 background-position: 0 -15px; 108 -webkit-transition: background-position 0.1s linear; 109 -moz-transition: background-position 0.1s linear; 110 -o-transition: background-position 0.1s linear; 111 transition: background-position 0.1s linear; } 112 113.fc-state-down, 114.fc-state-active { 115 background-color: #cccccc; 116 background-image: none; 117 box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); } 118 119.fc-state-disabled { 120 cursor: default; 121 background-image: none; 122 opacity: 0.65; 123 box-shadow: none; } 124 125/* Buttons Groups 126--------------------------------------------------------------------------------------------------*/ 127.fc-button-group { 128 display: inline-block; } 129 130/* 131every button that is not first in a button group should scootch over one pixel and cover the 132previous button's border... 133*/ 134.fc .fc-button-group > * { 135 /* extra precedence b/c buttons have margin set to zero */ 136 float: left; 137 margin: 0 0 0 -1px; } 138 139.fc .fc-button-group > :first-child { 140 /* same */ 141 margin-left: 0; } 142 143/* Popover 144--------------------------------------------------------------------------------------------------*/ 145.fc-popover { 146 position: absolute; 147 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); } 148 149.fc-popover .fc-header { 150 /* TODO: be more consistent with fc-head/fc-body */ 151 padding: 2px 4px; } 152 153.fc-popover .fc-header .fc-title { 154 margin: 0 2px; } 155 156.fc-popover .fc-header .fc-close { 157 cursor: pointer; } 158 159.fc-ltr .fc-popover .fc-header .fc-title, 160.fc-rtl .fc-popover .fc-header .fc-close { 161 float: left; } 162 163.fc-rtl .fc-popover .fc-header .fc-title, 164.fc-ltr .fc-popover .fc-header .fc-close { 165 float: right; } 166 167/* Misc Reusable Components 168--------------------------------------------------------------------------------------------------*/ 169.fc-divider { 170 border-style: solid; 171 border-width: 1px; } 172 173hr.fc-divider { 174 height: 0; 175 margin: 0; 176 padding: 0 0 2px; 177 /* height is unreliable across browsers, so use padding */ 178 border-width: 1px 0; } 179 180.fc-clear { 181 clear: both; } 182 183.fc-bg, 184.fc-bgevent-skeleton, 185.fc-highlight-skeleton, 186.fc-helper-skeleton { 187 /* these element should always cling to top-left/right corners */ 188 position: absolute; 189 top: 0; 190 left: 0; 191 right: 0; } 192 193.fc-bg { 194 bottom: 0; 195 /* strech bg to bottom edge */ } 196 197.fc-bg table { 198 height: 100%; 199 /* strech bg to bottom edge */ } 200 201/* Tables 202--------------------------------------------------------------------------------------------------*/ 203.fc table { 204 width: 100%; 205 box-sizing: border-box; 206 /* fix scrollbar issue in firefox */ 207 table-layout: fixed; 208 border-collapse: collapse; 209 border-spacing: 0; 210 font-size: 1em; 211 /* normalize cross-browser */ } 212 213.fc th { 214 text-align: center; } 215 216.fc th, 217.fc td { 218 border-style: solid; 219 border-width: 1px; 220 padding: 0; 221 vertical-align: top; } 222 223.fc td.fc-today { 224 border-style: double; 225 /* overcome neighboring borders */ } 226 227/* Internal Nav Links 228--------------------------------------------------------------------------------------------------*/ 229a[data-goto] { 230 cursor: pointer; } 231 232a[data-goto]:hover { 233 text-decoration: underline; } 234 235/* Fake Table Rows 236--------------------------------------------------------------------------------------------------*/ 237.fc .fc-row { 238 /* extra precedence to overcome themes w/ .ui-widget-content forcing a 1px border */ 239 /* no visible border by default. but make available if need be (scrollbar width compensation) */ 240 border-style: solid; 241 border-width: 0; } 242 243.fc-row table { 244 /* don't put left/right border on anything within a fake row. 245 the outer tbody will worry about this */ 246 border-left: 0 hidden transparent; 247 border-right: 0 hidden transparent; 248 /* no bottom borders on rows */ 249 border-bottom: 0 hidden transparent; } 250 251.fc-row:first-child table { 252 border-top: 0 hidden transparent; 253 /* no top border on first row */ } 254 255/* Day Row (used within the header and the DayGrid) 256--------------------------------------------------------------------------------------------------*/ 257.fc-row { 258 position: relative; } 259 260.fc-row .fc-bg { 261 z-index: 1; } 262 263/* highlighting cells & background event skeleton */ 264.fc-row .fc-bgevent-skeleton, 265.fc-row .fc-highlight-skeleton { 266 bottom: 0; 267 /* stretch skeleton to bottom of row */ } 268 269.fc-row .fc-bgevent-skeleton table, 270.fc-row .fc-highlight-skeleton table { 271 height: 100%; 272 /* stretch skeleton to bottom of row */ } 273 274.fc-row .fc-highlight-skeleton td, 275.fc-row .fc-bgevent-skeleton td { 276 border-color: transparent; } 277 278.fc-row .fc-bgevent-skeleton { 279 z-index: 2; } 280 281.fc-row .fc-highlight-skeleton { 282 z-index: 3; } 283 284/* 285row content (which contains day/week numbers and events) as well as "helper" (which contains 286temporary rendered events). 287*/ 288.fc-row .fc-content-skeleton { 289 position: relative; 290 z-index: 4; 291 padding-bottom: 2px; 292 /* matches the space above the events */ } 293 294.fc-row .fc-helper-skeleton { 295 z-index: 5; } 296 297.fc .fc-row .fc-content-skeleton table, 298.fc .fc-row .fc-content-skeleton td, 299.fc .fc-row .fc-helper-skeleton td { 300 /* see-through to the background below */ 301 /* extra precedence to prevent theme-provided backgrounds */ 302 background: none; 303 /* in case <td>s are globally styled */ 304 border-color: transparent; } 305 306.fc-row .fc-content-skeleton td, 307.fc-row .fc-helper-skeleton td { 308 /* don't put a border between events and/or the day number */ 309 border-bottom: 0; } 310 311.fc-row .fc-content-skeleton tbody td, 312.fc-row .fc-helper-skeleton tbody td { 313 /* don't put a border between event cells */ 314 border-top: 0; } 315 316/* Scrolling Container 317--------------------------------------------------------------------------------------------------*/ 318.fc-scroller { 319 -webkit-overflow-scrolling: touch; } 320 321/* TODO: move to agenda/basic */ 322.fc-scroller > .fc-day-grid, 323.fc-scroller > .fc-time-grid { 324 position: relative; 325 /* re-scope all positions */ 326 width: 100%; 327 /* hack to force re-sizing this inner element when scrollbars appear/disappear */ } 328 329/* Global Event Styles 330--------------------------------------------------------------------------------------------------*/ 331.fc-event { 332 position: relative; 333 /* for resize handle and other inner positioning */ 334 display: block; 335 /* make the <a> tag block */ 336 font-size: .85em; 337 line-height: 1.3; 338 border-radius: 3px; 339 border: 1px solid #3a87ad; 340 /* default BORDER color */ } 341 342.fc-event, 343.fc-event-dot { 344 background-color: #3a87ad; 345 /* default BACKGROUND color */ } 346 347.fc-event, 348.fc-event:hover { 349 color: #fff; 350 /* default TEXT color */ 351 text-decoration: none; 352 /* if <a> has an href */ } 353 354.fc-event[href], 355.fc-event.fc-draggable { 356 cursor: pointer; 357 /* give events with links and draggable events a hand mouse pointer */ } 358 359.fc-not-allowed, 360.fc-not-allowed .fc-event { 361 /* to override an event's custom cursor */ 362 cursor: not-allowed; } 363 364.fc-event .fc-bg { 365 /* the generic .fc-bg already does position */ 366 z-index: 1; 367 background: #fff; 368 opacity: .25; } 369 370.fc-event .fc-content { 371 position: relative; 372 z-index: 2; } 373 374/* resizer (cursor AND touch devices) */ 375.fc-event .fc-resizer { 376 position: absolute; 377 z-index: 4; } 378 379/* resizer (touch devices) */ 380.fc-event .fc-resizer { 381 display: none; } 382 383.fc-event.fc-allow-mouse-resize .fc-resizer, 384.fc-event.fc-selected .fc-resizer { 385 /* only show when hovering or selected (with touch) */ 386 display: block; } 387 388/* hit area */ 389.fc-event.fc-selected .fc-resizer:before { 390 /* 40x40 touch area */ 391 content: ""; 392 position: absolute; 393 z-index: 9999; 394 /* user of this util can scope within a lower z-index */ 395 top: 50%; 396 left: 50%; 397 width: 40px; 398 height: 40px; 399 margin-left: -20px; 400 margin-top: -20px; } 401 402/* Event Selection (only for touch devices) 403--------------------------------------------------------------------------------------------------*/ 404.fc-event.fc-selected { 405 z-index: 9999 !important; 406 /* overcomes inline z-index */ 407 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); } 408 409.fc-event.fc-selected.fc-dragging { 410 box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3); } 411 412/* Horizontal Events 413--------------------------------------------------------------------------------------------------*/ 414/* bigger touch area when selected */ 415.fc-h-event.fc-selected:before { 416 content: ""; 417 position: absolute; 418 z-index: 3; 419 /* below resizers */ 420 top: -10px; 421 bottom: -10px; 422 left: 0; 423 right: 0; } 424 425/* events that are continuing to/from another week. kill rounded corners and butt up against edge */ 426.fc-ltr .fc-h-event.fc-not-start, 427.fc-rtl .fc-h-event.fc-not-end { 428 margin-left: 0; 429 border-left-width: 0; 430 padding-left: 1px; 431 /* replace the border with padding */ 432 border-top-left-radius: 0; 433 border-bottom-left-radius: 0; } 434 435.fc-ltr .fc-h-event.fc-not-end, 436.fc-rtl .fc-h-event.fc-not-start { 437 margin-right: 0; 438 border-right-width: 0; 439 padding-right: 1px; 440 /* replace the border with padding */ 441 border-top-right-radius: 0; 442 border-bottom-right-radius: 0; } 443 444/* resizer (cursor AND touch devices) */ 445/* left resizer */ 446.fc-ltr .fc-h-event .fc-start-resizer, 447.fc-rtl .fc-h-event .fc-end-resizer { 448 cursor: w-resize; 449 left: -1px; 450 /* overcome border */ } 451 452/* right resizer */ 453.fc-ltr .fc-h-event .fc-end-resizer, 454.fc-rtl .fc-h-event .fc-start-resizer { 455 cursor: e-resize; 456 right: -1px; 457 /* overcome border */ } 458 459/* resizer (mouse devices) */ 460.fc-h-event.fc-allow-mouse-resize .fc-resizer { 461 width: 7px; 462 top: -1px; 463 /* overcome top border */ 464 bottom: -1px; 465 /* overcome bottom border */ } 466 467/* resizer (touch devices) */ 468.fc-h-event.fc-selected .fc-resizer { 469 /* 8x8 little dot */ 470 border-radius: 4px; 471 border-width: 1px; 472 width: 6px; 473 height: 6px; 474 border-style: solid; 475 border-color: inherit; 476 background: #fff; 477 /* vertically center */ 478 top: 50%; 479 margin-top: -4px; } 480 481/* left resizer */ 482.fc-ltr .fc-h-event.fc-selected .fc-start-resizer, 483.fc-rtl .fc-h-event.fc-selected .fc-end-resizer { 484 margin-left: -4px; 485 /* centers the 8x8 dot on the left edge */ } 486 487/* right resizer */ 488.fc-ltr .fc-h-event.fc-selected .fc-end-resizer, 489.fc-rtl .fc-h-event.fc-selected .fc-start-resizer { 490 margin-right: -4px; 491 /* centers the 8x8 dot on the right edge */ } 492 493/* DayGrid events 494---------------------------------------------------------------------------------------------------- 495We use the full "fc-day-grid-event" class instead of using descendants because the event won't 496be a descendant of the grid when it is being dragged. 497*/ 498.fc-day-grid-event { 499 margin: 1px 2px 0; 500 /* spacing between events and edges */ 501 padding: 0 1px; } 502 503tr:first-child > td > .fc-day-grid-event { 504 margin-top: 2px; 505 /* a little bit more space before the first event */ } 506 507.fc-day-grid-event.fc-selected:after { 508 content: ""; 509 position: absolute; 510 z-index: 1; 511 /* same z-index as fc-bg, behind text */ 512 /* overcome the borders */ 513 top: -1px; 514 right: -1px; 515 bottom: -1px; 516 left: -1px; 517 /* darkening effect */ 518 background: #000; 519 opacity: .25; } 520 521.fc-day-grid-event .fc-content { 522 /* force events to be one-line tall */ 523 white-space: nowrap; 524 overflow: hidden; } 525 526.fc-day-grid-event .fc-time { 527 font-weight: bold; } 528 529/* resizer (cursor devices) */ 530/* left resizer */ 531.fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer, 532.fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer { 533 margin-left: -2px; 534 /* to the day cell's edge */ } 535 536/* right resizer */ 537.fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer, 538.fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer { 539 margin-right: -2px; 540 /* to the day cell's edge */ } 541 542/* Event Limiting 543--------------------------------------------------------------------------------------------------*/ 544/* "more" link that represents hidden events */ 545a.fc-more { 546 margin: 1px 3px; 547 font-size: .85em; 548 cursor: pointer; 549 text-decoration: none; } 550 551a.fc-more:hover { 552 text-decoration: underline; } 553 554.fc-limited { 555 /* rows and cells that are hidden because of a "more" link */ 556 display: none; } 557 558/* popover that appears when "more" link is clicked */ 559.fc-day-grid .fc-row { 560 z-index: 1; 561 /* make the "more" popover one higher than this */ } 562 563.fc-more-popover { 564 z-index: 2; 565 width: 220px; } 566 567.fc-more-popover .fc-event-container { 568 padding: 10px; } 569 570/* Now Indicator 571--------------------------------------------------------------------------------------------------*/ 572.fc-now-indicator { 573 position: absolute; 574 border: 0 solid red; } 575 576/* Utilities 577--------------------------------------------------------------------------------------------------*/ 578.fc-unselectable { 579 -webkit-user-select: none; 580 -khtml-user-select: none; 581 -moz-user-select: none; 582 -ms-user-select: none; 583 user-select: none; 584 -webkit-touch-callout: none; 585 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } 586 587/* 588TODO: more distinction between this file and common.css 589*/ 590/* Colors 591--------------------------------------------------------------------------------------------------*/ 592.fc-unthemed th, 593.fc-unthemed td, 594.fc-unthemed thead, 595.fc-unthemed tbody, 596.fc-unthemed .fc-divider, 597.fc-unthemed .fc-row, 598.fc-unthemed .fc-content, 599.fc-unthemed .fc-popover, 600.fc-unthemed .fc-list-view, 601.fc-unthemed .fc-list-heading td { 602 border-color: #ddd; } 603 604.fc-unthemed .fc-popover { 605 background-color: #fff; } 606 607.fc-unthemed .fc-divider, 608.fc-unthemed .fc-popover .fc-header, 609.fc-unthemed .fc-list-heading td { 610 background: #eee; } 611 612.fc-unthemed .fc-popover .fc-header .fc-close { 613 color: #666; } 614 615.fc-unthemed td.fc-today { 616 background: #fcf8e3; } 617 618.fc-unthemed .fc-disabled-day { 619 background: #d7d7d7; 620 opacity: .3; } 621 622/* Icons (inline elements with styled text that mock arrow icons) 623--------------------------------------------------------------------------------------------------*/ 624.fc-icon { 625 display: inline-block; 626 height: 1em; 627 line-height: 1em; 628 font-size: 1em; 629 text-align: center; 630 overflow: hidden; 631 font-family: "Courier New", Courier, monospace; 632 /* don't allow browser text-selection */ 633 -webkit-touch-callout: none; 634 -webkit-user-select: none; 635 -khtml-user-select: none; 636 -moz-user-select: none; 637 -ms-user-select: none; 638 user-select: none; } 639 640/* 641Acceptable font-family overrides for individual icons: 642 "Arial", sans-serif 643 "Times New Roman", serif 644 645NOTE: use percentage font sizes or else old IE chokes 646*/ 647.fc-icon:after { 648 position: relative; } 649 650.fc-icon-left-single-arrow:after { 651 content: "\2039"; 652 font-weight: bold; 653 font-size: 200%; 654 top: -7%; } 655 656.fc-icon-right-single-arrow:after { 657 content: "\203A"; 658 font-weight: bold; 659 font-size: 200%; 660 top: -7%; } 661 662.fc-icon-left-double-arrow:after { 663 content: "\AB"; 664 font-size: 160%; 665 top: -7%; } 666 667.fc-icon-right-double-arrow:after { 668 content: "\BB"; 669 font-size: 160%; 670 top: -7%; } 671 672.fc-icon-left-triangle:after { 673 content: "\25C4"; 674 font-size: 125%; 675 top: 3%; } 676 677.fc-icon-right-triangle:after { 678 content: "\25BA"; 679 font-size: 125%; 680 top: 3%; } 681 682.fc-icon-down-triangle:after { 683 content: "\25BC"; 684 font-size: 125%; 685 top: 2%; } 686 687.fc-icon-x:after { 688 content: "\D7"; 689 font-size: 200%; 690 top: 6%; } 691 692/* Popover 693--------------------------------------------------------------------------------------------------*/ 694.fc-unthemed .fc-popover { 695 border-width: 1px; 696 border-style: solid; } 697 698.fc-unthemed .fc-popover .fc-header .fc-close { 699 font-size: .9em; 700 margin-top: 2px; } 701 702/* List View 703--------------------------------------------------------------------------------------------------*/ 704.fc-unthemed .fc-list-item:hover td { 705 background-color: #f5f5f5; } 706 707/* Colors 708--------------------------------------------------------------------------------------------------*/ 709.ui-widget .fc-disabled-day { 710 background-image: none; } 711 712/* Popover 713--------------------------------------------------------------------------------------------------*/ 714.fc-popover > .ui-widget-header + .ui-widget-content { 715 border-top: 0; 716 /* where they meet, let the header have the border */ } 717 718/* Global Event Styles 719--------------------------------------------------------------------------------------------------*/ 720.ui-widget .fc-event { 721 /* overpower jqui's styles on <a> tags. TODO: more DRY */ 722 color: #fff; 723 /* default TEXT color */ 724 text-decoration: none; 725 /* if <a> has an href */ 726 /* undo ui-widget-header bold */ 727 font-weight: normal; } 728 729/* TimeGrid axis running down the side (for both the all-day area and the slot area) 730--------------------------------------------------------------------------------------------------*/ 731.ui-widget td.fc-axis { 732 font-weight: normal; 733 /* overcome bold */ } 734 735/* TimeGrid Slats (lines that run horizontally) 736--------------------------------------------------------------------------------------------------*/ 737.fc-time-grid .fc-slats .ui-widget-content { 738 background: none; 739 /* see through to fc-bg */ } 740 741.fc.fc-bootstrap3 a { 742 text-decoration: none; } 743 744.fc.fc-bootstrap3 a[data-goto]:hover { 745 text-decoration: underline; } 746 747.fc-bootstrap3 hr.fc-divider { 748 border-color: inherit; } 749 750.fc-bootstrap3 .fc-today.alert { 751 border-radius: 0; } 752 753/* Popover 754--------------------------------------------------------------------------------------------------*/ 755.fc-bootstrap3 .fc-popover .panel-body { 756 padding: 0; } 757 758/* TimeGrid Slats (lines that run horizontally) 759--------------------------------------------------------------------------------------------------*/ 760.fc-bootstrap3 .fc-time-grid .fc-slats table { 761 /* some themes have background color. see through to slats */ 762 background: none; } 763 764.fc.fc-bootstrap4 a { 765 text-decoration: none; } 766 767.fc.fc-bootstrap4 a[data-goto]:hover { 768 text-decoration: underline; } 769 770.fc-bootstrap4 hr.fc-divider { 771 border-color: inherit; } 772 773.fc-bootstrap4 .fc-today.alert { 774 border-radius: 0; } 775 776.fc-bootstrap4 a.fc-event:not([href]):not([tabindex]) { 777 color: #fff; } 778 779.fc-bootstrap4 .fc-popover.card { 780 position: absolute; } 781 782/* Popover 783--------------------------------------------------------------------------------------------------*/ 784.fc-bootstrap4 .fc-popover .card-body { 785 padding: 0; } 786 787/* TimeGrid Slats (lines that run horizontally) 788--------------------------------------------------------------------------------------------------*/ 789.fc-bootstrap4 .fc-time-grid .fc-slats table { 790 /* some themes have background color. see through to slats */ 791 background: none; } 792 793/* Toolbar 794--------------------------------------------------------------------------------------------------*/ 795.fc-toolbar { 796 text-align: center; } 797 798.fc-toolbar.fc-header-toolbar { 799 margin-bottom: 1em; } 800 801.fc-toolbar.fc-footer-toolbar { 802 margin-top: 1em; } 803 804.fc-toolbar .fc-left { 805 float: left; } 806 807.fc-toolbar .fc-right { 808 float: right; } 809 810.fc-toolbar .fc-center { 811 display: inline-block; } 812 813/* the things within each left/right/center section */ 814.fc .fc-toolbar > * > * { 815 /* extra precedence to override button border margins */ 816 float: left; 817 margin-left: .75em; } 818 819/* the first thing within each left/center/right section */ 820.fc .fc-toolbar > * > :first-child { 821 /* extra precedence to override button border margins */ 822 margin-left: 0; } 823 824/* title text */ 825.fc-toolbar h2 { 826 margin: 0; } 827 828/* button layering (for border precedence) */ 829.fc-toolbar button { 830 position: relative; } 831 832.fc-toolbar .fc-state-hover, 833.fc-toolbar .ui-state-hover { 834 z-index: 2; } 835 836.fc-toolbar .fc-state-down { 837 z-index: 3; } 838 839.fc-toolbar .fc-state-active, 840.fc-toolbar .ui-state-active { 841 z-index: 4; } 842 843.fc-toolbar button:focus { 844 z-index: 5; } 845 846/* View Structure 847--------------------------------------------------------------------------------------------------*/ 848/* undo twitter bootstrap's box-sizing rules. normalizes positioning techniques */ 849/* don't do this for the toolbar because we'll want bootstrap to style those buttons as some pt */ 850.fc-view-container *, 851.fc-view-container *:before, 852.fc-view-container *:after { 853 -webkit-box-sizing: content-box; 854 -moz-box-sizing: content-box; 855 box-sizing: content-box; } 856 857.fc-view, 858.fc-view > table { 859 /* so dragged elements can be above the view's main element */ 860 position: relative; 861 z-index: 1; } 862 863/* BasicView 864--------------------------------------------------------------------------------------------------*/ 865/* day row structure */ 866.fc-basicWeek-view .fc-content-skeleton, 867.fc-basicDay-view .fc-content-skeleton { 868 /* there may be week numbers in these views, so no padding-top */ 869 padding-bottom: 1em; 870 /* ensure a space at bottom of cell for user selecting/clicking */ } 871 872.fc-basic-view .fc-body .fc-row { 873 min-height: 4em; 874 /* ensure that all rows are at least this tall */ } 875 876/* a "rigid" row will take up a constant amount of height because content-skeleton is absolute */ 877.fc-row.fc-rigid { 878 overflow: hidden; } 879 880.fc-row.fc-rigid .fc-content-skeleton { 881 position: absolute; 882 top: 0; 883 left: 0; 884 right: 0; } 885 886/* week and day number styling */ 887.fc-day-top.fc-other-month { 888 opacity: 0.3; } 889 890.fc-basic-view .fc-week-number, 891.fc-basic-view .fc-day-number { 892 padding: 2px; } 893 894.fc-basic-view th.fc-week-number, 895.fc-basic-view th.fc-day-number { 896 padding: 0 2px; 897 /* column headers can't have as much v space */ } 898 899.fc-ltr .fc-basic-view .fc-day-top .fc-day-number { 900 float: right; } 901 902.fc-rtl .fc-basic-view .fc-day-top .fc-day-number { 903 float: left; } 904 905.fc-ltr .fc-basic-view .fc-day-top .fc-week-number { 906 float: left; 907 border-radius: 0 0 3px 0; } 908 909.fc-rtl .fc-basic-view .fc-day-top .fc-week-number { 910 float: right; 911 border-radius: 0 0 0 3px; } 912 913.fc-basic-view .fc-day-top .fc-week-number { 914 min-width: 1.5em; 915 text-align: center; 916 background-color: #f2f2f2; 917 color: #808080; } 918 919/* when week/day number have own column */ 920.fc-basic-view td.fc-week-number { 921 text-align: center; } 922 923.fc-basic-view td.fc-week-number > * { 924 /* work around the way we do column resizing and ensure a minimum width */ 925 display: inline-block; 926 min-width: 1.25em; } 927 928/* AgendaView all-day area 929--------------------------------------------------------------------------------------------------*/ 930.fc-agenda-view .fc-day-grid { 931 position: relative; 932 z-index: 2; 933 /* so the "more.." popover will be over the time grid */ } 934 935.fc-agenda-view .fc-day-grid .fc-row { 936 min-height: 3em; 937 /* all-day section will never get shorter than this */ } 938 939.fc-agenda-view .fc-day-grid .fc-row .fc-content-skeleton { 940 padding-bottom: 1em; 941 /* give space underneath events for clicking/selecting days */ } 942 943/* TimeGrid axis running down the side (for both the all-day area and the slot area) 944--------------------------------------------------------------------------------------------------*/ 945.fc .fc-axis { 946 /* .fc to overcome default cell styles */ 947 vertical-align: middle; 948 padding: 0 4px; 949 white-space: nowrap; } 950 951.fc-ltr .fc-axis { 952 text-align: right; } 953 954.fc-rtl .fc-axis { 955 text-align: left; } 956 957/* TimeGrid Structure 958--------------------------------------------------------------------------------------------------*/ 959.fc-time-grid-container, 960.fc-time-grid { 961 /* so slats/bg/content/etc positions get scoped within here */ 962 position: relative; 963 z-index: 1; } 964 965.fc-time-grid { 966 min-height: 100%; 967 /* so if height setting is 'auto', .fc-bg stretches to fill height */ } 968 969.fc-time-grid table { 970 /* don't put outer borders on slats/bg/content/etc */ 971 border: 0 hidden transparent; } 972 973.fc-time-grid > .fc-bg { 974 z-index: 1; } 975 976.fc-time-grid .fc-slats, 977.fc-time-grid > hr { 978 /* the <hr> AgendaView injects when grid is shorter than scroller */ 979 position: relative; 980 z-index: 2; } 981 982.fc-time-grid .fc-content-col { 983 position: relative; 984 /* because now-indicator lives directly inside */ } 985 986.fc-time-grid .fc-content-skeleton { 987 position: absolute; 988 z-index: 3; 989 top: 0; 990 left: 0; 991 right: 0; } 992 993/* divs within a cell within the fc-content-skeleton */ 994.fc-time-grid .fc-business-container { 995 position: relative; 996 z-index: 1; } 997 998.fc-time-grid .fc-bgevent-container { 999 position: relative; 1000 z-index: 2; } 1001 1002.fc-time-grid .fc-highlight-container { 1003 position: relative; 1004 z-index: 3; } 1005 1006.fc-time-grid .fc-event-container { 1007 position: relative; 1008 z-index: 4; } 1009 1010.fc-time-grid .fc-now-indicator-line { 1011 z-index: 5; } 1012 1013.fc-time-grid .fc-helper-container { 1014 /* also is fc-event-container */ 1015 position: relative; 1016 z-index: 6; } 1017 1018/* TimeGrid Slats (lines that run horizontally) 1019--------------------------------------------------------------------------------------------------*/ 1020.fc-time-grid .fc-slats td { 1021 height: 1.5em; 1022 border-bottom: 0; 1023 /* each cell is responsible for its top border */ } 1024 1025.fc-time-grid .fc-slats .fc-minor td { 1026 border-top-style: dotted; } 1027 1028/* TimeGrid Highlighting Slots 1029--------------------------------------------------------------------------------------------------*/ 1030.fc-time-grid .fc-highlight-container { 1031 /* a div within a cell within the fc-highlight-skeleton */ 1032 position: relative; 1033 /* scopes the left/right of the fc-highlight to be in the column */ } 1034 1035.fc-time-grid .fc-highlight { 1036 position: absolute; 1037 left: 0; 1038 right: 0; 1039 /* top and bottom will be in by JS */ } 1040 1041/* TimeGrid Event Containment 1042--------------------------------------------------------------------------------------------------*/ 1043.fc-ltr .fc-time-grid .fc-event-container { 1044 /* space on the sides of events for LTR (default) */ 1045 margin: 0 2.5% 0 2px; } 1046 1047.fc-rtl .fc-time-grid .fc-event-container { 1048 /* space on the sides of events for RTL */ 1049 margin: 0 2px 0 2.5%; } 1050 1051.fc-time-grid .fc-event, 1052.fc-time-grid .fc-bgevent { 1053 position: absolute; 1054 z-index: 1; 1055 /* scope inner z-index's */ } 1056 1057.fc-time-grid .fc-bgevent { 1058 /* background events always span full width */ 1059 left: 0; 1060 right: 0; } 1061 1062/* Generic Vertical Event 1063--------------------------------------------------------------------------------------------------*/ 1064.fc-v-event.fc-not-start { 1065 /* events that are continuing from another day */ 1066 /* replace space made by the top border with padding */ 1067 border-top-width: 0; 1068 padding-top: 1px; 1069 /* remove top rounded corners */ 1070 border-top-left-radius: 0; 1071 border-top-right-radius: 0; } 1072 1073.fc-v-event.fc-not-end { 1074 /* replace space made by the top border with padding */ 1075 border-bottom-width: 0; 1076 padding-bottom: 1px; 1077 /* remove bottom rounded corners */ 1078 border-bottom-left-radius: 0; 1079 border-bottom-right-radius: 0; } 1080 1081/* TimeGrid Event Styling 1082---------------------------------------------------------------------------------------------------- 1083We use the full "fc-time-grid-event" class instead of using descendants because the event won't 1084be a descendant of the grid when it is being dragged. 1085*/ 1086.fc-time-grid-event { 1087 overflow: hidden; 1088 /* don't let the bg flow over rounded corners */ } 1089 1090.fc-time-grid-event.fc-selected { 1091 /* need to allow touch resizers to extend outside event's bounding box */ 1092 /* common fc-selected styles hide the fc-bg, so don't need this anyway */ 1093 overflow: visible; } 1094 1095.fc-time-grid-event.fc-selected .fc-bg { 1096 display: none; 1097 /* hide semi-white background, to appear darker */ } 1098 1099.fc-time-grid-event .fc-content { 1100 overflow: hidden; 1101 /* for when .fc-selected */ } 1102 1103.fc-time-grid-event .fc-time, 1104.fc-time-grid-event .fc-title { 1105 padding: 0 1px; } 1106 1107.fc-time-grid-event .fc-time { 1108 font-size: .85em; 1109 white-space: nowrap; } 1110 1111/* short mode, where time and title are on the same line */ 1112.fc-time-grid-event.fc-short .fc-content { 1113 /* don't wrap to second line (now that contents will be inline) */ 1114 white-space: nowrap; } 1115 1116.fc-time-grid-event.fc-short .fc-time, 1117.fc-time-grid-event.fc-short .fc-title { 1118 /* put the time and title on the same line */ 1119 display: inline-block; 1120 vertical-align: top; } 1121 1122.fc-time-grid-event.fc-short .fc-time span { 1123 display: none; 1124 /* don't display the full time text... */ } 1125 1126.fc-time-grid-event.fc-short .fc-time:before { 1127 content: attr(data-start); 1128 /* ...instead, display only the start time */ } 1129 1130.fc-time-grid-event.fc-short .fc-time:after { 1131 content: "\A0-\A0"; 1132 /* seperate with a dash, wrapped in nbsp's */ } 1133 1134.fc-time-grid-event.fc-short .fc-title { 1135 font-size: .85em; 1136 /* make the title text the same size as the time */ 1137 padding: 0; 1138 /* undo padding from above */ } 1139 1140/* resizer (cursor device) */ 1141.fc-time-grid-event.fc-allow-mouse-resize .fc-resizer { 1142 left: 0; 1143 right: 0; 1144 bottom: 0; 1145 height: 8px; 1146 overflow: hidden; 1147 line-height: 8px; 1148 font-size: 11px; 1149 font-family: monospace; 1150 text-align: center; 1151 cursor: s-resize; } 1152 1153.fc-time-grid-event.fc-allow-mouse-resize .fc-resizer:after { 1154 content: "="; } 1155 1156/* resizer (touch device) */ 1157.fc-time-grid-event.fc-selected .fc-resizer { 1158 /* 10x10 dot */ 1159 border-radius: 5px; 1160 border-width: 1px; 1161 width: 8px; 1162 height: 8px; 1163 border-style: solid; 1164 border-color: inherit; 1165 background: #fff; 1166 /* horizontally center */ 1167 left: 50%; 1168 margin-left: -5px; 1169 /* center on the bottom edge */ 1170 bottom: -5px; } 1171 1172/* Now Indicator 1173--------------------------------------------------------------------------------------------------*/ 1174.fc-time-grid .fc-now-indicator-line { 1175 border-top-width: 1px; 1176 left: 0; 1177 right: 0; } 1178 1179/* arrow on axis */ 1180.fc-time-grid .fc-now-indicator-arrow { 1181 margin-top: -5px; 1182 /* vertically center on top coordinate */ } 1183 1184.fc-ltr .fc-time-grid .fc-now-indicator-arrow { 1185 left: 0; 1186 /* triangle pointing right... */ 1187 border-width: 5px 0 5px 6px; 1188 border-top-color: transparent; 1189 border-bottom-color: transparent; } 1190 1191.fc-rtl .fc-time-grid .fc-now-indicator-arrow { 1192 right: 0; 1193 /* triangle pointing left... */ 1194 border-width: 5px 6px 5px 0; 1195 border-top-color: transparent; 1196 border-bottom-color: transparent; } 1197 1198/* List View 1199--------------------------------------------------------------------------------------------------*/ 1200/* possibly reusable */ 1201.fc-event-dot { 1202 display: inline-block; 1203 width: 10px; 1204 height: 10px; 1205 border-radius: 5px; } 1206 1207/* view wrapper */ 1208.fc-rtl .fc-list-view { 1209 direction: rtl; 1210 /* unlike core views, leverage browser RTL */ } 1211 1212.fc-list-view { 1213 border-width: 1px; 1214 border-style: solid; } 1215 1216/* table resets */ 1217.fc .fc-list-table { 1218 table-layout: auto; 1219 /* for shrinkwrapping cell content */ } 1220 1221.fc-list-table td { 1222 border-width: 1px 0 0; 1223 padding: 8px 14px; } 1224 1225.fc-list-table tr:first-child td { 1226 border-top-width: 0; } 1227 1228/* day headings with the list */ 1229.fc-list-heading { 1230 border-bottom-width: 1px; } 1231 1232.fc-list-heading td { 1233 font-weight: bold; } 1234 1235.fc-ltr .fc-list-heading-main { 1236 float: left; } 1237 1238.fc-ltr .fc-list-heading-alt { 1239 float: right; } 1240 1241.fc-rtl .fc-list-heading-main { 1242 float: right; } 1243 1244.fc-rtl .fc-list-heading-alt { 1245 float: left; } 1246 1247/* event list items */ 1248.fc-list-item.fc-has-url { 1249 cursor: pointer; 1250 /* whole row will be clickable */ } 1251 1252.fc-list-item-marker, 1253.fc-list-item-time { 1254 white-space: nowrap; 1255 width: 1px; } 1256 1257/* make the dot closer to the event title */ 1258.fc-ltr .fc-list-item-marker { 1259 padding-right: 0; } 1260 1261.fc-rtl .fc-list-item-marker { 1262 padding-left: 0; } 1263 1264.fc-list-item-title a { 1265 /* every event title cell has an <a> tag */ 1266 text-decoration: none; 1267 color: inherit; } 1268 1269.fc-list-item-title a[href]:hover { 1270 /* hover effect only on titles with hrefs */ 1271 text-decoration: underline; } 1272 1273/* message when no events */ 1274.fc-list-empty-wrap2 { 1275 position: absolute; 1276 top: 0; 1277 left: 0; 1278 right: 0; 1279 bottom: 0; } 1280 1281.fc-list-empty-wrap1 { 1282 width: 100%; 1283 height: 100%; 1284 display: table; } 1285 1286.fc-list-empty { 1287 display: table-cell; 1288 vertical-align: middle; 1289 text-align: center; } 1290 1291.fc-unthemed .fc-list-empty { 1292 /* theme will provide own background */ 1293 background-color: #eee; } 1294