2 * FullCalendar v3.0.1 Print Stylesheet
3 * Docs & License: http://fullcalendar.io/
8 * Include this stylesheet on your page to get a more printer-friendly calendar.
9 * When including this stylesheet, use the media='print' attribute of the <link> tag.
10 * Make sure to include this stylesheet IN ADDITION to the regular fullcalendar.css.
14 max-width: 100% !important;
18 /* Global Event Restyling
19 --------------------------------------------------------------------------------------------------*/
22 background: #fff !important;
23 color: #000 !important;
24 page-break-inside: avoid;
27 .fc-event .fc-resizer {
32 /* Table & Day-Row Restyling
33 --------------------------------------------------------------------------------------------------*/
41 border-color: #ccc !important;
42 background: #fff !important;
45 /* kill the overlaid, absolutely-positioned components */
49 .fc-highlight-skeleton,
51 /* for timegrid. within cells within table skeletons... */
52 .fc-bgevent-container,
53 .fc-business-container,
54 .fc-highlight-container,
55 .fc-helper-container {
59 /* don't force a min-height on rows (for DayGrid) */
61 height: auto !important; /* undo height that JS set in distributeHeight */
62 min-height: 0 !important; /* undo the min-height from each view's specific stylesheet */
65 .fc tbody .fc-row .fc-content-skeleton {
66 position: static; /* undo .fc-rigid */
67 padding-bottom: 0 !important; /* use a more border-friendly method for this... */
70 .fc tbody .fc-row .fc-content-skeleton tbody tr:last-child td { /* only works in newer browsers */
71 padding-bottom: 1em; /* ...gives space within the skeleton. also ensures min height in a way */
74 .fc tbody .fc-row .fc-content-skeleton table {
75 /* provides a min-height for the row, but only effective for IE, which exaggerates this value,
76 making it look more like 3em. for other browers, it will already be this tall */
81 /* Undo month-view event limiting. Display all events and hide the "more" links
82 --------------------------------------------------------------------------------------------------*/
86 display: none !important;
90 display: table-row !important;
94 display: table-cell !important;
98 display: none; /* never display the "more.." popover in print mode */
102 /* TimeGrid Restyling
103 --------------------------------------------------------------------------------------------------*/
105 /* undo the min-height 100% trick used to fill the container's height */
107 min-height: 0 !important;
110 /* don't display the side axis at all ("all-day" and time cells) */
111 .fc-agenda-view .fc-axis {
115 /* don't display the horizontal lines */
117 .fc-time-grid hr { /* this hr is used when height is underused and needs to be filled */
118 display: none !important; /* important overrides inline declaration */
121 /* let the container that holds the events be naturally positioned and create real height */
122 .fc-time-grid .fc-content-skeleton {
126 /* in case there are no events, we still want some height */
127 .fc-time-grid .fc-content-skeleton table {
131 /* kill the horizontal spacing made by the event container. event margins will be done below */
132 .fc-time-grid .fc-event-container {
133 margin: 0 !important;
137 /* TimeGrid *Event* Restyling
138 --------------------------------------------------------------------------------------------------*/
140 /* naturally position events, vertically stacking them */
141 .fc-time-grid .fc-event {
142 position: static !important;
143 margin: 3px 2px !important;
146 /* for events that continue to a future day, give the bottom border back */
147 .fc-time-grid .fc-event.fc-not-end {
148 border-bottom-width: 1px !important;
151 /* indicate the event continues via "..." text */
152 .fc-time-grid .fc-event.fc-not-end:after {
156 /* for events that are continuations from previous days, give the top border back */
157 .fc-time-grid .fc-event.fc-not-start {
158 border-top-width: 1px !important;
161 /* indicate the event is a continuation via "..." text */
162 .fc-time-grid .fc-event.fc-not-start:before {
168 /* undo a previous declaration and let the time text span to a second line */
169 .fc-time-grid .fc-event .fc-time {
170 white-space: normal !important;
173 /* hide the the time that is normally displayed... */
174 .fc-time-grid .fc-event .fc-time span {
178 /* ...replace it with a more verbose version (includes AM/PM) stored in an html attribute */
179 .fc-time-grid .fc-event .fc-time:after {
180 content: attr(data-full);
184 /* Vertical Scroller & Containers
185 --------------------------------------------------------------------------------------------------*/
187 /* kill the scrollbars and allow natural height */
189 .fc-day-grid-container, /* these divs might be assigned height, which we need to cleared */
190 .fc-time-grid-container { /* */
191 overflow: visible !important;
192 height: auto !important;
195 /* kill the horizontal border/padding used to compensate for scrollbars */
197 border: 0 !important;
198 margin: 0 !important;
203 --------------------------------------------------------------------------------------------------*/
207 display: none; /* don't display any button-related controls */