@flozy/editor 1.3.3 → 1.3.5

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.
@@ -1,463 +1,505 @@
1
- @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
1
+ @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
2
 
3
3
  .ml-1 {
4
- margin-left: 10px;
4
+ margin-left: 10px;
5
5
  }
6
6
  .dflex {
7
- display: flex;
7
+ display: flex;
8
8
  }
9
9
  .alignCenter {
10
- align-items: center;
10
+ align-items: center;
11
11
  }
12
- blockquote{
13
- border-left: 2px solid #ddd;
14
- margin-left: 0;
15
- margin-right: 0;
16
- padding-left: 10px;
17
- color: #aaa;
18
- font-style: italic;
12
+ blockquote {
13
+ border-left: 2px solid #ddd;
14
+ margin-left: 0;
15
+ margin-right: 0;
16
+ padding-left: 10px;
17
+ color: #aaa;
18
+ font-style: italic;
19
19
  }
20
20
 
21
- .editor-wrapper table,
22
- .editor-wrapperth,
21
+ .editor-wrapper table,
22
+ .editor-wrapperth,
23
23
  .editor-wrapper td {
24
- border: 1px solid black;
24
+ border: 1px solid black;
25
25
  }
26
- .editor-wrapper table{
27
- border-collapse: collapse;
26
+ .editor-wrapper table {
27
+ border-collapse: collapse;
28
28
  }
29
- .editor-wrapper .editor-wrapperbutton{
30
- background-color: white;
31
- border:none;
29
+ .editor-wrapper .editor-wrapperbutton {
30
+ background-color: white;
31
+ border: none;
32
32
  }
33
- .editor-wrapper .btnActive{
34
- opacity: 1;
33
+ .editor-wrapper .btnActive {
34
+ opacity: 1;
35
35
  }
36
- .editor-wrapper{
37
- font-family:'Helvetica','Arial', sans-serif;
38
- background: #ffffff;
39
- min-height: 400px;
40
- height: fit-content;
41
- max-width: 100%;
42
- border: none !important;
43
- z-index: 1;
36
+ .editor-wrapper {
37
+ font-family: "Helvetica", "Arial", sans-serif;
38
+ background: #ffffff;
39
+ min-height: 400px;
40
+ height: fit-content;
41
+ max-width: 100%;
42
+ border: none !important;
43
+ z-index: 1;
44
44
  }
45
45
 
46
- .editor-wrapper table{
47
- /* width:100%; */
46
+ .editor-wrapper table {
47
+ /* width:100%; */
48
48
  }
49
- .editor-wrapper td{
50
- height: 50px;
51
- padding:0 5px;
49
+ .editor-wrapper td {
50
+ height: 50px;
51
+ padding: 0 5px;
52
52
  }
53
53
  .popup-wrapper1 {
54
- display: inline;
55
- position: relative;
56
- }
57
- .af-popup{
58
- position: fixed;
59
- left: 0;
60
- right: 0;
61
- top: 0;
62
- bottom: 0;
63
- margin: auto;
64
- background-color: white;
65
- padding: 20px;
66
- border-radius: 6px;
67
- /* border: 1px solid lightgray; */
68
- height: fit-content !important;
69
- z-index: 999;
70
- width: 300px;
71
-
72
- }
73
- .editor-wrapper button{
74
- cursor: pointer;
54
+ display: inline;
55
+ position: relative;
56
+ }
57
+ .af-popup {
58
+ position: fixed;
59
+ left: 0;
60
+ right: 0;
61
+ top: 0;
62
+ bottom: 0;
63
+ margin: auto;
64
+ background-color: white;
65
+ padding: 20px;
66
+ border-radius: 6px;
67
+ /* border: 1px solid lightgray; */
68
+ height: fit-content !important;
69
+ z-index: 999;
70
+ width: 300px;
71
+ }
72
+ .editor-wrapper button {
73
+ cursor: pointer;
75
74
  }
76
75
  .editor-wrapper code {
77
- font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
78
- monospace;
76
+ font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
77
+ monospace;
79
78
  }
80
- .editor-wrapper html{
81
- scroll-behavior: smooth;
79
+ .editor-wrapper html {
80
+ scroll-behavior: smooth;
82
81
  }
83
82
  .editor-wrapper *:focus-visible {
84
- outline: none;
83
+ outline: none;
85
84
  }
86
85
 
87
86
  .grid-container {
88
- display: flex;
89
- border-radius: 0px;
90
- background-color: transparent;
91
- border: 0px solid #E5EAF2;
92
- padding: 16px;
93
- position: relative;
94
- flex-wrap: wrap;
87
+ display: flex;
88
+ border-radius: 0px;
89
+ background-color: transparent;
90
+ border: 0px solid #e5eaf2;
91
+ padding: 0px;
92
+ position: relative;
93
+ flex-wrap: wrap;
95
94
  }
96
95
 
97
96
  .grid-container-toolbar,
98
97
  .grid-item-toolbar {
99
- position: absolute;
100
- right: 0;
101
- top: -30px;
98
+ position: absolute;
99
+ display: flex;
100
+ flex-direction: column;
101
+ pointer-events: auto;
102
+ }
103
+
104
+ .grid-container-toolbar {
105
+ right: -52px;
106
+ }
107
+
108
+ .grid-item-toolbar {
109
+ left: -52px;
102
110
  }
103
111
 
104
112
  .element-toolbar {
105
- position: absolute;
106
- right: 0;
107
- top: -14px;
108
- z-index: 1000;
113
+ position: absolute;
114
+ right: 0;
115
+ top: -14px;
116
+ z-index: 1000;
109
117
  }
110
118
 
111
119
  .grid-container-toolbar button,
112
120
  .grid-item-toolbar button,
113
121
  .element-toolbar button {
114
- /* margin-right: 8px;
122
+ /* margin-right: 8px;
115
123
  background-color: rgba(0, 0, 0, 0.8);
116
124
  color: #FFF; */
117
- margin-left: 8px;
118
- background-color: rgb(255 255 255);
119
- color: #64748b;
120
- padding: 5px;
121
- font-size: 12px;
122
- border-radius: 4px;
123
- border: 1px solid #64748b;
125
+ /* margin-left: 8px; */
126
+ background-color: rgb(255 255 255);
127
+ color: #64748b;
128
+ font-size: 12px;
129
+ border-radius: 4px;
130
+ border: 1px solid #64748b;
131
+ margin-bottom: 6px;
124
132
  }
125
133
 
126
134
  .grid-item {
127
- padding: 16px;
128
- background-color: #fff;
129
- position: relative;
135
+ padding: 0px;
136
+ background-color: #fff;
137
+ position: relative;
130
138
  }
131
139
 
132
140
  .accordion-container {
133
- padding: 0px;
141
+ padding: 0px;
134
142
  }
135
143
 
136
144
  .accordion-title {
137
- position: relative;
138
- background-color: #CCC;
139
- display: flex;
140
- align-items: center;
145
+ position: relative;
146
+ background-color: #ccc;
147
+ display: flex;
148
+ align-items: center;
141
149
  }
142
150
 
143
151
  .accordion-content {
144
- padding-left: 32px;
145
- background-color: #eee;
146
- border: 1px solid #CCC;
152
+ padding-left: 32px;
153
+ background-color: #eee;
154
+ border: 1px solid #ccc;
147
155
  }
148
156
 
149
157
  .accordion-summary-container {
150
- padding: 8px 0px;
151
- margin: 0px;
152
- position: relative;
153
- padding-left: 16px;
158
+ padding: 8px 0px;
159
+ margin: 0px;
160
+ position: relative;
161
+ padding-left: 16px;
154
162
  }
155
163
 
156
164
  .accordion-summary-collapse-btn {
157
- width: 32px;
158
- height: 32px;
159
- z-index: 1;
160
- border-radius: 50%;
161
- display: flex;
162
- justify-content: center;
163
- align-items: center;
164
- margin-left: 12px;
165
- margin-right: 12px;
166
- position: relative;
165
+ width: 32px;
166
+ height: 32px;
167
+ z-index: 1;
168
+ border-radius: 50%;
169
+ display: flex;
170
+ justify-content: center;
171
+ align-items: center;
172
+ margin-left: 12px;
173
+ margin-right: 12px;
174
+ position: relative;
167
175
  }
168
176
 
169
177
  .accordion-details-container {
170
- margin: 0px;
171
- padding: 8px;
178
+ margin: 0px;
179
+ padding: 8px;
172
180
  }
173
181
 
174
182
  .signature-btn-container button {
175
- background-color: #0052CC;
176
- padding: 8px 12px;
177
- color: #FFFFFF;
178
- font-weight: bold;
179
- border-radius: 12px;
180
- opacity: 1;
183
+ background-color: #0052cc;
184
+ padding: 8px 12px;
185
+ color: #ffffff;
186
+ font-weight: bold;
187
+ border-radius: 12px;
188
+ opacity: 1;
181
189
  }
182
190
 
183
191
  .signature-btn-grps {
184
- display: flex;
185
- justify-content: space-around;
192
+ display: flex;
193
+ justify-content: space-around;
186
194
  }
187
195
  .signature-btn-grps svg {
188
- height: 17px !important;
189
- width: 17px !important;
196
+ height: 17px !important;
197
+ width: 17px !important;
190
198
  }
191
199
 
192
200
  .close-popupbtn {
193
- background-color: #EDEDED !important;
194
- border-radius: 4px !important;
195
- width: 24px;
196
- height: 24px;
201
+ background-color: #ededed !important;
202
+ border-radius: 4px !important;
203
+ width: 24px;
204
+ height: 24px;
197
205
  }
198
206
 
199
- .close-popupbtn svg {
200
- width: 17px;
201
- height: 17px;
207
+ .close-popupbtn svg {
208
+ width: 17px;
209
+ height: 17px;
202
210
  }
203
211
 
204
212
  .popupTitle {
205
- font-size: 16px !important;
206
- font-weight: 600 !important;
207
- font-family: Inter, sans-serif;
208
- text-transform: uppercase;
213
+ font-size: 16px !important;
214
+ font-weight: 600 !important;
215
+ font-family: Inter, sans-serif;
216
+ text-transform: uppercase;
209
217
  }
210
218
 
211
-
212
-
213
219
  .signature-tab-content {
214
- display: flex;
215
- margin: 12px 0px;
216
- padding: 0px 5px;
217
- border: 0px solid #CCC;
218
- min-height: 100px;
220
+ display: flex;
221
+ margin: 12px 0px;
222
+ padding: 0px 5px;
223
+ border: 0px solid #ccc;
224
+ min-height: 100px;
219
225
  }
220
226
 
221
227
  .signature-signed-wrapper {
222
- position: relative;
223
- display: flex;
228
+ position: relative;
229
+ display: flex;
224
230
  }
225
231
  .signature-signed-span {
226
- position: relative;
232
+ position: relative;
227
233
  }
228
234
  .signature-signed-wrapper .signed-btn-del {
229
- position: absolute;
230
- right: -20px;
231
- top: -20px;
232
- opacity: 1;
233
- z-index: 1;
235
+ position: absolute;
236
+ right: -20px;
237
+ top: -20px;
238
+ opacity: 1;
239
+ z-index: 1;
234
240
  }
235
241
  .signed-btn {
236
- text-align: center;
237
- opacity: 1;
242
+ text-align: center;
243
+ opacity: 1;
238
244
  }
239
245
 
240
246
  .signed-text {
241
- display: flex;
242
- justify-content: center;
243
- margin-bottom: 8px;
244
- padding-bottom: 8px;
245
- border-bottom: 1px solid #000;
247
+ display: flex;
248
+ justify-content: center;
249
+ margin-bottom: 8px;
250
+ padding-bottom: 8px;
251
+ border-bottom: 1px solid #000;
246
252
  }
247
253
 
248
254
  .typesignature-fontfamily .MuiButtonBase-root {
249
- opacity: 1;
250
- border: 1px solid #cccccc6b;
251
- color: #0F172A;
252
- box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.08);
255
+ opacity: 1;
256
+ border: 1px solid #cccccc6b;
257
+ color: #0f172a;
258
+ box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.08);
253
259
  }
254
260
  .typesignature-fontfamily .MuiButtonBase-root.active {
255
- border: 1px solid #0052CC;
261
+ border: 1px solid #0052cc;
256
262
  }
257
263
  .typesignature-input-wrapper .MuiInputAdornment-root .MuiButtonBase-root {
258
- background-color: #E9EBF8 !important;
259
- border-radius: 4px !important;
260
- width: 24px;
261
- height: 24px;
262
- padding: 2px;
263
- }
264
- .typesignature-input-wrapper .MuiInputAdornment-root svg{
265
- width: 100%;
266
- height: 100%;
267
- }
268
-
269
- .signature-canvas{
270
- height: 100%;
271
- width: 100%;
272
- border: 1px solid #0052CC;
273
- border-radius: 12px;
274
- }
264
+ background-color: #e9ebf8 !important;
265
+ border-radius: 4px !important;
266
+ width: 24px;
267
+ height: 24px;
268
+ padding: 2px;
269
+ }
270
+ .typesignature-input-wrapper .MuiInputAdornment-root svg {
271
+ width: 100%;
272
+ height: 100%;
273
+ }
275
274
 
276
- .react-datepicker__input-container {
277
- display: flex !important;
278
- align-items: center;
279
- }
280
- .react-datepicker__input-container input {
281
- height: 27px;
282
- border: 1px solid #ccc;
283
- border-radius: 5px;
284
- width: 100%;
285
- }
275
+ .signature-canvas {
276
+ height: 100%;
277
+ width: 100%;
278
+ border: 1px solid #0052cc;
279
+ border-radius: 12px;
280
+ }
286
281
 
287
- .brushcolorpic {
282
+ .react-datepicker__input-container {
283
+ display: flex !important;
284
+ align-items: center;
285
+ }
286
+ .react-datepicker__input-container input {
287
+ height: 27px;
288
+ border: 1px solid #ccc;
289
+ border-radius: 5px;
290
+ width: 100%;
291
+ }
288
292
 
289
- }
290
- .sizeIcons .MuiButtonBase-root {
291
- opacity: 1;
292
- }
293
- .sizeIcons .MuiButtonBase-root.active .MuiSvgIcon-root {
294
- fill: #0052CC;
295
- }
293
+ .brushcolorpic {
294
+ }
295
+ .sizeIcons .MuiButtonBase-root {
296
+ opacity: 1;
297
+ }
298
+ .sizeIcons .MuiButtonBase-root.active .MuiSvgIcon-root {
299
+ fill: #0052cc;
300
+ }
296
301
 
297
- .dialog-actions-si .MuiButtonBase-root {
298
- opacity: 1;
299
- }
302
+ .dialog-actions-si .MuiButtonBase-root {
303
+ opacity: 1;
304
+ }
300
305
 
301
- .signature-tab {
302
- display: flex;
303
- align-items: center;
304
- justify-content: center;
305
- flex-direction: column;
306
- width: 100%;
307
- }
306
+ .signature-tab {
307
+ display: flex;
308
+ align-items: center;
309
+ justify-content: center;
310
+ flex-direction: column;
311
+ width: 100%;
312
+ }
308
313
 
309
- .upload-sign-img-wrapper {
310
- text-align: center;
311
- }
314
+ .upload-sign-img-wrapper {
315
+ text-align: center;
316
+ }
312
317
 
313
- .signature-tab img {
314
- width: 150px;
315
- height: auto;
316
- }
318
+ .signature-tab img {
319
+ width: 150px;
320
+ height: auto;
321
+ }
317
322
 
318
- .editor-btn-wrapper {
319
- position: relative;
320
- }
323
+ .editor-btn-wrapper {
324
+ position: relative;
325
+ }
321
326
 
322
- .editor-btn {
323
- opacity: 1;
324
- }
327
+ .editor-btn {
328
+ opacity: 1;
329
+ }
325
330
 
326
- .editor-btn-options .MuiList-root {
327
- display: flex;
328
- }
331
+ .editor-btn-options .MuiList-root {
332
+ display: flex;
333
+ }
329
334
 
330
- .input-adorn .MuiInputAdornment-root .MuiIconButton-root.active {
331
- background-color: #CCC;
332
- }
335
+ .input-adorn .MuiInputAdornment-root .MuiIconButton-root.active {
336
+ background-color: #ccc;
337
+ }
333
338
 
334
- .empty-carousel-wrapper {
335
- display: flex;
336
- flex-direction: column;
337
- overflow-x: auto;
338
- }
339
- .empty-carousel-wrapper > div{
340
- display: flex;
341
- flex-direction: column;
342
- flex-shrink: 0;
343
- border: 1px solid #000;
344
- }
345
- .empty-carousel-wrapper .carousel-item-inner {
346
- width: 100%;
347
- }
339
+ .empty-carousel-wrapper {
340
+ display: flex;
341
+ flex-direction: column;
342
+ overflow-x: auto;
343
+ }
344
+ .empty-carousel-wrapper > div {
345
+ display: flex;
346
+ flex-direction: column;
347
+ flex-shrink: 0;
348
+ border: 1px solid #000;
349
+ }
350
+ .empty-carousel-wrapper .carousel-item-inner {
351
+ width: 100%;
352
+ }
348
353
 
349
- .editor-chip-text {
350
- padding: 4px;
351
- background-color: #CCC;
352
- }
354
+ .editor-chip-text {
355
+ padding: 4px;
356
+ background-color: #ccc;
357
+ }
353
358
 
354
- .drawer-menu {
355
- display: inline-flex;
356
- }
359
+ .drawer-menu {
360
+ display: inline-flex;
361
+ }
357
362
 
358
- .MuiButton-root.primaryBtn {
359
- background: #2563eb !important;
360
- box-shadow: 0px 8px 24px rgba(30, 64, 175, 0.08);
361
- border-radius: 8px !important;
362
- height: 28px !important;
363
- font-weight: 600 !important;
364
- font-size: 12px !important;
365
- color: #ffffff !important;
366
- border: 1px solid #2563eb !important;
367
- width: auto !important;
368
- }
369
- .MuiButton-root.secondaryBtn {
370
- background: #ffffff;
371
- border: 1px solid #2563eb !important;
372
- box-shadow: 0px 8px 24px rgba(30, 64, 175, 0.08);
373
- border-radius: 8px !important;
374
- height: 28px !important;
375
- font-weight: 600 !important;
376
- font-size: 12px !important;
377
- margin-right: 15px !important;
378
- color: #2563EB;
379
- width: auto !important;
380
- }
363
+ .MuiButton-root.primaryBtn {
364
+ background: #2563eb !important;
365
+ box-shadow: 0px 8px 24px rgba(30, 64, 175, 0.08);
366
+ border-radius: 8px !important;
367
+ height: 28px !important;
368
+ font-weight: 600 !important;
369
+ font-size: 12px !important;
370
+ color: #ffffff !important;
371
+ border: 1px solid #2563eb !important;
372
+ width: auto !important;
373
+ }
374
+ .MuiButton-root.secondaryBtn {
375
+ background: #ffffff;
376
+ border: 1px solid #2563eb !important;
377
+ box-shadow: 0px 8px 24px rgba(30, 64, 175, 0.08);
378
+ border-radius: 8px !important;
379
+ height: 28px !important;
380
+ font-weight: 600 !important;
381
+ font-size: 12px !important;
382
+ margin-right: 15px !important;
383
+ color: #2563eb;
384
+ width: auto !important;
385
+ }
381
386
  .deleteBtn {
382
- background: #ffffff;
383
- border: 1px solid #d32f2f !important;
384
- box-shadow: 0px 8px 24px rgba(30, 64, 175, 0.08);
385
- border-radius: 8px !important;
386
- height: 28px !important;
387
- font-weight: 600 !important;
388
- font-size: 12px !important;
389
- margin-right: 15px !important;
390
- color: #d32f2f;
391
- width: auto !important;
387
+ background: #ffffff;
388
+ border: 1px solid #d32f2f !important;
389
+ box-shadow: 0px 8px 24px rgba(30, 64, 175, 0.08);
390
+ border-radius: 8px !important;
391
+ height: 28px !important;
392
+ font-weight: 600 !important;
393
+ font-size: 12px !important;
394
+ margin-right: 15px !important;
395
+ color: #d32f2f;
396
+ width: auto !important;
392
397
  }
393
398
  @media (max-width: 480px) {
394
- .toolbar {
395
- display: flex;
396
- flex-wrap: nowrap;
397
- overflow-x: scroll;
398
- }
399
- .toolbar-grp1,
400
- .toolbar-grp1 > div {
401
- display: flex;
402
- }
403
- .grid-item {
404
- width: 100% !important;
405
- }
399
+ .toolbar {
400
+ display: flex;
401
+ flex-wrap: nowrap;
402
+ overflow-x: scroll;
403
+ }
404
+ .toolbar-grp1,
405
+ .toolbar-grp1 > div {
406
+ display: flex;
407
+ }
408
+ .grid-item {
409
+ width: 100% !important;
410
+ }
406
411
  }
407
412
 
408
-
409
413
  .editorTabs {
410
- height: 40px;
411
- min-height: 40px;
414
+ height: 40px;
415
+ min-height: 40px;
412
416
  }
413
417
 
414
418
  .editorTabs .MuiTab-root {
415
- min-width: 80px;
416
- min-height: 30px !important;
417
- font-size: 14px;
418
- /* max-width: 130px; */
419
- /* padding: 6px 6px !important; */
420
- color: #0F172A;
421
- text-transform: capitalize;
419
+ min-width: 80px;
420
+ min-height: 30px !important;
421
+ font-size: 14px;
422
+ /* max-width: 130px; */
423
+ /* padding: 6px 6px !important; */
424
+ color: #0f172a;
425
+ text-transform: capitalize;
422
426
  }
423
427
 
424
428
  .editorTabs .MuiTabScrollButton-horizontal.Mui-disabled {
425
- display: none;
429
+ display: none;
426
430
  }
427
- .editorTabs .MuiTabs-scroller {
428
- border-bottom: 1px solid #8080801c;
431
+ .editorTabs .MuiTabs-scroller {
432
+ border-bottom: 1px solid #8080801c;
429
433
  }
430
434
 
431
- .btnColorPicker .MuiOutlinedInput-input, .tablePopup .MuiOutlinedInput-input {
432
- padding: 8.5px 14px;
435
+ .btnColorPicker .MuiOutlinedInput-input,
436
+ .tablePopup .MuiOutlinedInput-input {
437
+ padding: 8.5px 14px;
433
438
  }
434
439
 
435
440
  .toolbar svg {
436
- /* fill: 'red' */
441
+ /* fill: 'red' */
437
442
  }
438
443
 
439
444
  .MuiIconButton-root.btnActive {
440
- background-color: #ccc;
445
+ background-color: #ccc;
441
446
  }
442
447
 
443
448
  .embed .element-toolbar {
444
- left: 0;
445
- right: 0;
446
- bottom: 0;
447
- top: auto;
448
- width: fit-content;
449
- height: fit-content;
450
- margin: auto;
449
+ left: 0;
450
+ right: 0;
451
+ bottom: 0;
452
+ top: auto;
453
+ width: fit-content;
454
+ height: fit-content;
455
+ margin: auto;
451
456
  }
452
457
 
453
458
  .resize-br {
454
- position: absolute !important;
455
- bottom: 2px;
456
- right: 2px;
459
+ position: absolute !important;
460
+ bottom: 2px;
461
+ right: 2px;
457
462
  }
458
463
  .visible-on-hover {
459
- display: none !important;
464
+ display: none !important;
460
465
  }
461
466
  .has-hover:hover .visible-on-hover {
462
- display: flex !important;
467
+ display: flex !important;
468
+ }
469
+
470
+ .page-builder .editor-wrapper {
471
+ max-width: 80%;
472
+ margin-top: 24px;
473
+ }
474
+
475
+ .element-root .element-selector {
476
+ position: absolute;
477
+ width: calc(100% + 16px);
478
+ height: calc(100% + 16px);
479
+ border: 4px solid #2684ff;
480
+ display: none;
481
+ pointer-events: none;
482
+ top: -12px;
483
+ left: -12px;
484
+ z-index: 100;
485
+ }
486
+
487
+ .element-selector.selected {
488
+ display: block;
489
+ }
490
+
491
+ .element-toolbar button {
492
+ margin-right: 6px;
493
+ }
494
+
495
+ .empty-carousel-wrapper .element-selector {
496
+ width: 100%;
497
+ }
498
+
499
+ .empty-carousel-wrapper .grid-container-toolbar {
500
+ right: 0px;
501
+ }
502
+
503
+ .empty-carousel-wrapper .grid-item-toolbar {
504
+ left: 0px;
463
505
  }