that wraps the table */ position: relative; z-index: 1; /* container inner z-index's because s can't do it */ } .fc .fc-daygrid-day.fc-day-today { background-color: var(--fc-today-bg-color, rgb(255 220 40 / 15%)); } .fc .fc-daygrid-day-frame { position: relative; min-height: 100%; /* seems to work better than `height` because sets height after rows/cells naturally do it */ } .fc { /* cell top */ } .fc .fc-daygrid-day-top { display: flex; flex-direction: row-reverse; } .fc .fc-day-other .fc-daygrid-day-top { opacity: 0.3; } .fc { /* day number (within cell top) */ } .fc .fc-daygrid-day-number { position: relative; z-index: 4; padding: 4px; } .fc { /* event container */ } .fc .fc-daygrid-day-events { margin-top: 1px; /* needs to be margin, not padding, so that available cell height can be computed */ } .fc { /* positioning for balanced vs natural */ } .fc .fc-daygrid-body-balanced .fc-daygrid-day-events { position: absolute; right: 0; left: 0; } .fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events { position: relative; /* for containing abs positioned event harnesses */ min-height: 2em; /* in addition to being a min-height during natural height, equalizes the heights a little bit */ } .fc .fc-daygrid-body-natural { /* can coexist with -unbalanced */ } .fc .fc-daygrid-body-natural .fc-daygrid-day-events { margin-bottom: 1em; } .fc { /* event harness */ } .fc .fc-daygrid-event-harness { position: relative; } .fc .fc-daygrid-event-harness-abs { position: absolute; top: 0; /* fallback coords for when cannot yet be computed */ right: 0; /* */ left: 0; /* */ } .fc .fc-daygrid-bg-harness { position: absolute; top: 0; bottom: 0; } .fc { /* bg content */ } .fc .fc-daygrid-day-bg .fc-non-business { z-index: 1; } .fc .fc-daygrid-day-bg .fc-bg-event { z-index: 2; } .fc .fc-daygrid-day-bg .fc-highlight { z-index: 3; } .fc { /* events */ } .fc .fc-daygrid-event { z-index: 6; margin-top: 1px; } .fc .fc-daygrid-event.fc-event-mirror { z-index: 7; } .fc { /* cell bottom (within day-events) */ } .fc .fc-daygrid-day-bottom { padding: 2px 3px 0; font-size: 0.85em; } .fc .fc-daygrid-day-bottom::before { display: table; clear: both; content: ""; } .fc .fc-daygrid-more-link { position: relative; z-index: 4; cursor: pointer; } .fc { /* week number (within frame) */ } .fc .fc-daygrid-week-number { position: absolute; top: 0; z-index: 5; min-width: 1.5em; padding: 2px; color: var(--fc-neutral-text-color, #808080); text-align: center; background-color: var(--fc-neutral-bg-color, rgb(208 208 208 / 30%)); } .fc { /* popover */ } .fc .fc-more-popover .fc-popover-body { min-width: 220px; padding: 10px; } .fc-direction-ltr .fc-daygrid-event.fc-event-start, .fc-direction-rtl .fc-daygrid-event.fc-event-end { margin-left: 2px; } .fc-direction-ltr .fc-daygrid-event.fc-event-end, .fc-direction-rtl .fc-daygrid-event.fc-event-start { margin-right: 2px; } .fc-direction-ltr .fc-daygrid-week-number { left: 0; border-radius: 0 0 3px; } .fc-direction-rtl .fc-daygrid-week-number { right: 0; border-radius: 0 0 0 3px; } .fc-liquid-hack .fc-daygrid-day-frame { position: static; /* will cause inner absolute stuff to expand to */ } .fc-daygrid-event { /* make root-level, because will be dragged-and-dropped outside of a component root */ position: relative; /* for z-indexes assigned later */ font-size: var(--fc-small-font-size, 0.85em); white-space: nowrap; border-radius: 3px; /* dot event needs this to when selected */ } /* --- the rectangle ("block") style of event --- */ .fc-daygrid-block-event .fc-event-time { font-weight: bold; } .fc-daygrid-block-event .fc-event-time, .fc-daygrid-block-event .fc-event-title { padding: 1px; } /* --- the dot style of event --- */ .fc-daygrid-dot-event { display: flex; align-items: center; padding: 2px 0; } .fc-daygrid-dot-event .fc-event-title { flex-grow: 1; flex-shrink: 1; min-width: 0; /* important for allowing to shrink all the way */ overflow: hidden; font-weight: bold; } .fc-daygrid-dot-event:hover, .fc-daygrid-dot-event.fc-event-mirror { background: rgb(0 0 0 / 10%); } .fc-daygrid-dot-event.fc-event-selected::before { /* expand hit area */ top: -10px; bottom: -10px; } .fc-daygrid-event-dot { /* the actual dot */ box-sizing: content-box; width: 0; height: 0; margin: 0 4px; border: calc(var(--fc-daygrid-event-dot-width, 8px) / 2) solid var(--fc-event-border-color, #3788d8); border-radius: calc(var(--fc-daygrid-event-dot-width, 8px) / 2); } /* --- spacing between time and title --- */ .fc-direction-ltr .fc-daygrid-event .fc-event-time { margin-right: 3px; } .fc-direction-rtl .fc-daygrid-event .fc-event-time { margin-left: 3px; } /* A VERTICAL event */ .fc-v-event { /* allowed to be top-level */ display: block; background-color: var(--fc-event-bg-color, #3788d8); border: 1px solid var(--fc-event-border-color, #3788d8); } .fc-v-event .fc-event-main { height: 100%; color: var(--fc-event-text-color, #fff); } .fc-v-event .fc-event-main-frame { display: flex; flex-direction: column; height: 100%; } .fc-v-event .fc-event-time { flex-grow: 0; flex-shrink: 0; max-height: 100%; overflow: hidden; } .fc-v-event .fc-event-title-container { /* a container for the sticky cushion */ flex-grow: 1; flex-shrink: 1; min-height: 0; /* important for allowing to shrink all the way */ } .fc-v-event .fc-event-title { /* will have fc-sticky on it */ top: 0; bottom: 0; max-height: 100%; /* clip overflow */ overflow: hidden; } .fc-v-event:not(.fc-event-start) { border-top-width: 0; border-top-left-radius: 0; border-top-right-radius: 0; } .fc-v-event:not(.fc-event-end) { border-bottom-width: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .fc-v-event.fc-event-selected::before { right: -10px; /* expand hit area */ left: -10px; } .fc-v-event { /* resizer (mouse AND touch) */ } .fc-v-event .fc-event-resizer-start { cursor: n-resize; } .fc-v-event .fc-event-resizer-end { cursor: s-resize; } .fc-v-event { /* resizer for MOUSE */ } .fc-v-event:not(.fc-event-selected) .fc-event-resizer { right: 0; left: 0; height: var(--fc-event-resizer-thickness, 8px); } .fc-v-event:not(.fc-event-selected) .fc-event-resizer-start { top: calc(var(--fc-event-resizer-thickness, 8px) / -2); } .fc-v-event:not(.fc-event-selected) .fc-event-resizer-end { bottom: calc(var(--fc-event-resizer-thickness, 8px) / -2); } .fc-v-event { /* resizer for TOUCH (when event is "selected") */ } .fc-v-event.fc-event-selected .fc-event-resizer { left: 50%; margin-left: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2); } .fc-v-event.fc-event-selected .fc-event-resizer-start { top: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2); } .fc-v-event.fc-event-selected .fc-event-resizer-end { bottom: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2); } .fc .fc-timegrid .fc-daygrid-body { /* the all-day daygrid within the timegrid view */ z-index: 2; /* put above the timegrid-body so that more-popover is above everything. TODO: better solution */ } .fc .fc-timegrid-divider { padding: 0 0 2px; /* browsers get confused when you set height. use padding instead */ } .fc .fc-timegrid-body { position: relative; z-index: 1; /* scope the z-indexes of slots and cols */ min-height: 100%; /* fill height always, even when slat table doesn't grow */ } .fc .fc-timegrid-axis-chunk { /* for advanced ScrollGrid */ position: relative; /* offset parent for now-indicator-container */ } .fc .fc-timegrid-axis-chunk > table { position: relative; z-index: 1; /* above the now-indicator-container */ } .fc .fc-timegrid-slots { position: relative; z-index: 1; } .fc .fc-timegrid-slot { /* a */ height: 1.5em; border-bottom: 0; /* each cell owns its top border */ } .fc .fc-timegrid-slot:empty::before { content: "\00a0"; /* make sure there's at least an empty space to create height for height syncing */ } .fc .fc-timegrid-slot-minor { border-top-style: dotted; } .fc .fc-timegrid-slot-label-cushion { display: inline-block; white-space: nowrap; } .fc .fc-timegrid-slot-label { vertical-align: middle; /* vertical align the slots */ } .fc { /* slots AND axis cells (top-left corner of view including the "all-day" text) */ } .fc .fc-timegrid-axis-cushion, .fc .fc-timegrid-slot-label-cushion { padding: 0 4px; } .fc { /* axis cells (top-left corner of view including the "all-day" text) */ /* vertical align is more complicated, uses flexbox */ } .fc .fc-timegrid-axis-frame-liquid { height: 100%; /* will need liquid-hack in FF */ } .fc .fc-timegrid-axis-frame { display: flex; align-items: center; /* vertical align */ justify-content: flex-end; /* horizontal align. matches text-align below */ overflow: hidden; } .fc .fc-timegrid-axis-cushion { flex-shrink: 0; /* allows text to expand how it normally would, regardless of constrained width */ max-width: 60px; /* limits the width of the "all-day" text */ } .fc-direction-ltr .fc-timegrid-slot-label-frame { text-align: right; } .fc-direction-rtl .fc-timegrid-slot-label-frame { text-align: left; } .fc-liquid-hack .fc-timegrid-axis-frame-liquid { position: absolute; inset: 0; height: auto; } .fc .fc-timegrid-col.fc-day-today { background-color: var(--fc-today-bg-color, rgb(255 220 40 / 15%)); } .fc .fc-timegrid-col-frame { position: relative; min-height: 100%; /* liquid-hack is below */ } .fc-media-screen.fc-liquid-hack .fc-timegrid-col-frame { position: absolute; inset: 0; height: auto; } .fc-media-screen .fc-timegrid-cols { position: absolute; /* no z-index. children will decide and go above slots */ inset: 0; } .fc-media-screen .fc-timegrid-cols > table { height: 100%; } .fc-media-screen .fc-timegrid-col-bg, .fc-media-screen .fc-timegrid-col-events, .fc-media-screen .fc-timegrid-now-indicator-container { position: absolute; top: 0; right: 0; left: 0; } .fc { /* bg */ } .fc .fc-timegrid-col-bg { z-index: 2; /* TODO: kill */ } .fc .fc-timegrid-col-bg .fc-non-business { z-index: 1; } .fc .fc-timegrid-col-bg .fc-bg-event { z-index: 2; } .fc .fc-timegrid-col-bg .fc-highlight { z-index: 3; } .fc .fc-timegrid-bg-harness { position: absolute; /* top/bottom will be set by JS */ right: 0; left: 0; } .fc { /* fg events */ /* (the mirror segs are put into a separate container with same classname, */ /* and they must be after the normal seg container to appear at a higher z-index) */ } .fc .fc-timegrid-col-events { z-index: 3; /* child event segs have z-indexes that are scoped within this div */ } .fc { /* now indicator */ } .fc .fc-timegrid-now-indicator-container { bottom: 0; overflow: hidden; /* don't let overflow of lines/arrows cause unnecessary scrolling */ /* z-index is set on the individual elements */ } .fc-direction-ltr .fc-timegrid-col-events { margin: 0 2.5% 0 2px; } .fc-direction-rtl .fc-timegrid-col-events { margin: 0 2px 0 2.5%; } .fc-timegrid-event-harness { position: absolute; /* top/left/right/bottom will all be set by JS */ } .fc-timegrid-event-harness > .fc-timegrid-event { position: absolute; /* absolute WITHIN the harness */ inset: 0; /* for when not yet positioned */ /* " */ } .fc-timegrid-event-harness-inset .fc-timegrid-event, .fc-timegrid-event.fc-event-mirror, .fc-timegrid-more-link { box-shadow: 0 0 0 1px var(--fc-page-bg-color, #fff); } .fc-timegrid-event, .fc-timegrid-more-link { /* events need to be root */ font-size: var(--fc-small-font-size, 0.85em); border-radius: 3px; } .fc-timegrid-event { /* events need to be root */ margin-bottom: 1px; /* give some space from bottom */ } .fc-timegrid-event .fc-event-main { padding: 1px 1px 0; } .fc-timegrid-event .fc-event-time { margin-bottom: 1px; font-size: var(--fc-small-font-size, 0.85em); white-space: nowrap; } .fc-timegrid-event-short .fc-event-main-frame { flex-direction: row; overflow: hidden; } .fc-timegrid-event-short .fc-event-time::after { content: "\00a0-\00a0"; /* dash surrounded by non-breaking spaces */ } .fc-timegrid-event-short .fc-event-title { font-size: var(--fc-small-font-size, 0.85em); } .fc-timegrid-more-link { /* does NOT inherit from fc-timegrid-event */ position: absolute; z-index: 9999; /* hack */ margin-bottom: 1px; /* match space below fc-timegrid-event */ color: var(--fc-more-link-text-color, inherit); cursor: pointer; background: var(--fc-more-link-bg-color, #d0d0d0); } .fc-timegrid-more-link-inner { /* has fc-sticky */ top: 0; padding: 3px 2px; } .fc-direction-ltr .fc-timegrid-more-link { right: 0; } .fc-direction-rtl .fc-timegrid-more-link { left: 0; } .fc { /* line */ } .fc .fc-timegrid-now-indicator-line { position: absolute; right: 0; left: 0; z-index: 4; border-color: var(--fc-now-indicator-color, red); border-style: solid; border-width: 1px 0 0; } .fc { /* arrow */ } .fc .fc-timegrid-now-indicator-arrow { position: absolute; z-index: 4; margin-top: -5px; /* vertically center on top coordinate */ border-color: var(--fc-now-indicator-color, red); border-style: solid; } .fc-direction-ltr .fc-timegrid-now-indicator-arrow { left: 0; /* triangle pointing right. TODO: mixin */ border-width: 5px 0 5px 6px; border-top-color: transparent; border-bottom-color: transparent; } .fc-direction-rtl .fc-timegrid-now-indicator-arrow { right: 0; /* triangle pointing left. TODO: mixin */ border-width: 5px 6px 5px 0; border-top-color: transparent; border-bottom-color: transparent; } :root { --fc-list-event-dot-width: 10px; --fc-list-event-hover-bg-color: #f5f5f5; } .fc-theme-standard .fc-list { border: 1px solid var(--fc-border-color, #ddd); } .fc { /* message when no events */ } .fc .fc-list-empty { display: flex; align-items: center; /* vertically aligns fc-list-empty-inner */ justify-content: center; height: 100%; background-color: var(--fc-neutral-bg-color, rgb(208 208 208 / 30%)); } .fc .fc-list-empty-cushion { margin: 5em 0; } .fc { /* table within the scroller */ /* ---------------------------------------------------------------------------------------------------- */ } .fc .fc-list-table { width: 100%; border-style: hidden; /* kill outer border on theme */ } .fc .fc-list-table tr > * { border-right: 0; border-left: 0; } .fc .fc-list-sticky .fc-list-day > * { /* the cells */ position: sticky; top: 0; background: var(--fc-page-bg-color, #fff); /* for when headers are styled to be transparent and sticky */ } .fc { /* only exists for aria reasons, hide for non-screen-readers */ } .fc .fc-list-table thead { position: absolute; left: -10000px; } .fc { /* the table's border-style:hidden gets confused by hidden thead. force-hide top border of first cell */ } .fc .fc-list-table tbody > tr:first-child th { border-top: 0; } .fc .fc-list-table th { padding: 0; /* uses an inner-wrapper instead... */ } .fc .fc-list-table td, .fc .fc-list-day-cushion { padding: 8px 14px; } .fc { /* date heading rows */ /* ---------------------------------------------------------------------------------------------------- */ } .fc .fc-list-day-cushion::after { display: table; /* clear floating */ clear: both; content: ""; } .fc-theme-standard .fc-list-day-cushion { background-color: var(--fc-neutral-bg-color, rgb(208 208 208 / 30%)); } .fc-direction-ltr .fc-list-day-text, .fc-direction-rtl .fc-list-day-side-text { float: left; } .fc-direction-ltr .fc-list-day-side-text, .fc-direction-rtl .fc-list-day-text { float: right; } /* make the dot closer to the event title */ .fc-direction-ltr .fc-list-table .fc-list-event-graphic { padding-right: 0; } .fc-direction-rtl .fc-list-table .fc-list-event-graphic { padding-left: 0; } .fc .fc-list-event.fc-event-forced-url { cursor: pointer; /* whole row will seem clickable */ } .fc .fc-list-event:hover td { background-color: var(--fc-list-event-hover-bg-color, #f5f5f5); } .fc { /* shrink certain cols */ } .fc .fc-list-event-graphic, .fc .fc-list-event-time { width: 1px; white-space: nowrap; } .fc .fc-list-event-dot { box-sizing: content-box; display: inline-block; width: 0; height: 0; border: calc(var(--fc-list-event-dot-width, 10px) / 2) solid var(--fc-event-border-color, #3788d8); border-radius: calc(var(--fc-list-event-dot-width, 10px) / 2); } .fc { /* reset styling */ } .fc .fc-list-event-title a { color: inherit; text-decoration: none; } .fc { /* underline link when hovering over any part of row */ } .fc .fc-list-event.fc-event-forced-url:hover a { text-decoration: underline; } .fc-theme-bootstrap a:not([href]) { color: inherit; /* natural color for navlinks */ } .fc-theme-bootstrap5 a:not([href]) { color: inherit; text-decoration: inherit; } .fc-theme-bootstrap5 .fc-list, .fc-theme-bootstrap5 .fc-scrollgrid, .fc-theme-bootstrap5 td, .fc-theme-bootstrap5 th { border: 1px solid var(--bs-gray-400); } .fc-theme-bootstrap5 { /* HACK: reapply core styles after highe-precedence border statement above */ } .fc-theme-bootstrap5 .fc-scrollgrid { border-right-width: 0; border-bottom-width: 0; } .fc-theme-bootstrap5-shaded { background-color: var(--bs-gray-200); } .fc .fc-event, .fc .fc-scrollgrid table tr { -moz-column-break-inside: avoid; break-inside: avoid; } .fc-media-print { display: block; /* undo flexbox. FF doesn't know how to flow */ max-width: 100%; /* width will be hardcoded too */ } .fc-media-print .fc-timegrid-slots, .fc-media-print .fc-timegrid-axis-chunk, .fc-media-print .fc-timeline-slots, .fc-media-print .fc-non-business, .fc-media-print .fc-bg-event { display: none; } .fc-media-print .fc-toolbar button, .fc-media-print .fc-h-event, .fc-media-print .fc-v-event { color: #000 !important; background: #fff !important; } .fc-media-print .fc-event, .fc-media-print .fc-event-main { /* often controls the text-color */ color: #000 !important; } .fc-media-print .fc-timegrid-event { margin: 0.5em 0; } .fc .fc-timeline-body { position: relative; z-index: 1; /* scope slots, bg, etc */ min-height: 100%; } /* vertical slots in both the header AND the body */ .fc .fc-timeline-slots { position: absolute; top: 0; bottom: 0; z-index: 1; } .fc .fc-timeline-slots > table { height: 100%; } .fc { /* border for both header AND body cells */ } .fc .fc-timeline-slot-minor { border-style: dotted; } .fc { /* header cells (aka "label") */ } .fc .fc-timeline-slot-frame { display: flex; align-items: center; /* vertical align */ justify-content: center; /* horizontal align */ } .fc .fc-timeline-header-row-chrono { /* a row of times */ } .fc .fc-timeline-header-row-chrono .fc-timeline-slot-frame { justify-content: flex-start; /* horizontal align left or right */ } .fc .fc-timeline-header-row:last-child { /* guaranteed NOT to have sticky elements */ } .fc .fc-timeline-header-row:last-child .fc-timeline-slot-frame { /* so text doesn't bleed out and cause extra scroll */ /* (won't work with sticky elements) */ overflow: hidden; } .fc .fc-timeline-slot-cushion { padding: 4px 5px; /* TODO: unify with fc-col-header? */ font-size: 1em; white-space: nowrap; } .fc { /* NOTE: how does the top row of cells get horizontally centered? */ /* for the non-chrono-row, the fc-sticky system looks for text-align center, */ /* and it's a fluke that the default browser stylesheet already does this for */ /* TODO: have StickyScrolling look at natural left coord to detect centeredness. */ } /* only owns one side, so can do dotted */ .fc-direction-ltr .fc-timeline-slot { border-right: 0 !important; } .fc-direction-rtl .fc-timeline-slot { border-left: 0 !important; } .fc .fc-timeline-now-indicator-container { position: absolute; inset: 0; z-index: 4; width: 0; } .fc .fc-timeline-now-indicator-arrow, .fc .fc-timeline-now-indicator-line { position: absolute; top: 0; border-color: var(--fc-now-indicator-color, red); border-style: solid; } .fc .fc-timeline-now-indicator-arrow { margin: 0 -6px; /* 5, then one more to counteract scroller's negative margins */ /* triangle pointing down. TODO: mixin */ border-width: 6px 5px 0; border-right-color: transparent; border-left-color: transparent; } .fc .fc-timeline-now-indicator-line { bottom: 0; margin: 0 -1px; /* counteract scroller's negative margins */ border-width: 0 0 0 1px; } .fc { /* container */ } .fc .fc-timeline-events { position: relative; z-index: 3; width: 0; /* for event positioning. will end up on correct side based on dir */ } .fc { /* harness */ } .fc .fc-timeline-event-harness, .fc .fc-timeline-more-link { position: absolute; top: 0; /* for when when top can't be computed yet */ /* JS will set tht left/right */ } /* z-index, scoped within fc-timeline-events */ .fc-timeline-event { z-index: 1; } .fc-timeline-event.fc-event-mirror { z-index: 2; } .fc-timeline-event { position: relative; /* contains things. TODO: make part of fc-h-event and fc-v-event */ display: flex; /* for v-aligning start/end arrows and making fc-event-main stretch all the way */ align-items: center; padding: 2px 1px; margin-bottom: 1px; font-size: var(--fc-small-font-size, 0.85em); border-radius: 0; /* time and title spacing */ /* ---------------------------------------------------------------------------------------------------- */ } .fc-timeline-event .fc-event-main { flex-grow: 1; flex-shrink: 1; min-width: 0; /* important for allowing to shrink all the way */ } .fc-timeline-event .fc-event-time { font-weight: bold; } .fc-timeline-event .fc-event-time, .fc-timeline-event .fc-event-title { /* white-space: nowrap; */ padding: 0 2px; } /* move 1px away from slot line */ .fc-direction-ltr .fc-timeline-event.fc-event-end, .fc-direction-ltr .fc-timeline-more-link { margin-right: 1px; margin-left: 1px; } .fc-direction-rtl .fc-timeline-event.fc-event-end, .fc-direction-rtl .fc-timeline-more-link { margin-right: 1px; margin-left: 1px; } /* make event beefier when overlap not allowed */ .fc-timeline-overlap-disabled .fc-timeline-event { padding-top: 5px; padding-bottom: 5px; margin-bottom: 0; } /* arrows indicating the event continues into past/future */ /* ---------------------------------------------------------------------------------------------------- */ /* part of the flexbox flow */ .fc-timeline-event:not(.fc-event-start)::before, .fc-timeline-event:not(.fc-event-end)::after { flex-grow: 0; flex-shrink: 0; /* triangle. TODO: mixin */ width: 0; height: 0; margin: 0 1px; content: ""; border: 5px solid #000; /* TODO: var */ border-top-color: transparent; border-bottom-color: transparent; opacity: 0.5; } /* pointing left */ .fc-direction-ltr .fc-timeline-event:not(.fc-event-start)::before, .fc-direction-rtl .fc-timeline-event:not(.fc-event-end)::after { border-left: 0; } /* pointing right */ .fc-direction-ltr .fc-timeline-event:not(.fc-event-end)::after, .fc-direction-rtl .fc-timeline-event:not(.fc-event-start)::before { border-right: 0; } /* +more events indicator */ /* ---------------------------------------------------------------------------------------------------- */ .fc-timeline-more-link { padding: 1px; font-size: var(--fc-small-font-size, 0.85em); color: var(--fc-more-link-text-color, inherit); cursor: pointer; background: var(--fc-more-link-bg-color, #d0d0d0); } .fc-timeline-more-link-inner { /* has fc-sticky */ right: 0; left: 0; display: inline-block; padding: 2px; } .fc .fc-timeline-bg { /* a container for bg content */ position: absolute; inset: 0; /* will take precedence when RTL */ /* TODO: kill */ /* will take precedence when LTR */ z-index: 2; width: 0; } .fc .fc-timeline-bg .fc-non-business { z-index: 1; } .fc .fc-timeline-bg .fc-bg-event { z-index: 2; } .fc .fc-timeline-bg .fc-highlight { z-index: 3; } .fc .fc-timeline-bg-harness { position: absolute; top: 0; bottom: 0; } .fc .fc-resource-timeline-divider { width: 3px; /* important to have width to shrink this cell. no cross-browser problems */ cursor: col-resize; } .fc .fc-resource-group { /* make it look less like a */ font-weight: inherit; text-align: inherit; } .fc { /* will match horizontal groups in the datagrid AND group lanes in the timeline area */ } .fc .fc-resource-timeline .fc-resource-group:not([rowspan]) { background: var(--fc-neutral-bg-color, rgb(208 208 208 / 30%)); } .fc .fc-timeline-lane-frame { position: relative; /* contains the fc-timeline-bg container, which liquidly expands */ /* the height is explicitly set by row-height-sync */ } .fc .fc-timeline-overlap-enabled .fc-timeline-lane-frame .fc-timeline-events { /* has height set on it */ box-sizing: content-box; /* padding no longer part of height */ padding-bottom: 10px; /* give extra spacing underneath for selecting */ } /* hack to make bg expand to lane's full height in resource-timeline with expandRows (#6134) */ .fc-timeline-body-expandrows td.fc-timeline-lane { position: relative; } .fc-timeline-body-expandrows .fc-timeline-lane-frame { position: static; } /* the "frame" */ .fc-datagrid-cell-frame-liquid { height: 100%; /* needs liquid hack */ } .fc-liquid-hack .fc-datagrid-cell-frame-liquid { position: absolute; inset: 0; height: auto; } .fc { /* the "frame" in a HEADER */ /* needs to position the column resizer */ /* needs to vertically center content */ } .fc .fc-datagrid-header .fc-datagrid-cell-frame { position: relative; /* for resizer */ display: flex; align-items: center; /* vertical align */ justify-content: flex-start; /* horizontal align (natural left/right) */ } .fc { /* the column resizer (only in HEADER) */ } .fc .fc-datagrid-cell-resizer { position: absolute; top: 0; bottom: 0; z-index: 1; width: 5px; cursor: col-resize; } .fc { /* the cushion */ } .fc .fc-datagrid-cell-cushion { padding: 8px; overflow: hidden; /* problem for col resizer :( */ white-space: nowrap; } .fc { /* expander icons */ } .fc .fc-datagrid-expander { cursor: pointer; opacity: 0.65; } .fc .fc-datagrid-expander .fc-icon { /* the expander and spacers before the expander */ display: inline-block; width: 1em; /* ensure constant width, esp for empty icons */ } .fc .fc-datagrid-expander-placeholder { cursor: auto; } .fc .fc-resource-timeline-flat .fc-datagrid-expander-placeholder { display: none; } .fc-direction-ltr .fc-datagrid-cell-resizer { right: -3px; } .fc-direction-rtl .fc-datagrid-cell-resizer { left: -3px; } .fc-direction-ltr .fc-datagrid-expander { margin-right: 3px; } .fc-direction-rtl .fc-datagrid-expander { margin-left: 3px; }