@event-calendar/core 0.14.3 → 0.15.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 CHANGED
@@ -1,10 +1,10 @@
1
1
  # Event Calendar [![](https://data.jsdelivr.com/v1/package/npm/@event-calendar/build/badge)](https://www.jsdelivr.com/package/npm/@event-calendar/build) [![npm](https://img.shields.io/npm/dm/@event-calendar/core?color=red&label=npm&style=flat-square)](https://www.npmjs.com/package/@event-calendar/core) [![Sponsor](https://img.shields.io/badge/Sponsor-$10-blue.svg?style=flat-square&logo=paypal)](https://www.paypal.me/vkurko/10usd)
2
2
 
3
- See [demo](https://vkurko.github.io/calendar/).
3
+ See [demo](https://vkurko.github.io/calendar/) and [changelog](CHANGELOG.md).
4
4
 
5
5
  Full-sized drag & drop JavaScript event calendar with resource view:
6
6
 
7
- * Lightweight (54kb [br](https://en.wikipedia.org/wiki/Brotli) compressed `modern` version)
7
+ * Lightweight (37kb [br](https://en.wikipedia.org/wiki/Brotli) compressed)
8
8
  * Zero-dependency (pre-built bundle)
9
9
  * Used by [Bookly](https://wordpress.org/plugins/bookly-responsive-appointment-booking-tool/)
10
10
 
@@ -192,10 +192,21 @@ import '@event-calendar/core/index.css';
192
192
  ### Pre-built browser ready bundle
193
193
  Include the following lines of code in the `<head>` section of your page:
194
194
  ```html
195
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build/event-calendar.min.css">
196
- <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build/event-calendar.min.js"></script>
195
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@0.15.1/event-calendar.min.css">
196
+ <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@0.15.1/event-calendar.min.js"></script>
197
197
  ```
198
- > If you don't need IE11 support, you can use the `modern` version of the bundle instead: `event-calendar-modern.min.css` and `event-calendar-modern.min.js`. The lack of IE11 support makes the bundle ~1.5 times smaller.
198
+
199
+ <details>
200
+ <summary>Note</summary>
201
+
202
+ > Please note that the file paths contain an indication of a specific version of the library. You can remove this indication, then the latest version will be loaded:
203
+ > ```html
204
+ > <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build/event-calendar.min.css">
205
+ > <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build/event-calendar.min.js"></script>
206
+ > ```
207
+ > But it is recommended to always specify the version and explicitly update it if necessary, in order to avoid unpredictable problems when a new version of the library is released.
208
+
209
+ </details>
199
210
 
200
211
  Then initialize the calendar with something like this:
201
212
  ```js
@@ -1750,7 +1761,7 @@ This should be a value that can be parsed into a [Duration](#duration-object) ob
1750
1761
 
1751
1762
  ### theme
1752
1763
  - Type `object` or `function`
1753
- - Default `{active: 'ec-active', allDay: 'ec-all-day', bgEvent: 'ec-bg-event', bgEvents: 'ec-bg-events', body: 'ec-body', button: 'ec-button', buttonGroup: 'ec-button-group', calendar: 'ec', compact: 'ec-compact', content: 'ec-content', day: 'ec-day', dayFoot: 'ec-day-foot', dayHead: 'ec-day-head', daySide: 'ec-day-side', days: 'ec-days', 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', hiddenTimes: 'ec-hidden-times', highlight: 'ec-highlight', icon: 'ec-icon', line: 'ec-line', lines: 'ec-lines', list: 'ec-list', month: 'ec-month', 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', resourceTitle: 'ec-resource-title', sidebar: 'ec-sidebar', sidebarTitle: 'ec-sidebar-title', time: 'ec-time', title: 'ec-title', today: 'ec-today', toolbar: 'ec-toolbar', uniform: 'ec-uniform', week: 'ec-week', withScroll: 'ec-with-scroll'}`
1764
+ - Default `{active: 'ec-active', allDay: 'ec-all-day', bgEvent: 'ec-bg-event', bgEvents: 'ec-bg-events', body: 'ec-body', button: 'ec-button', buttonGroup: 'ec-button-group', calendar: 'ec', compact: 'ec-compact', content: 'ec-content', day: 'ec-day', dayFoot: 'ec-day-foot', dayHead: 'ec-day-head', daySide: 'ec-day-side', days: 'ec-days', 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', hiddenTimes: 'ec-hidden-times', highlight: 'ec-highlight', icon: 'ec-icon', line: 'ec-line', lines: 'ec-lines', list: 'ec-list', month: 'ec-month', 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', resourceTitle: 'ec-resource-title', selecting: 'ec-selecting', sidebar: 'ec-sidebar', sidebarTitle: 'ec-sidebar-title', time: 'ec-time', title: 'ec-title', today: 'ec-today', toolbar: 'ec-toolbar', uniform: 'ec-uniform', week: 'ec-week', withScroll: 'ec-with-scroll'}`
1754
1765
 
1755
1766
  Defines the CSS classes that the Event Calendar uses to generate HTML markup.
1756
1767
 
@@ -2420,9 +2431,6 @@ Here are all properties that exist in View object:
2420
2431
 
2421
2432
  ## Browser support
2422
2433
 
2423
- - Chrome (latest)
2424
- - Firefox (latest)
2425
- - Safari (latest)
2426
- - Opera (latest)
2427
- - Edge (latest)
2428
- - Internet Explorer 11
2434
+ The latest versions of Chrome, Firefox, Safari, and Edge are supported.
2435
+
2436
+ > The library is compiled to support browsers that match the following browserslist configuration: `defaults and supports fetch`. You can see the resulting list [here](https://browsersl.ist/#q=defaults+and+supports+fetch).
package/index.css CHANGED
@@ -1 +1,517 @@
1
- .ec-month .ec-body,.ec-days,.ec-day,.ec-day-title,.ec-resource{flex:1 1 0%;min-width:0;max-width:100%}.ec{display:flex;flex-direction:column;-webkit-tap-highlight-color:rgba(0,0,0,0)}.ec ::-webkit-scrollbar{background:#fff}.ec ::-webkit-scrollbar-thumb{border:4px solid #fff;box-shadow:none;background:#dadce0;border-radius:8px;min-height:40px}.ec :hover::-webkit-scrollbar-thumb{background:#bdc1c6}.ec-hidden-scroll{display:none;overflow-y:scroll;visibility:hidden;flex-shrink:0}.ec-with-scroll .ec-hidden-scroll{display:block}.ec-toolbar{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;margin-bottom:1em}.ec-toolbar>*{margin-bottom:-0.5em}.ec-toolbar>*>*{margin-bottom:.5em}.ec-toolbar>*>*:not(:last-child){margin-right:.75em}.ec-title{margin:0}.ec-button{background-color:#fff;border:1px solid #ced4da;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem}.ec-button:not(:disabled){color:#212529;cursor:pointer}.ec-button:not(:disabled):hover,.ec-button.ec-active{background-color:#ececec;border-color:#b1bbc4}.ec-button-group{display:inline-flex}.ec-button-group .ec-button:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.ec-button-group .ec-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.ec-icon{display:inline-block;width:1em}.ec-icon.ec-prev:after,.ec-icon.ec-next:after{content:"";position:relative;width:.5em;height:.5em;border-top:2px solid #212529;border-right:2px solid #212529;display:inline-block}.ec-icon.ec-prev:after{transform:rotate(-135deg) translate(-2px, 2px)}.ec-icon.ec-next:after{transform:rotate(45deg) translate(-2px, 2px)}.ec-header,.ec-all-day,.ec-body,.ec-days,.ec-day{border:1px solid #dadce0}.ec-header{display:flex;flex-shrink:0}.ec-header .ec-resource{flex-direction:column}.ec-header .ec-resource .ec-days{border-top-style:solid}.ec-header .ec-days{border-bottom:none}.ec-header .ec-day{min-height:24px;line-height:24px;text-align:center;overflow:hidden;text-overflow:ellipsis}.ec-all-day{display:flex;flex-shrink:0;border-top:none}.ec-all-day .ec-days{border-bottom:none}.ec-all-day .ec-day{padding-bottom:4px}.ec-all-day .ec-event-time{display:none}.ec-body{position:relative;overflow-x:hidden;overflow-y:auto}.ec:not(.ec-list) .ec-body{border-top:none}.ec-sidebar{flex:0 0 auto;width:auto;max-width:100%;padding:0 4px 0 8px;display:flex;flex-direction:column;justify-content:center}.ec-sidebar-title{visibility:hidden;overflow-y:hidden;height:0;text-align:right}.ec-all-day .ec-sidebar-title{visibility:visible;height:auto;padding:8px 0}.ec-content{display:flex}.ec-month .ec-content{flex-direction:column;height:100%}.ec-month .ec-uniform .ec-content{overflow:hidden}.ec-list .ec-content{flex-direction:column}.ec-resource{display:flex}.ec-days{display:flex;border-style:none none solid}.ec-days:last-child{border-bottom:none}.ec-month .ec-days,.ec-resource .ec-days{flex:1 0 auto}.ec-month .ec-uniform .ec-days{flex:1 1 0%;min-height:0}.ec-day{border-style:none none none solid}.ec-day.ec-today{background-color:#fcf8e3}.ec-day.ec-highlight{background-color:#e5f7fe}.ec-month .ec-body .ec-day{min-height:5em;position:relative}.ec-month .ec-uniform .ec-day{min-height:0}.ec-month .ec-day:first-child{border-left:none}.ec-day.ec-other-month .ec-day-head{opacity:.3}.ec-list .ec-day{flex:1 0 auto;background-color:#fff;border-style:solid none;padding:8px 14px;font-weight:bold;position:-webkit-sticky;position:sticky;top:0;z-index:2}.ec-list .ec-day:first-child{border-top:none}.ec-month .ec-day-head{text-align:right;padding:4px 4px 3px}.ec-month .ec-day-foot{position:absolute;bottom:0;padding:2px;font-size:.85em}.ec-month .ec-day-foot a{cursor:pointer}.ec-list .ec-day-side{float:right}.ec-list .ec-no-events{text-align:center;padding:5em 0}.ec-events{margin:0 6px 0 0}.ec-week .ec-events,.ec-events.ec-preview{position:relative}.ec-event{display:flex;padding:2px;color:#fff;box-sizing:border-box;box-shadow:0 0 1px 0 #dadce0;background-color:#039be5;border-radius:3px;font-size:.85em;line-height:1.5;z-index:1}.ec-month .ec-event,.ec-all-day .ec-event{position:relative}.ec-week .ec-body .ec-event{position:absolute}.ec-list .ec-event{flex-direction:row;padding:8px 14px;color:inherit;background-color:rgba(0,0,0,0);border-radius:0}.ec-event.ec-preview{position:absolute;z-index:1000;width:100%;-webkit-user-select:none;user-select:none;opacity:.8}.ec-event.ec-pointer{color:inherit;pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute;z-index:0;box-shadow:none;display:none}.ec-day:hover .ec-event.ec-pointer{display:flex}.ec-event-body{display:flex;flex-direction:column;width:100%}.ec-month .ec-event-body,.ec-all-day .ec-event-body{flex-direction:row}.ec-event-tag{width:4px;border-radius:2px;margin-right:8px}.ec-event-time{overflow:hidden;white-space:nowrap;margin:0 0 1px 0;flex-shrink:0}.ec-month .ec-event-time{margin:0 3px 0 0;max-width:100%;text-overflow:ellipsis}.ec-event-title{overflow:hidden}.ec-month .ec-event-title,.ec-all-day .ec-event-title{min-height:1.5em;white-space:nowrap;text-overflow:ellipsis}.ec-week .ec-body .ec-event-title{position:-webkit-sticky;position:sticky;top:0}.ec-list .ec-event-title{font-size:1rem}.ec-draggable{cursor:pointer;-webkit-user-select:none;user-select:none}.ec-ghost{opacity:.5;-webkit-user-select:none;user-select:none}.ec-bg-events{position:relative}.ec-bg-event{position:absolute;background-color:#dadce0;opacity:.3;width:100%}.ec-hidden-times{visibility:hidden;overflow-y:hidden;height:0}.ec-time,.ec-line{height:24px}.ec-time{position:relative;line-height:24px;top:-12px;text-align:right;white-space:nowrap}.ec-lines{width:8px}.ec-line:not(:first-child):after{content:"";position:absolute;width:100%;border-bottom:1px solid #dadce0;pointer-events:none}.ec-body:not(.ec-compact) .ec-line:nth-child(even):after{border-bottom-style:dotted}.ec-popup{position:absolute;top:0;display:flex;flex-direction:column;width:110%;min-width:180px;z-index:1010;padding:8px 10px 14px;background-color:#fff;border-radius:6px;outline:1px solid rgba(0,0,0,0);box-shadow:0 1px 3px 0 rgba(60,64,67,.3),0 4px 8px 3px rgba(60,64,67,.15)}.ec-popup .ec-day-head{text-align:left;display:flex;justify-content:space-between}.ec-popup .ec-day-head a{cursor:pointer;font-size:1.5em;line-height:.8}.ec-popup .ec-events{margin:0;min-height:0;overflow:auto}.ec-extra{position:relative;height:100%;overflow:hidden;margin-left:-6.5px;-webkit-user-select:none;user-select:none}.ec-now-indicator{position:absolute;z-index:1005;width:100%;border-top:#ea4335 solid 2px;pointer-events:none}.ec-now-indicator:before{background:#ea4335;border-radius:50%;content:"";position:absolute;height:12px;margin-top:-7px;width:12px;pointer-events:none}.ec-resizer{position:absolute;-webkit-user-select:none;user-select:none}.ec-month .ec-resizer,.ec-all-day .ec-resizer{top:0;right:0;bottom:0;width:50%;max-width:8px;cursor:ew-resize}.ec-week .ec-body .ec-resizer{left:0;right:0;bottom:0;height:50%;max-height:8px;cursor:ns-resize}.ec-dragging{cursor:pointer !important}.ec-resizing-y{cursor:ns-resize !important}.ec-resizing-x{cursor:ew-resize !important}
1
+ /* Grid */
2
+ .ec-days,
3
+ .ec-day,
4
+ .ec-day-title,
5
+ .ec-resource {
6
+ flex: 1 1 0;
7
+ min-width: 0;
8
+ max-width: 100%;
9
+ }
10
+
11
+ .ec {
12
+ display: flex;
13
+ flex-direction: column;
14
+ -webkit-tap-highlight-color: transparent;
15
+ /* Scrollbar */
16
+ }
17
+ .ec ::-webkit-scrollbar {
18
+ background: #fff;
19
+ }
20
+ .ec ::-webkit-scrollbar-thumb {
21
+ border: 4px solid #fff;
22
+ box-shadow: none;
23
+ background: #dadce0;
24
+ border-radius: 8px;
25
+ min-height: 40px;
26
+ }
27
+ .ec :hover::-webkit-scrollbar-thumb {
28
+ background: #bdc1c6;
29
+ }
30
+
31
+ .ec-hidden-scroll {
32
+ display: none;
33
+ overflow-y: scroll;
34
+ visibility: hidden;
35
+ flex-shrink: 0;
36
+ }
37
+ .ec-with-scroll .ec-hidden-scroll {
38
+ display: block;
39
+ }
40
+
41
+ /* Toolbar */
42
+ .ec-toolbar {
43
+ flex: 0 0 auto;
44
+ display: flex;
45
+ justify-content: space-between;
46
+ align-items: center;
47
+ margin-bottom: 1em;
48
+ }
49
+ .ec-toolbar > * {
50
+ margin-bottom: -0.5em;
51
+ }
52
+ .ec-toolbar > * > * {
53
+ margin-bottom: 0.5em;
54
+ }
55
+ .ec-toolbar > * > *:not(:last-child) {
56
+ margin-right: 0.75em;
57
+ }
58
+
59
+ .ec-title {
60
+ margin: 0;
61
+ }
62
+
63
+ .ec-button {
64
+ background-color: #fff;
65
+ border: 1px solid #ced4da;
66
+ padding: 0.375rem 0.75rem;
67
+ font-size: 1rem;
68
+ line-height: 1.5;
69
+ border-radius: 0.25rem;
70
+ }
71
+ .ec-button:not(:disabled) {
72
+ color: #212529;
73
+ cursor: pointer;
74
+ }
75
+ .ec-button:not(:disabled):hover, .ec-button.ec-active {
76
+ background-color: #ececec;
77
+ border-color: #b1bbc4;
78
+ }
79
+
80
+ .ec-button-group {
81
+ display: inline-flex;
82
+ }
83
+ .ec-button-group .ec-button:not(:first-child) {
84
+ border-top-left-radius: 0;
85
+ border-bottom-left-radius: 0;
86
+ margin-left: -1px;
87
+ }
88
+ .ec-button-group .ec-button:not(:last-child) {
89
+ border-top-right-radius: 0;
90
+ border-bottom-right-radius: 0;
91
+ }
92
+
93
+ .ec-icon {
94
+ display: inline-block;
95
+ width: 1em;
96
+ }
97
+ .ec-icon.ec-prev:after, .ec-icon.ec-next:after {
98
+ content: "";
99
+ position: relative;
100
+ width: 0.5em;
101
+ height: 0.5em;
102
+ border-top: 2px solid #212529;
103
+ border-right: 2px solid #212529;
104
+ display: inline-block;
105
+ }
106
+ .ec-icon.ec-prev:after {
107
+ transform: rotate(-135deg) translate(-2px, 2px);
108
+ }
109
+ .ec-icon.ec-next:after {
110
+ transform: rotate(45deg) translate(-2px, 2px);
111
+ }
112
+
113
+ /* Header */
114
+ .ec-header,
115
+ .ec-all-day,
116
+ .ec-body,
117
+ .ec-days,
118
+ .ec-day {
119
+ border: 1px solid #dadce0;
120
+ }
121
+
122
+ .ec-header {
123
+ display: flex;
124
+ flex-shrink: 0;
125
+ }
126
+ .ec-header .ec-resource {
127
+ flex-direction: column;
128
+ }
129
+ .ec-header .ec-resource .ec-days {
130
+ border-top-style: solid;
131
+ }
132
+ .ec-header .ec-days {
133
+ border-bottom: none;
134
+ }
135
+ .ec-header .ec-day {
136
+ min-height: 24px;
137
+ line-height: 24px;
138
+ text-align: center;
139
+ overflow: hidden;
140
+ text-overflow: ellipsis;
141
+ }
142
+
143
+ /* All Day */
144
+ .ec-all-day {
145
+ display: flex;
146
+ flex-shrink: 0;
147
+ border-top: none;
148
+ }
149
+ .ec-all-day .ec-days {
150
+ border-bottom: none;
151
+ }
152
+ .ec-all-day .ec-day {
153
+ padding-bottom: 4px;
154
+ }
155
+ .ec-all-day .ec-event-time {
156
+ display: none;
157
+ }
158
+
159
+ /* Body */
160
+ .ec-body {
161
+ position: relative;
162
+ overflow-x: hidden;
163
+ overflow-y: auto;
164
+ }
165
+ .ec:not(.ec-list) .ec-body {
166
+ border-top: none;
167
+ }
168
+ .ec-month .ec-body {
169
+ flex: 1 1 auto;
170
+ }
171
+
172
+ .ec-sidebar {
173
+ flex: 0 0 auto;
174
+ width: auto;
175
+ max-width: 100%;
176
+ padding: 0 4px 0 8px;
177
+ display: flex;
178
+ flex-direction: column;
179
+ justify-content: center;
180
+ }
181
+
182
+ .ec-sidebar-title {
183
+ visibility: hidden;
184
+ overflow-y: hidden;
185
+ height: 0;
186
+ text-align: right;
187
+ }
188
+ .ec-all-day .ec-sidebar-title {
189
+ visibility: visible;
190
+ height: auto;
191
+ padding: 8px 0;
192
+ }
193
+
194
+ .ec-content {
195
+ display: flex;
196
+ }
197
+ .ec-month .ec-content {
198
+ flex-direction: column;
199
+ height: 100%;
200
+ }
201
+ .ec-list .ec-content {
202
+ flex-direction: column;
203
+ }
204
+
205
+ .ec-resource {
206
+ display: flex;
207
+ }
208
+
209
+ .ec-days {
210
+ display: flex;
211
+ border-style: none none solid;
212
+ }
213
+ .ec-days:last-child {
214
+ border-bottom: none;
215
+ }
216
+ .ec-month .ec-days, .ec-resource .ec-days {
217
+ flex: 1 0 auto;
218
+ }
219
+ .ec-month .ec-uniform .ec-days {
220
+ flex: 1 1 0;
221
+ min-height: calc(5em + 1px);
222
+ }
223
+
224
+ .ec-day {
225
+ border-style: none none none solid;
226
+ }
227
+ .ec-day.ec-today {
228
+ background-color: #fcf8e3;
229
+ }
230
+ .ec-day.ec-highlight {
231
+ background-color: #e5f7fe;
232
+ }
233
+ .ec-month .ec-body .ec-day {
234
+ min-height: 5em;
235
+ position: relative;
236
+ }
237
+ .ec-month .ec-day:first-child {
238
+ border-left: none;
239
+ }
240
+ .ec-day.ec-other-month .ec-day-head {
241
+ opacity: 0.3;
242
+ }
243
+ .ec-list .ec-day {
244
+ flex: 1 0 auto;
245
+ background-color: #fff;
246
+ border-style: solid none;
247
+ padding: 8px 14px;
248
+ font-weight: bold;
249
+ position: sticky;
250
+ top: 0;
251
+ z-index: 2;
252
+ }
253
+ .ec-list .ec-day:first-child {
254
+ border-top: none;
255
+ }
256
+
257
+ .ec-month .ec-day-head {
258
+ text-align: right;
259
+ padding: 4px 4px 3px;
260
+ }
261
+ .ec-month .ec-day-foot {
262
+ position: absolute;
263
+ bottom: 0;
264
+ padding: 2px;
265
+ font-size: 0.85em;
266
+ }
267
+ .ec-month .ec-day-foot a {
268
+ cursor: pointer;
269
+ }
270
+
271
+ .ec-list .ec-day-side {
272
+ float: right;
273
+ }
274
+ .ec-list .ec-no-events {
275
+ text-align: center;
276
+ padding: 5em 0;
277
+ }
278
+
279
+ .ec-events {
280
+ margin: 0 6px 0 0;
281
+ }
282
+ .ec-week .ec-events, .ec-events.ec-preview {
283
+ position: relative;
284
+ }
285
+
286
+ .ec-event {
287
+ display: flex;
288
+ padding: 2px;
289
+ color: #fff;
290
+ box-sizing: border-box;
291
+ box-shadow: 0 0 1px 0 #dadce0;
292
+ background-color: #039be5;
293
+ border-radius: 3px;
294
+ font-size: 0.85em;
295
+ line-height: 1.5;
296
+ z-index: 1;
297
+ }
298
+ .ec-month .ec-event, .ec-all-day .ec-event {
299
+ position: relative;
300
+ }
301
+ .ec-week .ec-body .ec-event {
302
+ position: absolute;
303
+ }
304
+ .ec-list .ec-event {
305
+ flex-direction: row;
306
+ padding: 8px 14px;
307
+ color: inherit;
308
+ background-color: transparent;
309
+ border-radius: 0;
310
+ }
311
+ .ec-event.ec-preview {
312
+ position: absolute;
313
+ z-index: 1000;
314
+ width: 100%;
315
+ user-select: none;
316
+ opacity: 0.8;
317
+ }
318
+ .ec-event.ec-pointer {
319
+ color: inherit;
320
+ pointer-events: none;
321
+ user-select: none;
322
+ position: absolute;
323
+ z-index: 0;
324
+ box-shadow: none;
325
+ display: none;
326
+ }
327
+ .ec-day:hover .ec-event.ec-pointer {
328
+ display: flex;
329
+ }
330
+
331
+ .ec-event-body {
332
+ display: flex;
333
+ flex-direction: column;
334
+ width: 100%;
335
+ }
336
+ .ec-month .ec-event-body, .ec-all-day .ec-event-body {
337
+ flex-direction: row;
338
+ }
339
+
340
+ .ec-event-tag {
341
+ width: 4px;
342
+ border-radius: 2px;
343
+ margin-right: 8px;
344
+ }
345
+
346
+ .ec-event-time {
347
+ overflow: hidden;
348
+ white-space: nowrap;
349
+ margin: 0 0 1px 0;
350
+ flex-shrink: 0;
351
+ }
352
+ .ec-month .ec-event-time {
353
+ margin: 0 3px 0 0;
354
+ max-width: 100%;
355
+ text-overflow: ellipsis;
356
+ }
357
+
358
+ .ec-event-title {
359
+ overflow: hidden;
360
+ }
361
+ .ec-month .ec-event-title, .ec-all-day .ec-event-title {
362
+ min-height: 1.5em;
363
+ white-space: nowrap;
364
+ text-overflow: ellipsis;
365
+ }
366
+ .ec-week .ec-body .ec-event-title {
367
+ position: sticky;
368
+ top: 0;
369
+ }
370
+ .ec-list .ec-event-title {
371
+ font-size: 1rem;
372
+ }
373
+
374
+ .ec-draggable {
375
+ cursor: pointer;
376
+ user-select: none;
377
+ }
378
+
379
+ .ec-ghost {
380
+ opacity: 0.5;
381
+ user-select: none;
382
+ }
383
+
384
+ .ec-bg-events {
385
+ position: relative;
386
+ }
387
+
388
+ .ec-bg-event {
389
+ position: absolute;
390
+ background-color: #dadce0;
391
+ opacity: 0.3;
392
+ width: 100%;
393
+ }
394
+
395
+ .ec-hidden-times {
396
+ visibility: hidden;
397
+ overflow-y: hidden;
398
+ height: 0;
399
+ }
400
+
401
+ .ec-time,
402
+ .ec-line {
403
+ height: 24px;
404
+ }
405
+
406
+ .ec-time {
407
+ position: relative;
408
+ line-height: 24px;
409
+ top: -12px;
410
+ text-align: right;
411
+ white-space: nowrap;
412
+ }
413
+
414
+ .ec-lines {
415
+ width: 8px;
416
+ }
417
+
418
+ .ec-line:not(:first-child):after {
419
+ content: "";
420
+ position: absolute;
421
+ width: 100%;
422
+ border-bottom: 1px solid #dadce0;
423
+ pointer-events: none;
424
+ }
425
+
426
+ .ec-body:not(.ec-compact) .ec-line:nth-child(even):after {
427
+ border-bottom-style: dotted;
428
+ }
429
+
430
+ .ec-popup {
431
+ position: absolute;
432
+ top: 0;
433
+ display: flex;
434
+ flex-direction: column;
435
+ width: 110%;
436
+ min-width: 180px;
437
+ z-index: 1010;
438
+ padding: 8px 10px 14px;
439
+ background-color: #fff;
440
+ border-radius: 6px;
441
+ outline: 1px solid transparent;
442
+ box-shadow: 0 1px 3px 0 rgba(60, 64, 67, 0.3), 0 4px 8px 3px rgba(60, 64, 67, 0.15);
443
+ }
444
+ .ec-popup .ec-day-head {
445
+ text-align: left;
446
+ display: flex;
447
+ justify-content: space-between;
448
+ }
449
+ .ec-popup .ec-day-head a {
450
+ cursor: pointer;
451
+ font-size: 1.5em;
452
+ line-height: 0.8;
453
+ }
454
+ .ec-popup .ec-events {
455
+ margin: 0;
456
+ min-height: 0;
457
+ overflow: auto;
458
+ }
459
+
460
+ .ec-extra {
461
+ position: relative;
462
+ height: 100%;
463
+ overflow: hidden;
464
+ margin-left: -6.5px;
465
+ user-select: none;
466
+ }
467
+
468
+ .ec-now-indicator {
469
+ position: absolute;
470
+ z-index: 1005;
471
+ width: 100%;
472
+ border-top: #ea4335 solid 2px;
473
+ pointer-events: none;
474
+ }
475
+ .ec-now-indicator:before {
476
+ background: #ea4335;
477
+ border-radius: 50%;
478
+ content: "";
479
+ position: absolute;
480
+ height: 12px;
481
+ margin-top: -7px;
482
+ width: 12px;
483
+ pointer-events: none;
484
+ }
485
+
486
+ .ec-resizer {
487
+ position: absolute;
488
+ user-select: none;
489
+ }
490
+ .ec-month .ec-resizer, .ec-all-day .ec-resizer {
491
+ top: 0;
492
+ right: 0;
493
+ bottom: 0;
494
+ width: 50%;
495
+ max-width: 8px;
496
+ cursor: ew-resize;
497
+ }
498
+ .ec-week .ec-body .ec-resizer {
499
+ left: 0;
500
+ right: 0;
501
+ bottom: 0;
502
+ height: 50%;
503
+ max-height: 8px;
504
+ cursor: ns-resize;
505
+ }
506
+
507
+ .ec-dragging {
508
+ cursor: pointer !important;
509
+ }
510
+
511
+ .ec-resizing-y {
512
+ cursor: ns-resize !important;
513
+ }
514
+
515
+ .ec-resizing-x {
516
+ cursor: ew-resize !important;
517
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@event-calendar/core",
3
- "version": "0.14.3",
3
+ "version": "0.15.1",
4
4
  "title": "Event Calendar Core package",
5
5
  "description": "Full-sized drag & drop event calendar with resource view",
6
6
  "keywords": [
@@ -37,7 +37,7 @@
37
37
  "./package.json": "./package.json"
38
38
  },
39
39
  "dependencies": {
40
- "@event-calendar/common": "~0.14.3",
40
+ "@event-calendar/common": "~0.15.1",
41
41
  "svelte": "^3.55.0"
42
42
  }
43
43
  }
package/src/index.scss CHANGED
@@ -1,10 +1,9 @@
1
1
  /* Grid */
2
- .ec-month .ec-body,
3
2
  .ec-days,
4
3
  .ec-day,
5
4
  .ec-day-title,
6
5
  .ec-resource {
7
- flex: 1 1 0%; /* % for ie11 */
6
+ flex: 1 1 0;
8
7
  min-width: 0;
9
8
  max-width: 100%;
10
9
  }
@@ -189,6 +188,10 @@
189
188
  .ec:not(.ec-list) & {
190
189
  border-top: none;
191
190
  }
191
+
192
+ .ec-month & {
193
+ flex: 1 1 auto;
194
+ }
192
195
  }
193
196
 
194
197
  .ec-sidebar {
@@ -219,11 +222,7 @@
219
222
 
220
223
  .ec-month & {
221
224
  flex-direction: column;
222
- height: 100%; /* ie11 */
223
- }
224
-
225
- .ec-month .ec-uniform & {
226
- overflow: hidden;
225
+ height: 100%;
227
226
  }
228
227
 
229
228
  .ec-list & {
@@ -245,12 +244,12 @@
245
244
 
246
245
  .ec-month &,
247
246
  .ec-resource & {
248
- flex: 1 0 auto; /* ie11 */
247
+ flex: 1 0 auto;
249
248
  }
250
249
 
251
250
  .ec-month .ec-uniform & {
252
- flex: 1 1 0%;
253
- min-height: 0;
251
+ flex: 1 1 0;
252
+ min-height: calc(5em + 1px);
254
253
  }
255
254
  }
256
255
 
@@ -270,10 +269,6 @@
270
269
  position: relative;
271
270
  }
272
271
 
273
- .ec-month .ec-uniform & {
274
- min-height: 0;
275
- }
276
-
277
272
  .ec-month &:first-child {
278
273
  border-left: none;
279
274
  }
@@ -283,7 +278,7 @@
283
278
  }
284
279
 
285
280
  .ec-list & {
286
- flex: 1 0 auto; /* ie11 */
281
+ flex: 1 0 auto;
287
282
  background-color: #fff;
288
283
  border-style: solid none;
289
284
  padding: 8px 14px;