@event-calendar/core 2.7.2 → 3.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +29 -13
- package/index.css +182 -70
- package/index.js +126 -33
- package/package.json +3 -2
- package/src/Calendar.svelte +1 -1
- package/src/lib/date.js +7 -0
- package/src/lib/events.js +41 -31
- package/src/lib/times.js +67 -0
- package/src/lib/utils.js +4 -0
- package/src/lib/view.js +4 -0
- package/src/lib.js +10 -9
- package/src/storage/options.js +5 -0
- package/src/styles/index.scss +19 -77
- package/src/styles/time-grid.scss +74 -0
- package/src/styles/timeline.scss +143 -0
package/README.md
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
See [demo](https://vkurko.github.io/calendar/) and [changelog](CHANGELOG.md).
|
|
4
4
|
|
|
5
|
-
Full-sized drag & drop JavaScript event calendar with resource
|
|
5
|
+
Full-sized drag & drop JavaScript event calendar with resource & timeline views:
|
|
6
6
|
|
|
7
|
-
* Lightweight (
|
|
7
|
+
* Lightweight (34kb [br](https://en.wikipedia.org/wiki/Brotli) compressed)
|
|
8
8
|
* Zero-dependency (pre-built bundle)
|
|
9
9
|
* Used on over 70,000 websites with [Bookly](https://wordpress.org/plugins/bookly-responsive-appointment-booking-tool/)
|
|
10
10
|
|
|
@@ -96,6 +96,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), implements similar options
|
|
|
96
96
|
- [slotLabelFormat](#slotlabelformat)
|
|
97
97
|
- [slotMaxTime](#slotmaxtime)
|
|
98
98
|
- [slotMinTime](#slotmintime)
|
|
99
|
+
- [slotWidth](#slotwidth)
|
|
99
100
|
- [theme](#theme)
|
|
100
101
|
- [titleFormat](#titleformat)
|
|
101
102
|
- [unselect](#unselect)
|
|
@@ -153,6 +154,7 @@ You must use at least one plugin that provides a view. The following plugins are
|
|
|
153
154
|
|
|
154
155
|
* `@event-calendar/day-grid`
|
|
155
156
|
* `@event-calendar/list`
|
|
157
|
+
* `@event-calendar/resource-timeline`
|
|
156
158
|
* `@event-calendar/resource-time-grid`
|
|
157
159
|
* `@event-calendar/time-grid`
|
|
158
160
|
* `@event-calendar/interaction` (doesn't provide a view)
|
|
@@ -200,8 +202,8 @@ import '@event-calendar/core/index.css';
|
|
|
200
202
|
### Pre-built browser ready bundle
|
|
201
203
|
Include the following lines of code in the `<head>` section of your page:
|
|
202
204
|
```html
|
|
203
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@
|
|
204
|
-
<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@
|
|
205
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.0.1/event-calendar.min.css">
|
|
206
|
+
<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.0.1/event-calendar.min.js"></script>
|
|
205
207
|
```
|
|
206
208
|
|
|
207
209
|
<details>
|
|
@@ -290,13 +292,15 @@ When hidden with `false`, all-day events will not be displayed in `timeGrid`/`re
|
|
|
290
292
|
|
|
291
293
|
### buttonText
|
|
292
294
|
- Type `object` or `function`
|
|
293
|
-
- Default `{close: 'Close', dayGridMonth: 'month', listDay: 'list', listMonth: 'list', listWeek: 'list', listYear: 'list', resourceTimeGridDay: '
|
|
295
|
+
- Default `{close: 'Close', dayGridMonth: 'month', listDay: 'list', listMonth: 'list', listWeek: 'list', listYear: 'list', resourceTimelineDay: 'timeline', resourceTimelineWeek: 'timeline', resourceTimeGridDay: 'resources', resourceTimeGridWeek: 'resources', timeGridDay: 'day', timeGridWeek: 'week', today: 'today'}`
|
|
294
296
|
> Views override the default value as follows:
|
|
295
297
|
> - dayGridMonth `text => ({...text, next: 'Next month', prev: 'Previous month'})`
|
|
296
298
|
> - listDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
|
|
297
299
|
> - listMonth `text => ({...text, next: 'Next month', prev: 'Previous month'})`
|
|
298
300
|
> - listWeek `text => ({...text, next: 'Next week', prev: 'Previous week'})`
|
|
299
301
|
> - listYear `text => ({...text, next: 'Next year', prev: 'Previous year'})`
|
|
302
|
+
> - resourceTimelineDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
|
|
303
|
+
> - resourceTimelineWeek `text => ({...text, next: 'Next week', prev: 'Previous week'})`
|
|
300
304
|
> - resourceTimeGridDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
|
|
301
305
|
> - resourceTimeGridWeek `text => ({...text, next: 'Next week', prev: 'Previous week'})`
|
|
302
306
|
> - timeGridDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
|
|
@@ -534,6 +538,8 @@ function (date) {
|
|
|
534
538
|
- Default `{dateStyle: 'long'}`
|
|
535
539
|
> Views override the default value as follows:
|
|
536
540
|
> - dayGridMonth `{weekday: 'long'}`
|
|
541
|
+
> - resourceTimelineDay `{dateStyle: 'long', timeStyle: 'short'}`
|
|
542
|
+
> - resourceTimelineWeek `{dateStyle: 'long', timeStyle: 'short'}`
|
|
537
543
|
|
|
538
544
|
Defines the text that is used inside the `aria-label` attribute in calendar column headings.
|
|
539
545
|
|
|
@@ -624,13 +630,11 @@ Determines whether the calendar should automatically scroll during the event dra
|
|
|
624
630
|
> Views override the default value as follows:
|
|
625
631
|
> - dayGridMonth `{months: 1}`
|
|
626
632
|
> - listDay `{days: 1}`
|
|
627
|
-
> - listWeek `{weeks: 1}`
|
|
628
633
|
> - listMonth `{months: 1}`
|
|
629
634
|
> - listYear `{years: 1}`
|
|
635
|
+
> - resourceTimelineDay `{days: 1}`
|
|
630
636
|
> - resourceTimeGridDay `{days: 1}`
|
|
631
|
-
> - resourceTimeGridWeek `{weeks: 1}`
|
|
632
637
|
> - timeGridDay `{days: 1}`
|
|
633
|
-
> - timeGridWeek `{weeks: 1}`
|
|
634
638
|
|
|
635
639
|
Sets the duration of a view.
|
|
636
640
|
|
|
@@ -1786,7 +1790,7 @@ Enables a marker indicating the current time in `timeGrid`/`resourceTimeGrid` vi
|
|
|
1786
1790
|
- Default `false`
|
|
1787
1791
|
- Requires `Interaction` plugin
|
|
1788
1792
|
|
|
1789
|
-
Enables mouse cursor pointer in `timeGrid`/`resourceTimeGrid` views.
|
|
1793
|
+
Enables mouse cursor pointer in `timeGrid`/`resourceTimeGrid` and other views.
|
|
1790
1794
|
|
|
1791
1795
|
### resources
|
|
1792
1796
|
- Type `Array`
|
|
@@ -2003,10 +2007,10 @@ If set to `false`, then intersecting events will be placed next to each other.
|
|
|
2003
2007
|
- Type `integer`
|
|
2004
2008
|
- Default `24`
|
|
2005
2009
|
|
|
2006
|
-
Defines the time slot height in pixels. When changing the setting, you must additionally override the following CSS styles:
|
|
2010
|
+
Defines the time slot height in pixels in the `timeGrid`/`resourceTimeGrid` views. When changing the setting, you must additionally override the following CSS styles:
|
|
2007
2011
|
|
|
2008
2012
|
```css
|
|
2009
|
-
.ec-time, .ec-line {
|
|
2013
|
+
.ec-time-grid .ec-time, .ec-time-grid .ec-line {
|
|
2010
2014
|
height: 24px; /* override this value */
|
|
2011
2015
|
}
|
|
2012
2016
|
```
|
|
@@ -2050,9 +2054,21 @@ Defines the first time slot that will be displayed for each day.
|
|
|
2050
2054
|
|
|
2051
2055
|
This should be a value that can be parsed into a [Duration](#duration-object) object.
|
|
2052
2056
|
|
|
2057
|
+
### slotWidth
|
|
2058
|
+
- Type `integer`
|
|
2059
|
+
- Default `52`
|
|
2060
|
+
|
|
2061
|
+
Defines the time slot width in pixels in `ResourceTimeline` views. When changing the setting, you must additionally override the following CSS styles:
|
|
2062
|
+
|
|
2063
|
+
```css
|
|
2064
|
+
.ec-timeline .ec-time, .ec-timeline .ec-line {
|
|
2065
|
+
width: 52px; /* override this value */
|
|
2066
|
+
}
|
|
2067
|
+
```
|
|
2068
|
+
|
|
2053
2069
|
### theme
|
|
2054
2070
|
- Type `object` or `function`
|
|
2055
|
-
- Default `{
|
|
2071
|
+
- Default `{allDay: 'ec-all-day', active: 'ec-active', bgEvent: 'ec-bg-event', bgEvents: 'ec-bg-events', body: 'ec-body', button: 'ec-button', buttonGroup: 'ec-button-group', calendar: 'ec', compact: 'ec-compact', container: 'ec-container', content: 'ec-content', day: 'ec-day', dayHead: 'ec-day-head', dayFoot: 'ec-day-foot', days: 'ec-days', daySide: 'ec-day-side', draggable: 'ec-draggable', dragging: 'ec-dragging', event: 'ec-event', eventBody: 'ec-event-body', eventTag: 'ec-event-tag', eventTime: 'ec-event-time', eventTitle: 'ec-event-title', events: 'ec-events', extra: 'ec-extra', ghost: 'ec-ghost', handle: 'ec-handle', header: 'ec-header', hiddenScroll: 'ec-hidden-scroll', highlight: 'ec-highlight', icon: 'ec-icon', line: 'ec-line', lines: 'ec-lines', main: 'ec-main', noEvents: 'ec-no-events', nowIndicator: 'ec-now-indicator', otherMonth: 'ec-other-month', pointer: 'ec-pointer', popup: 'ec-popup', preview: 'ec-preview', resizer: 'ec-resizer', resizingX: 'ec-resizing-x', resizingY: 'ec-resizing-y', resource: 'ec-resource', selecting: 'ec-selecting', sidebar: 'ec-sidebar', sidebarTitle: 'ec-sidebar-title', today: 'ec-today', time: 'ec-time', times: 'ec-times', title: 'ec-title', toolbar: 'ec-toolbar', view: 'ec-timeline ec-resource-week-view', weekdays: ['ec-sun', 'ec-mon', 'ec-tue', 'ec-wed', 'ec-thu', 'ec-fri', 'ec-sat'], withScroll: 'ec-with-scroll', uniform: 'ec-uniform'}`
|
|
2056
2072
|
> Views override the default value as follows:
|
|
2057
2073
|
> - dayGridMonth `theme => ({...theme, view: 'ec-day-grid ec-month-view'})`
|
|
2058
2074
|
> - listDay `theme => ({...theme, view: 'ec-list ec-day-view'})`
|
|
@@ -2178,7 +2194,7 @@ Clicking on elements that match this CSS selector will prevent the current selec
|
|
|
2178
2194
|
- Type `string`
|
|
2179
2195
|
- Default `'resourceTimeGridWeek'`
|
|
2180
2196
|
|
|
2181
|
-
The view that is displayed in the calendar. Can be `'dayGridMonth'`, `'listDay'`, `'listWeek'`, `'listMonth'`, `'listYear'`, `'resourceTimeGridDay'`, `'resourceTimeGridWeek'`, `'timeGridDay'` or `'timeGridWeek'`.
|
|
2197
|
+
The view that is displayed in the calendar. Can be `'dayGridMonth'`, `'listDay'`, `'listWeek'`, `'listMonth'`, `'listYear'`, `'resourceTimelineDay'`, `'resourceTimelineWeek'`, `'resourceTimeGridDay'`, `'resourceTimeGridWeek'`, `'timeGridDay'` or `'timeGridWeek'`.
|
|
2182
2198
|
|
|
2183
2199
|
### viewDidMount
|
|
2184
2200
|
- Type `function`
|
package/index.css
CHANGED
|
@@ -61,10 +61,181 @@
|
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
63
|
|
|
64
|
+
.ec-timeline .ec-container {
|
|
65
|
+
display: flex;
|
|
66
|
+
flex: 1 1 0%;
|
|
67
|
+
min-height: 0;
|
|
68
|
+
}
|
|
69
|
+
.ec-timeline .ec-main {
|
|
70
|
+
display: flex;
|
|
71
|
+
flex-direction: column;
|
|
72
|
+
min-width: 0;
|
|
73
|
+
}
|
|
74
|
+
.ec-timeline .ec-content {
|
|
75
|
+
flex-direction: column;
|
|
76
|
+
}
|
|
77
|
+
.ec-timeline .ec-body {
|
|
78
|
+
flex: 1 1 auto;
|
|
79
|
+
overflow: auto;
|
|
80
|
+
}
|
|
81
|
+
.ec-timeline .ec-body .ec-content {
|
|
82
|
+
min-height: 100%;
|
|
83
|
+
min-width: max-content;
|
|
84
|
+
position: relative;
|
|
85
|
+
}
|
|
86
|
+
.ec-timeline .ec-body .ec-days {
|
|
87
|
+
flex-shrink: 0;
|
|
88
|
+
}
|
|
89
|
+
.ec-timeline .ec-body .ec-days:not(:last-child) {
|
|
90
|
+
flex-grow: 0;
|
|
91
|
+
}
|
|
92
|
+
.ec-timeline .ec-header {
|
|
93
|
+
overflow: hidden;
|
|
94
|
+
}
|
|
95
|
+
.ec-timeline .ec-header .ec-days {
|
|
96
|
+
min-width: max-content;
|
|
97
|
+
}
|
|
98
|
+
.ec-timeline .ec-header .ec-day {
|
|
99
|
+
flex-basis: auto;
|
|
100
|
+
display: flex;
|
|
101
|
+
flex-direction: column;
|
|
102
|
+
}
|
|
103
|
+
.ec-timeline .ec-header .ec-day:first-child .ec-day-head,
|
|
104
|
+
.ec-timeline .ec-header .ec-day:first-child .ec-time:first-child {
|
|
105
|
+
border: none;
|
|
106
|
+
}
|
|
107
|
+
.ec-timeline .ec-day {
|
|
108
|
+
border: none;
|
|
109
|
+
}
|
|
110
|
+
.ec-timeline .ec-day-head {
|
|
111
|
+
border-style: none none none solid;
|
|
112
|
+
}
|
|
113
|
+
.ec-timeline .ec-times {
|
|
114
|
+
display: flex;
|
|
115
|
+
border-style: solid none none;
|
|
116
|
+
}
|
|
117
|
+
.ec-timeline .ec-time {
|
|
118
|
+
border-left: 1px solid var(--ec-border-color);
|
|
119
|
+
box-sizing: border-box;
|
|
120
|
+
min-height: 24px;
|
|
121
|
+
overflow: hidden;
|
|
122
|
+
text-overflow: ellipsis;
|
|
123
|
+
}
|
|
124
|
+
.ec-timeline .ec-time, .ec-timeline .ec-line {
|
|
125
|
+
width: 52px;
|
|
126
|
+
}
|
|
127
|
+
.ec-timeline .ec-events {
|
|
128
|
+
position: relative;
|
|
129
|
+
height: 100%;
|
|
130
|
+
}
|
|
131
|
+
.ec-timeline .ec-event {
|
|
132
|
+
position: absolute;
|
|
133
|
+
}
|
|
134
|
+
.ec-timeline .ec-bg-event {
|
|
135
|
+
height: 100%;
|
|
136
|
+
z-index: auto;
|
|
137
|
+
}
|
|
138
|
+
.ec-timeline .ec-lines {
|
|
139
|
+
display: flex;
|
|
140
|
+
}
|
|
141
|
+
.ec-timeline .ec-line:not(:first-child):after {
|
|
142
|
+
content: "";
|
|
143
|
+
position: absolute;
|
|
144
|
+
height: 100%;
|
|
145
|
+
border-left: 1px solid var(--ec-border-color);
|
|
146
|
+
pointer-events: none;
|
|
147
|
+
}
|
|
148
|
+
.ec-timeline .ec-sidebar {
|
|
149
|
+
padding: 0;
|
|
150
|
+
border: 1px solid var(--ec-border-color);
|
|
151
|
+
border-right-style: none;
|
|
152
|
+
}
|
|
153
|
+
.ec-timeline .ec-sidebar .ec-sidebar-title {
|
|
154
|
+
flex-shrink: 0;
|
|
155
|
+
border-bottom: 1px solid var(--ec-border-color);
|
|
156
|
+
}
|
|
157
|
+
.ec-timeline .ec-sidebar .ec-content {
|
|
158
|
+
flex: 1;
|
|
159
|
+
overflow: hidden;
|
|
160
|
+
}
|
|
161
|
+
.ec-timeline .ec-sidebar .ec-resource {
|
|
162
|
+
padding: 0 8px;
|
|
163
|
+
flex-shrink: 0;
|
|
164
|
+
}
|
|
165
|
+
.ec-timeline .ec-sidebar .ec-resource:not(:last-child) {
|
|
166
|
+
flex-grow: 0;
|
|
167
|
+
border-bottom: 1px solid var(--ec-border-color);
|
|
168
|
+
}
|
|
169
|
+
.ec-timeline .ec-sidebar .ec-resource:last-child {
|
|
170
|
+
flex-basis: 100% !important;
|
|
171
|
+
}
|
|
172
|
+
.ec-timeline .ec-sidebar .ec-resource span {
|
|
173
|
+
padding-top: 8px;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.ec-time-grid .ec-body .ec-event {
|
|
177
|
+
position: absolute;
|
|
178
|
+
}
|
|
179
|
+
.ec-time-grid .ec-body .ec-event-title {
|
|
180
|
+
position: sticky;
|
|
181
|
+
top: 0;
|
|
182
|
+
}
|
|
183
|
+
.ec-time-grid .ec-body .ec-resizer {
|
|
184
|
+
left: 0;
|
|
185
|
+
right: 0;
|
|
186
|
+
bottom: 0;
|
|
187
|
+
height: 50%;
|
|
188
|
+
max-height: 8px;
|
|
189
|
+
cursor: ns-resize;
|
|
190
|
+
}
|
|
191
|
+
.ec-time-grid .ec-bg-event {
|
|
192
|
+
width: 100%;
|
|
193
|
+
z-index: 1;
|
|
194
|
+
}
|
|
195
|
+
.ec-time-grid .ec-time {
|
|
196
|
+
position: relative;
|
|
197
|
+
line-height: 24px;
|
|
198
|
+
top: -12px;
|
|
199
|
+
text-align: right;
|
|
200
|
+
}
|
|
201
|
+
.ec-time-grid .ec-header .ec-time,
|
|
202
|
+
.ec-time-grid .ec-all-day .ec-time {
|
|
203
|
+
visibility: hidden;
|
|
204
|
+
overflow-y: hidden;
|
|
205
|
+
height: 0;
|
|
206
|
+
}
|
|
207
|
+
.ec-time-grid .ec-time,
|
|
208
|
+
.ec-time-grid .ec-line {
|
|
209
|
+
height: 24px;
|
|
210
|
+
}
|
|
211
|
+
.ec-time-grid .ec-lines {
|
|
212
|
+
width: 8px;
|
|
213
|
+
}
|
|
214
|
+
.ec-time-grid .ec-line:not(:first-child):after {
|
|
215
|
+
content: "";
|
|
216
|
+
position: absolute;
|
|
217
|
+
width: 100%;
|
|
218
|
+
border-bottom: 1px solid var(--ec-border-color);
|
|
219
|
+
pointer-events: none;
|
|
220
|
+
}
|
|
221
|
+
.ec-time-grid .ec-body:not(.ec-compact) .ec-line:nth-child(even):after {
|
|
222
|
+
border-bottom-style: dotted;
|
|
223
|
+
}
|
|
224
|
+
.ec-time-grid .ec-sidebar-title {
|
|
225
|
+
visibility: hidden;
|
|
226
|
+
overflow-y: hidden;
|
|
227
|
+
height: 0;
|
|
228
|
+
text-align: right;
|
|
229
|
+
}
|
|
230
|
+
.ec-time-grid .ec-all-day .ec-sidebar-title {
|
|
231
|
+
visibility: visible;
|
|
232
|
+
height: auto;
|
|
233
|
+
padding: 8px 0;
|
|
234
|
+
}
|
|
235
|
+
|
|
64
236
|
/* Grid */
|
|
65
237
|
.ec-days,
|
|
66
238
|
.ec-day,
|
|
67
|
-
.ec-day-title,
|
|
68
239
|
.ec-resource {
|
|
69
240
|
flex: 1 1 0;
|
|
70
241
|
min-width: 0;
|
|
@@ -184,7 +355,8 @@
|
|
|
184
355
|
.ec-body,
|
|
185
356
|
.ec-days,
|
|
186
357
|
.ec-day,
|
|
187
|
-
.ec-
|
|
358
|
+
.ec-times,
|
|
359
|
+
.ec-day-head {
|
|
188
360
|
border: 1px solid var(--ec-border-color);
|
|
189
361
|
}
|
|
190
362
|
|
|
@@ -241,19 +413,6 @@
|
|
|
241
413
|
padding: 0 4px 0 8px;
|
|
242
414
|
display: flex;
|
|
243
415
|
flex-direction: column;
|
|
244
|
-
justify-content: center;
|
|
245
|
-
}
|
|
246
|
-
|
|
247
|
-
.ec-sidebar-title {
|
|
248
|
-
visibility: hidden;
|
|
249
|
-
overflow-y: hidden;
|
|
250
|
-
height: 0;
|
|
251
|
-
text-align: right;
|
|
252
|
-
}
|
|
253
|
-
.ec-all-day .ec-sidebar-title {
|
|
254
|
-
visibility: visible;
|
|
255
|
-
height: auto;
|
|
256
|
-
padding: 8px 0;
|
|
257
416
|
}
|
|
258
417
|
|
|
259
418
|
.ec-content {
|
|
@@ -317,6 +476,7 @@
|
|
|
317
476
|
|
|
318
477
|
.ec-day-grid .ec-day-head {
|
|
319
478
|
display: block;
|
|
479
|
+
border: none;
|
|
320
480
|
text-align: right;
|
|
321
481
|
padding: 4px 4px 3px;
|
|
322
482
|
}
|
|
@@ -331,7 +491,6 @@
|
|
|
331
491
|
}
|
|
332
492
|
|
|
333
493
|
.ec-list .ec-day-head {
|
|
334
|
-
flex: 1 0 auto;
|
|
335
494
|
background-color: var(--ec-list-day-bg-color);
|
|
336
495
|
border-style: solid none;
|
|
337
496
|
margin: -1px 0 0;
|
|
@@ -357,6 +516,9 @@
|
|
|
357
516
|
.ec-time-grid .ec-events, .ec-events.ec-preview {
|
|
358
517
|
position: relative;
|
|
359
518
|
}
|
|
519
|
+
.ec-day-grid .ec-events, .ec-all-day .ec-events {
|
|
520
|
+
display: flow-root;
|
|
521
|
+
}
|
|
360
522
|
|
|
361
523
|
.ec-event {
|
|
362
524
|
display: flex;
|
|
@@ -373,9 +535,6 @@
|
|
|
373
535
|
.ec-day-grid .ec-event, .ec-all-day .ec-event {
|
|
374
536
|
position: relative;
|
|
375
537
|
}
|
|
376
|
-
.ec-time-grid .ec-body .ec-event {
|
|
377
|
-
position: absolute;
|
|
378
|
-
}
|
|
379
538
|
.ec-list .ec-event {
|
|
380
539
|
flex-direction: row;
|
|
381
540
|
padding: 8px 14px;
|
|
@@ -397,9 +556,6 @@
|
|
|
397
556
|
position: absolute;
|
|
398
557
|
z-index: 0;
|
|
399
558
|
box-shadow: none;
|
|
400
|
-
display: none;
|
|
401
|
-
}
|
|
402
|
-
.ec-day:hover .ec-event.ec-pointer {
|
|
403
559
|
display: flex;
|
|
404
560
|
}
|
|
405
561
|
|
|
@@ -408,7 +564,7 @@
|
|
|
408
564
|
flex-direction: column;
|
|
409
565
|
width: 100%;
|
|
410
566
|
}
|
|
411
|
-
.ec-day-grid .ec-event-body, .ec-all-day .ec-event-body {
|
|
567
|
+
.ec-day-grid .ec-event-body, .ec-all-day .ec-event-body, .ec-timeline .ec-event-body {
|
|
412
568
|
flex-direction: row;
|
|
413
569
|
}
|
|
414
570
|
|
|
@@ -424,7 +580,7 @@
|
|
|
424
580
|
margin: 0 0 1px 0;
|
|
425
581
|
flex-shrink: 0;
|
|
426
582
|
}
|
|
427
|
-
.ec-day-grid .ec-event-time {
|
|
583
|
+
.ec-day-grid .ec-event-time, .ec-timeline .ec-event-time {
|
|
428
584
|
margin: 0 3px 0 0;
|
|
429
585
|
max-width: 100%;
|
|
430
586
|
text-overflow: ellipsis;
|
|
@@ -435,15 +591,11 @@
|
|
|
435
591
|
margin: unset;
|
|
436
592
|
font-weight: inherit;
|
|
437
593
|
}
|
|
438
|
-
.ec-day-grid .ec-event-title, .ec-all-day .ec-event-title {
|
|
594
|
+
.ec-day-grid .ec-event-title, .ec-all-day .ec-event-title, .ec-timeline .ec-event-title {
|
|
439
595
|
min-height: 1.5em;
|
|
440
596
|
white-space: nowrap;
|
|
441
597
|
text-overflow: ellipsis;
|
|
442
598
|
}
|
|
443
|
-
.ec-time-grid .ec-body .ec-event-title {
|
|
444
|
-
position: sticky;
|
|
445
|
-
top: 0;
|
|
446
|
-
}
|
|
447
599
|
.ec-list .ec-event-title {
|
|
448
600
|
font-size: 1rem;
|
|
449
601
|
}
|
|
@@ -467,43 +619,11 @@
|
|
|
467
619
|
position: absolute;
|
|
468
620
|
background-color: var(--ec-bg-event-color);
|
|
469
621
|
opacity: var(--ec-bg-event-opacity);
|
|
470
|
-
width: 100%;
|
|
471
|
-
z-index: 1;
|
|
472
|
-
}
|
|
473
|
-
|
|
474
|
-
.ec-time,
|
|
475
|
-
.ec-line {
|
|
476
|
-
height: 24px;
|
|
477
622
|
}
|
|
478
623
|
|
|
479
624
|
.ec-time {
|
|
480
|
-
position: relative;
|
|
481
|
-
line-height: 24px;
|
|
482
|
-
top: -12px;
|
|
483
|
-
text-align: right;
|
|
484
625
|
white-space: nowrap;
|
|
485
626
|
}
|
|
486
|
-
.ec-header .ec-time, .ec-all-day .ec-time {
|
|
487
|
-
visibility: hidden;
|
|
488
|
-
overflow-y: hidden;
|
|
489
|
-
height: 0;
|
|
490
|
-
}
|
|
491
|
-
|
|
492
|
-
.ec-lines {
|
|
493
|
-
width: 8px;
|
|
494
|
-
}
|
|
495
|
-
|
|
496
|
-
.ec-line:not(:first-child):after {
|
|
497
|
-
content: "";
|
|
498
|
-
position: absolute;
|
|
499
|
-
width: 100%;
|
|
500
|
-
border-bottom: 1px solid var(--ec-border-color);
|
|
501
|
-
pointer-events: none;
|
|
502
|
-
}
|
|
503
|
-
|
|
504
|
-
.ec-body:not(.ec-compact) .ec-line:nth-child(even):after {
|
|
505
|
-
border-bottom-style: dotted;
|
|
506
|
-
}
|
|
507
627
|
|
|
508
628
|
.ec-popup {
|
|
509
629
|
position: absolute;
|
|
@@ -566,7 +686,7 @@
|
|
|
566
686
|
position: absolute;
|
|
567
687
|
user-select: none;
|
|
568
688
|
}
|
|
569
|
-
.ec-day-grid .ec-resizer, .ec-all-day .ec-resizer {
|
|
689
|
+
.ec-day-grid .ec-resizer, .ec-all-day .ec-resizer, .ec-timeline .ec-resizer {
|
|
570
690
|
top: 0;
|
|
571
691
|
right: 0;
|
|
572
692
|
bottom: 0;
|
|
@@ -574,14 +694,6 @@
|
|
|
574
694
|
max-width: 8px;
|
|
575
695
|
cursor: ew-resize;
|
|
576
696
|
}
|
|
577
|
-
.ec-time-grid .ec-body .ec-resizer {
|
|
578
|
-
left: 0;
|
|
579
|
-
right: 0;
|
|
580
|
-
bottom: 0;
|
|
581
|
-
height: 50%;
|
|
582
|
-
max-height: 8px;
|
|
583
|
-
cursor: ns-resize;
|
|
584
|
-
}
|
|
585
697
|
|
|
586
698
|
.ec-dragging {
|
|
587
699
|
cursor: pointer !important;
|