%PDF- %PDF-
Direktori : /www/varak.net/nextcloud.varak.net/apps_old/apps/calendar/css/ |
Current File : //www/varak.net/nextcloud.varak.net/apps_old/apps/calendar/css/fullcalendar.scss |
/** * Calendar App * * @copyright 2020 Georg Ehrke <oc.list@georgehrke.com> * * @author Georg Ehrke * @author René Gieling <github@dartcafe.de> * * This library is free software; you can redistribute it and/or * modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE * License as published by the Free Software Foundation; either * version 3 of the License, or any later version. * * This library is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU AFFERO GENERAL PUBLIC LICENSE for more details. * * You should have received a copy of the GNU Affero General Public * License along with this library. If not, see <http://www.gnu.org/licenses/>. * */ /** Override some FullCalendar CSS vars: */ .fc { --fc-small-font-size: 0.875em; --fc-page-bg-color: var(--color-main-background) !important; --fc-neutral-bg-color: var(--color-background-dark) !important; --fc-neutral-text-color: var(--color-text-lighter) !important; --fc-border-color: var(--color-border) !important; --fc-daygrid-event-dot-width: 10px !important; --fc-event-bg-color: var(--color-primary-element); --fc-event-border-color: var(--color-primary-element-text); --fc-event-text-color: var(--color-primary-element-text); --fc-event-selected-overlay-color: var(--color-box-shadow); --fc-event-resizer-thickness: 8px; --fc-event-resizer-dot-total-width: 8px; --fc-event-resizer-dot-border-width: 1px; --fc-non-business-color: var(--color-background-dark); --fc-bg-event-color: var(--color-primary-element); --fc-bg-event-opacity: 0.3; --fc-highlight-color: rgba(188, 232, 241, 0.3); // TODO - use some color css var from us? --fc-today-bg-color: var(--color-main-background) !important; --fc-now-indicator-color: red; --fc-list-event-hover-bg-color: var(--color-background-hover) !important; } .fc { font-family: var(--font-face) !important; } // ### FullCalendar Grid adjustments // Make the labels lighter .fc-timegrid-axis-frame, .fc-timegrid-slot-label, .fc-col-header-cell a { color: var(--color-text-lighter) !important; } // Remove dotted half-lines .fc .fc-timegrid-slot-minor { border-top-style: none !important; } // Center the date in month view .fc-daygrid-day-top { justify-content: center; } // Override Nextcloud styles which highlight table rows on hover .fc-state-highlight.fc-day-number, .fc tbody tr, .fc tbody tr:hover, .fc tbody tr:focus { background: inherit !important; } // Today highlighting .fc-day-today { &.fc-col-header-cell { a, span { padding: 2px 6px; font-weight: bold; background-color: var(--color-primary-element); color: var(--color-primary-element-text) !important; border-radius: var(--border-radius-pill); } } .fc-event { box-shadow: 0px 0px 0px 1px var(--color-primary-element-light) !important; } .fc-daygrid-day-top { .fc-daygrid-day-number { margin: 4px; width: 24px; height: 24px; text-align: center; font-weight: bold !important; padding: 0 !important; background: var(--color-primary-element); color: var(--color-primary-element-text); border-radius: 50%; } } } // Fix list table .fc-list-table td { white-space: normal; word-break: break-word; } // Prevent events overlapping over day header .fc .fc-list-sticky .fc-list-day > * { z-index: 1; } // Padding to account for left navigation toggle .fc-list-table .fc-list-day-cushion { padding-left: calc(var(--default-clickable-area) + var(--default-grid-baseline) * 2); } // highlight current day (exclude day view) .fc-timeGridWeek-view, .fc-dayGridMonth-view { .fc-col-header-cell.fc-day-today, .fc-daygrid-day.fc-day-today, .fc-timegrid-col.fc-day-today { background-color: var(--color-primary-element-light) !important; background-clip: padding-box; } } // emphasize current month in month view .fc-daygrid-day.fc-day.fc-day-other, .fc .fc-daygrid-day.fc-day-today.fc-day-other { background-color: var(--color-background-dark) !important; background-clip: padding-box; border: 1px solid var(--color-background-darker); .fc-daygrid-day-top { opacity: 0.6; } } // ### FullCalendar Event adjustments .fc-event { padding-left: 3px; &.fc-event-nc-task-completed, &.fc-event-nc-tentative, &.fc-event-nc-cancelled { opacity: .5; } &.fc-event-nc-task-completed, &.fc-event-nc-cancelled { .fc-event-title, .fc-list-event-title { text-decoration: line-through !important; } } .fc-event-title { text-overflow: ellipsis; } // Reminder icon on events with alarms set .fc-event-nc-alarms { .icon-event-reminder { background-color: inherit; background-position: right; position: absolute; top: 0; right: 0; &--light { background-image: var(--icon-calendar-reminder-fffffe) } &--dark { background-image: var(--icon-calendar-reminder-000001) } } } // Checkboxes for Tasks .fc-event-title-container { display: flex; align-content: center; .fc-event-title-checkbox { margin: 4px 4px 0 0; line-height: 1; } } .fc-list-event-checkbox { margin: 2px 4px 0 -2px; line-height: 1; } .fc-daygrid-event-checkbox { margin: 2px 4px 0 4px; line-height: 1; } .fc-list-event-location span, .fc-list-event-description span { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: pre-wrap; max-width: 25vw; } @media only screen and (max-width: 767px) { .fc-list-event-location, .fc-list-event-description { display: none; } } } .fc-list-empty { .fc-list-empty-cushion { display: none; } .empty-content { margin-top: 0 !important; } } // Fix week view .fc-col-header-cell { word-break: break-word; white-space: normal; } .fc-timeGridWeek-view { .fc-daygrid-more-link { word-break: break-all; white-space: normal; } .fc-event-main { flex-wrap: wrap; } } .fc-v-event { min-height: 4em; &.fc-timegrid-event-short { min-height: 2em; } .fc-event-title { white-space: initial; } } // Fix Month view .fc-dayGridMonth-view { .fc-daygrid-more-link { word-break: break-word; white-space: normal; } .fc-daygrid-day-frame { min-height: 150px !important; } } .fc-daygrid-day-events { position:relative !important; } // Fix week button overlapping with the toggle .fc-col-header-cell { padding-top: 10px !important; } .fc-timegrid-axis-cushion { margin-top: 44px; } // Additional workaround for Firefox .fc-timegrid-axis.fc-scrollgrid-shrink { height: 65px; }