Romeo Fragomeli
ebce7719b6
This commit updates the FullCalendar library from v3 to v4.
The purpose of this update for us is to add a proper support of the
drag-and-drop of events on mobile.
But also to fix scrolling issues present mainly on smaller screens. In
those configurations multi/inner-scrolls were present resulting into
either the inability to properly scroll the desired content or even
blocking alltogether the scroll.
As a nice-to-have feature, the version 4 removes its dependency on the
jQuery library, allowing a faster loading of a bigger set of events.
Last but not least, this version also reduces its dependency on the
Moment.js library (but still keeps a binding to it for compatibility
purpose).
This commit focus only on the update of the library itself and the
adaptation of the related code to keep it working. Further
enhancements/fixes will be done later on.
To do so it modifies the following points:
* Update the library in itself (js, css...).
* Convert all FullCalendar's method calls to the new syntax (e.g.
`$calendar.fullCalendar('destroy')` becomes `calendar.destroy()`).
* Add a utility method to convert v4 events into the old v3 event
structure to ease the transition from one version to the other.
* Wrap all event's custom fields into a new event's
`extendedProps` object (as its the new way of storing them instead of
directly as a prop. of the event).
* Adapt `slotLabelFormat` and `weekNumberCalculation`.
* Use the view's new names:
** `agendaDay` -> `timeGridDay`
** `agendaWeek` -> `timeGridWeek`
** `month` -> `dayGridMonth`
* Use the option's new names:
** `viewRender` -> `datesRender`
** `eventMouseover` -> `eventMouseEnter`
** `eventMouseout` -> `eventMouseLeave`
** `isRTL` -> `dir`
** `selectHelper` -> `selectMirror`
** `weekNumberTitle` -> `weekLabel`
Ref:
https://fullcalendar.io/docs/upgrading-from-v3
Task ID: 2092550
36 lines
812 B
CSS
36 lines
812 B
CSS
.fc.fc-bootstrap a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.fc.fc-bootstrap a[data-goto]:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.fc-bootstrap hr.fc-divider {
|
|
border-color: inherit;
|
|
}
|
|
|
|
.fc-bootstrap .fc-today.alert {
|
|
border-radius: 0;
|
|
}
|
|
|
|
.fc-bootstrap a.fc-event:not([href]):not([tabindex]) {
|
|
color: #fff;
|
|
}
|
|
|
|
.fc-bootstrap .fc-popover.card {
|
|
position: absolute;
|
|
}
|
|
|
|
/* Popover
|
|
--------------------------------------------------------------------------------------------------*/
|
|
.fc-bootstrap .fc-popover .card-body {
|
|
padding: 0;
|
|
}
|
|
|
|
/* TimeGrid Slats (lines that run horizontally)
|
|
--------------------------------------------------------------------------------------------------*/
|
|
.fc-bootstrap .fc-time-grid .fc-slats table {
|
|
/* some themes have background color. see through to slats */
|
|
background: none;
|
|
} |