@vonaffenfels/slate-editor 1.1.71 → 1.2.0

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.
Files changed (94) hide show
  1. package/.babelrc +43 -43
  2. package/README.md +5 -5
  3. package/componentLoader.js +93 -93
  4. package/dist/BlockEditor.css +4 -1871
  5. package/dist/BlockEditor.js +336 -3960
  6. package/dist/BlockEditor.js.LICENSE.txt +61 -0
  7. package/dist/Renderer.js +2 -2081
  8. package/dist/Renderer.js.LICENSE.txt +15 -0
  9. package/dist/fromHTML.js +1 -78
  10. package/dist/index.css +4 -1871
  11. package/dist/index.js +336 -4037
  12. package/dist/index.js.LICENSE.txt +69 -0
  13. package/dist/toHTML.js +2 -1689
  14. package/dist/toHTML.js.LICENSE.txt +23 -0
  15. package/dist/toText.js +2 -1689
  16. package/dist/toText.js.LICENSE.txt +23 -0
  17. package/package.json +2 -2
  18. package/postcss.config.js +6 -6
  19. package/scss/demo.scss +148 -148
  20. package/scss/sidebarEditor.scss +181 -181
  21. package/scss/toolbar.scss +161 -161
  22. package/src/Blocks/EmptyBlock.js +11 -11
  23. package/src/Blocks/EmptyWrapper.js +4 -4
  24. package/src/Blocks/ErrorBoundary.js +40 -40
  25. package/src/Blocks/LayoutBlock.js +274 -274
  26. package/src/Blocks/LayoutSlot.js +90 -90
  27. package/src/CollapsableMenu/CollapsableMenu.js +48 -48
  28. package/src/Context/StorybookContext.js +6 -6
  29. package/src/ElementAutocomplete.js +133 -133
  30. package/src/Loader.js +137 -137
  31. package/src/Nodes/Default.js +158 -158
  32. package/src/Nodes/Leaf.js +54 -54
  33. package/src/Nodes/Text.js +97 -97
  34. package/src/ObjectId.js +3 -3
  35. package/src/Renderer.js +73 -73
  36. package/src/Serializer/Html.js +42 -42
  37. package/src/Serializer/Serializer.js +371 -371
  38. package/src/Serializer/Text.js +17 -17
  39. package/src/Serializer/ads.js +174 -174
  40. package/src/Serializer/index.js +3 -3
  41. package/src/SidebarEditor/AssetList.js +181 -181
  42. package/src/SidebarEditor/Fields/CloudinaryContentSelect.js +89 -89
  43. package/src/SidebarEditor/Fields/ColorPicker.js +89 -89
  44. package/src/SidebarEditor/Fields/ContentfulContentSelect.js +62 -62
  45. package/src/SidebarEditor/Fields/DateTime.js +55 -55
  46. package/src/SidebarEditor/Fields/MVP.js +66 -66
  47. package/src/SidebarEditor/Fields/MultiSelect.js +13 -13
  48. package/src/SidebarEditor/Fields/RemoteMultiSelect.js +40 -40
  49. package/src/SidebarEditor/Fields/RemoteSelect.js +39 -39
  50. package/src/SidebarEditor/Fields/Select.js +47 -47
  51. package/src/SidebarEditor/Fields/StreamSelect.js +15 -15
  52. package/src/SidebarEditor/Fields/Switch.js +34 -34
  53. package/src/SidebarEditor/Fields/Textarea.js +21 -21
  54. package/src/SidebarEditor/Resizable.js +85 -85
  55. package/src/Storybook.js +151 -151
  56. package/src/Toolbar/Align.js +64 -64
  57. package/src/Toolbar/Anchor.js +94 -94
  58. package/src/Toolbar/Block.js +135 -135
  59. package/src/Toolbar/Element.js +44 -44
  60. package/src/Toolbar/Formats.js +71 -71
  61. package/src/Toolbar/Insert.js +28 -28
  62. package/src/Toolbar/Layout.js +399 -399
  63. package/src/Toolbar/Link.js +164 -164
  64. package/src/Toolbar/Toolbar.js +235 -235
  65. package/src/Tools/Margin.js +51 -51
  66. package/src/Translation/TranslationToolbarButton.js +115 -115
  67. package/src/dev/draftToSlate.json +3147 -3147
  68. package/src/dev/index.css +2 -2
  69. package/src/dev/index.html +10 -10
  70. package/src/dev/index.js +4 -4
  71. package/src/dev/sampleValue1.json +4294 -4294
  72. package/src/dev/sampleValueValid.json +410 -410
  73. package/src/dev/testComponents/TestStory.js +74 -74
  74. package/src/dev/testComponents/TestStory.stories.js +216 -216
  75. package/src/dev/testComponents/TestStory2.js +74 -74
  76. package/src/dev/testComponents/TestStory2.stories.js +197 -197
  77. package/src/dev/testComponents/TestStory3.js +74 -74
  78. package/src/dev/testComponents/TestStory3.stories.js +197 -197
  79. package/src/dev/testSampleValue.json +746 -746
  80. package/src/fromHTML.js +4 -4
  81. package/src/helper/array.js +8 -8
  82. package/src/index.js +10 -10
  83. package/src/plugins/ListItem.js +48 -48
  84. package/src/plugins/SoftBreak.js +23 -23
  85. package/src/toHTML.js +6 -6
  86. package/src/toText.js +6 -6
  87. package/src/util/reduceContentfulResponse.js +64 -64
  88. package/src/util.js +19 -19
  89. package/storyLoader.js +47 -47
  90. package/tailwind.config.js +4 -4
  91. package/webpack.config.build.js +55 -55
  92. package/webpack.config.dev.js +60 -60
  93. package/webpack.config.js +130 -130
  94. package/webpack.config.watch.js +4 -4
package/dist/index.css CHANGED
@@ -1,1871 +1,4 @@
1
- @charset "UTF-8";
2
- /*
3
- ! tailwindcss v3.3.5 | MIT License | https://tailwindcss.com
4
- */ /*
5
- 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
6
- 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
7
- */
8
- *,
9
- ::before,
10
- ::after {
11
- box-sizing: border-box; /* 1 */
12
- border-width: 0; /* 2 */
13
- border-style: solid; /* 2 */
14
- border-color: #e5e7eb; /* 2 */
15
- }
16
-
17
- ::before,
18
- ::after {
19
- --tw-content: "";
20
- }
21
-
22
- /*
23
- 1. Use a consistent sensible line-height in all browsers.
24
- 2. Prevent adjustments of font size after orientation changes in iOS.
25
- 3. Use a more readable tab size.
26
- 4. Use the user's configured `sans` font-family by default.
27
- 5. Use the user's configured `sans` font-feature-settings by default.
28
- 6. Use the user's configured `sans` font-variation-settings by default.
29
- */
30
- html {
31
- line-height: 1.5; /* 1 */
32
- -webkit-text-size-adjust: 100%; /* 2 */
33
- -moz-tab-size: 4; /* 3 */
34
- -o-tab-size: 4;
35
- tab-size: 4; /* 3 */
36
- font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
37
- font-feature-settings: normal; /* 5 */
38
- font-variation-settings: normal; /* 6 */
39
- }
40
-
41
- /*
42
- 1. Remove the margin in all browsers.
43
- 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
44
- */
45
- body {
46
- margin: 0; /* 1 */
47
- line-height: inherit; /* 2 */
48
- }
49
-
50
- /*
51
- 1. Add the correct height in Firefox.
52
- 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
53
- 3. Ensure horizontal rules are visible by default.
54
- */
55
- hr {
56
- height: 0; /* 1 */
57
- color: inherit; /* 2 */
58
- border-top-width: 1px; /* 3 */
59
- }
60
-
61
- /*
62
- Add the correct text decoration in Chrome, Edge, and Safari.
63
- */
64
- abbr:where([title]) {
65
- -webkit-text-decoration: underline dotted;
66
- text-decoration: underline dotted;
67
- }
68
-
69
- /*
70
- Remove the default font size and weight for headings.
71
- */
72
- h1,
73
- h2,
74
- h3,
75
- h4,
76
- h5,
77
- h6 {
78
- font-size: inherit;
79
- font-weight: inherit;
80
- }
81
-
82
- /*
83
- Reset links to optimize for opt-in styling instead of opt-out.
84
- */
85
- a {
86
- color: inherit;
87
- text-decoration: inherit;
88
- }
89
-
90
- /*
91
- Add the correct font weight in Edge and Safari.
92
- */
93
- b,
94
- strong {
95
- font-weight: bolder;
96
- }
97
-
98
- /*
99
- 1. Use the user's configured `mono` font family by default.
100
- 2. Correct the odd `em` font sizing in all browsers.
101
- */
102
- code,
103
- kbd,
104
- samp,
105
- pre {
106
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
107
- font-size: 1em; /* 2 */
108
- }
109
-
110
- /*
111
- Add the correct font size in all browsers.
112
- */
113
- small {
114
- font-size: 80%;
115
- }
116
-
117
- /*
118
- Prevent `sub` and `sup` elements from affecting the line height in all browsers.
119
- */
120
- sub,
121
- sup {
122
- font-size: 75%;
123
- line-height: 0;
124
- position: relative;
125
- vertical-align: baseline;
126
- }
127
-
128
- sub {
129
- bottom: -0.25em;
130
- }
131
-
132
- sup {
133
- top: -0.5em;
134
- }
135
-
136
- /*
137
- 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
138
- 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
139
- 3. Remove gaps between table borders by default.
140
- */
141
- table {
142
- text-indent: 0; /* 1 */
143
- border-color: inherit; /* 2 */
144
- border-collapse: collapse; /* 3 */
145
- }
146
-
147
- /*
148
- 1. Change the font styles in all browsers.
149
- 2. Remove the margin in Firefox and Safari.
150
- 3. Remove default padding in all browsers.
151
- */
152
- button,
153
- input,
154
- optgroup,
155
- select,
156
- textarea {
157
- font-family: inherit; /* 1 */
158
- font-feature-settings: inherit; /* 1 */
159
- font-variation-settings: inherit; /* 1 */
160
- font-size: 100%; /* 1 */
161
- font-weight: inherit; /* 1 */
162
- line-height: inherit; /* 1 */
163
- color: inherit; /* 1 */
164
- margin: 0; /* 2 */
165
- padding: 0; /* 3 */
166
- }
167
-
168
- /*
169
- Remove the inheritance of text transform in Edge and Firefox.
170
- */
171
- button,
172
- select {
173
- text-transform: none;
174
- }
175
-
176
- /*
177
- 1. Correct the inability to style clickable types in iOS and Safari.
178
- 2. Remove default button styles.
179
- */
180
- button,
181
- [type=button],
182
- [type=reset],
183
- [type=submit] {
184
- -webkit-appearance: button; /* 1 */
185
- background-color: transparent; /* 2 */
186
- background-image: none; /* 2 */
187
- }
188
-
189
- /*
190
- Use the modern Firefox focus style for all focusable elements.
191
- */
192
- :-moz-focusring {
193
- outline: auto;
194
- }
195
-
196
- /*
197
- Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
198
- */
199
- :-moz-ui-invalid {
200
- box-shadow: none;
201
- }
202
-
203
- /*
204
- Add the correct vertical alignment in Chrome and Firefox.
205
- */
206
- progress {
207
- vertical-align: baseline;
208
- }
209
-
210
- /*
211
- Correct the cursor style of increment and decrement buttons in Safari.
212
- */
213
- ::-webkit-inner-spin-button,
214
- ::-webkit-outer-spin-button {
215
- height: auto;
216
- }
217
-
218
- /*
219
- 1. Correct the odd appearance in Chrome and Safari.
220
- 2. Correct the outline style in Safari.
221
- */
222
- [type=search] {
223
- -webkit-appearance: textfield; /* 1 */
224
- outline-offset: -2px; /* 2 */
225
- }
226
-
227
- /*
228
- Remove the inner padding in Chrome and Safari on macOS.
229
- */
230
- ::-webkit-search-decoration {
231
- -webkit-appearance: none;
232
- }
233
-
234
- /*
235
- 1. Correct the inability to style clickable types in iOS and Safari.
236
- 2. Change font properties to `inherit` in Safari.
237
- */
238
- ::-webkit-file-upload-button {
239
- -webkit-appearance: button; /* 1 */
240
- font: inherit; /* 2 */
241
- }
242
-
243
- /*
244
- Add the correct display in Chrome and Safari.
245
- */
246
- summary {
247
- display: list-item;
248
- }
249
-
250
- /*
251
- Removes the default spacing and border for appropriate elements.
252
- */
253
- blockquote,
254
- dl,
255
- dd,
256
- h1,
257
- h2,
258
- h3,
259
- h4,
260
- h5,
261
- h6,
262
- hr,
263
- figure,
264
- p,
265
- pre {
266
- margin: 0;
267
- }
268
-
269
- fieldset {
270
- margin: 0;
271
- padding: 0;
272
- }
273
-
274
- legend {
275
- padding: 0;
276
- }
277
-
278
- ol,
279
- ul,
280
- menu {
281
- list-style: none;
282
- margin: 0;
283
- padding: 0;
284
- }
285
-
286
- /*
287
- Reset default styling for dialogs.
288
- */
289
- dialog {
290
- padding: 0;
291
- }
292
-
293
- /*
294
- Prevent resizing textareas horizontally by default.
295
- */
296
- textarea {
297
- resize: vertical;
298
- }
299
-
300
- /*
301
- 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
302
- 2. Set the default placeholder color to the user's configured gray 400 color.
303
- */
304
- input::-moz-placeholder, textarea::-moz-placeholder {
305
- opacity: 1; /* 1 */
306
- color: #9ca3af; /* 2 */
307
- }
308
-
309
- input::placeholder,
310
- textarea::placeholder {
311
- opacity: 1; /* 1 */
312
- color: #9ca3af; /* 2 */
313
- }
314
-
315
- /*
316
- Set the default cursor for buttons.
317
- */
318
- button,
319
- [role=button] {
320
- cursor: pointer;
321
- }
322
-
323
- /*
324
- Make sure disabled buttons don't get the pointer cursor.
325
- */
326
- :disabled {
327
- cursor: default;
328
- }
329
-
330
- /*
331
- 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
332
- 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
333
- This can trigger a poorly considered lint error in some tools but is included by design.
334
- */
335
- img,
336
- svg,
337
- video,
338
- canvas,
339
- audio,
340
- iframe,
341
- embed,
342
- object {
343
- display: block; /* 1 */
344
- vertical-align: middle; /* 2 */
345
- }
346
-
347
- /*
348
- Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
349
- */
350
- img,
351
- video {
352
- max-width: 100%;
353
- height: auto;
354
- }
355
-
356
- /* Make elements with the HTML hidden attribute stay hidden by default */
357
- [hidden] {
358
- display: none;
359
- }
360
-
361
- *, ::before, ::after {
362
- --tw-border-spacing-x: 0;
363
- --tw-border-spacing-y: 0;
364
- --tw-translate-x: 0;
365
- --tw-translate-y: 0;
366
- --tw-rotate: 0;
367
- --tw-skew-x: 0;
368
- --tw-skew-y: 0;
369
- --tw-scale-x: 1;
370
- --tw-scale-y: 1;
371
- --tw-pan-x: ;
372
- --tw-pan-y: ;
373
- --tw-pinch-zoom: ;
374
- --tw-scroll-snap-strictness: proximity;
375
- --tw-gradient-from-position: ;
376
- --tw-gradient-via-position: ;
377
- --tw-gradient-to-position: ;
378
- --tw-ordinal: ;
379
- --tw-slashed-zero: ;
380
- --tw-numeric-figure: ;
381
- --tw-numeric-spacing: ;
382
- --tw-numeric-fraction: ;
383
- --tw-ring-inset: ;
384
- --tw-ring-offset-width: 0px;
385
- --tw-ring-offset-color: #fff;
386
- --tw-ring-color: rgb(59 130 246 / 0.5);
387
- --tw-ring-offset-shadow: 0 0 #0000;
388
- --tw-ring-shadow: 0 0 #0000;
389
- --tw-shadow: 0 0 #0000;
390
- --tw-shadow-colored: 0 0 #0000;
391
- --tw-blur: ;
392
- --tw-brightness: ;
393
- --tw-contrast: ;
394
- --tw-grayscale: ;
395
- --tw-hue-rotate: ;
396
- --tw-invert: ;
397
- --tw-saturate: ;
398
- --tw-sepia: ;
399
- --tw-drop-shadow: ;
400
- --tw-backdrop-blur: ;
401
- --tw-backdrop-brightness: ;
402
- --tw-backdrop-contrast: ;
403
- --tw-backdrop-grayscale: ;
404
- --tw-backdrop-hue-rotate: ;
405
- --tw-backdrop-invert: ;
406
- --tw-backdrop-opacity: ;
407
- --tw-backdrop-saturate: ;
408
- --tw-backdrop-sepia: ;
409
- }
410
-
411
- ::backdrop {
412
- --tw-border-spacing-x: 0;
413
- --tw-border-spacing-y: 0;
414
- --tw-translate-x: 0;
415
- --tw-translate-y: 0;
416
- --tw-rotate: 0;
417
- --tw-skew-x: 0;
418
- --tw-skew-y: 0;
419
- --tw-scale-x: 1;
420
- --tw-scale-y: 1;
421
- --tw-pan-x: ;
422
- --tw-pan-y: ;
423
- --tw-pinch-zoom: ;
424
- --tw-scroll-snap-strictness: proximity;
425
- --tw-gradient-from-position: ;
426
- --tw-gradient-via-position: ;
427
- --tw-gradient-to-position: ;
428
- --tw-ordinal: ;
429
- --tw-slashed-zero: ;
430
- --tw-numeric-figure: ;
431
- --tw-numeric-spacing: ;
432
- --tw-numeric-fraction: ;
433
- --tw-ring-inset: ;
434
- --tw-ring-offset-width: 0px;
435
- --tw-ring-offset-color: #fff;
436
- --tw-ring-color: rgb(59 130 246 / 0.5);
437
- --tw-ring-offset-shadow: 0 0 #0000;
438
- --tw-ring-shadow: 0 0 #0000;
439
- --tw-shadow: 0 0 #0000;
440
- --tw-shadow-colored: 0 0 #0000;
441
- --tw-blur: ;
442
- --tw-brightness: ;
443
- --tw-contrast: ;
444
- --tw-grayscale: ;
445
- --tw-hue-rotate: ;
446
- --tw-invert: ;
447
- --tw-saturate: ;
448
- --tw-sepia: ;
449
- --tw-drop-shadow: ;
450
- --tw-backdrop-blur: ;
451
- --tw-backdrop-brightness: ;
452
- --tw-backdrop-contrast: ;
453
- --tw-backdrop-grayscale: ;
454
- --tw-backdrop-hue-rotate: ;
455
- --tw-backdrop-invert: ;
456
- --tw-backdrop-opacity: ;
457
- --tw-backdrop-saturate: ;
458
- --tw-backdrop-sepia: ;
459
- }
460
-
461
- .container {
462
- width: 100%;
463
- }
464
-
465
- @media (min-width: 640px) {
466
- .container {
467
- max-width: 640px;
468
- }
469
- }
470
- @media (min-width: 768px) {
471
- .container {
472
- max-width: 768px;
473
- }
474
- }
475
- @media (min-width: 1024px) {
476
- .container {
477
- max-width: 1024px;
478
- }
479
- }
480
- @media (min-width: 1280px) {
481
- .container {
482
- max-width: 1280px;
483
- }
484
- }
485
- @media (min-width: 1536px) {
486
- .container {
487
- max-width: 1536px;
488
- }
489
- }
490
- .pointer-events-none {
491
- pointer-events: none;
492
- }
493
-
494
- .collapse {
495
- visibility: collapse;
496
- }
497
-
498
- .static {
499
- position: static;
500
- }
501
-
502
- .fixed {
503
- position: fixed;
504
- }
505
-
506
- .absolute {
507
- position: absolute;
508
- }
509
-
510
- .relative {
511
- position: relative;
512
- }
513
-
514
- .sticky {
515
- position: sticky;
516
- }
517
-
518
- .left-0 {
519
- left: 0px;
520
- }
521
-
522
- .right-0 {
523
- right: 0px;
524
- }
525
-
526
- .top-0 {
527
- top: 0px;
528
- }
529
-
530
- .top-\[80px\] {
531
- top: 80px;
532
- }
533
-
534
- .z-50 {
535
- z-index: 50;
536
- }
537
-
538
- .z-\[999999\] {
539
- z-index: 999999;
540
- }
541
-
542
- .m-2 {
543
- margin: 0.5rem;
544
- }
545
-
546
- .mx-2 {
547
- margin-left: 0.5rem;
548
- margin-right: 0.5rem;
549
- }
550
-
551
- .mx-auto {
552
- margin-left: auto;
553
- margin-right: auto;
554
- }
555
-
556
- .my-2 {
557
- margin-top: 0.5rem;
558
- margin-bottom: 0.5rem;
559
- }
560
-
561
- .my-4 {
562
- margin-top: 1rem;
563
- margin-bottom: 1rem;
564
- }
565
-
566
- .mb-1 {
567
- margin-bottom: 0.25rem;
568
- }
569
-
570
- .mb-16 {
571
- margin-bottom: 4rem;
572
- }
573
-
574
- .mb-2 {
575
- margin-bottom: 0.5rem;
576
- }
577
-
578
- .mb-4 {
579
- margin-bottom: 1rem;
580
- }
581
-
582
- .ml-16 {
583
- margin-left: 4rem;
584
- }
585
-
586
- .ml-2 {
587
- margin-left: 0.5rem;
588
- }
589
-
590
- .ml-4 {
591
- margin-left: 1rem;
592
- }
593
-
594
- .mr-1 {
595
- margin-right: 0.25rem;
596
- }
597
-
598
- .mr-16 {
599
- margin-right: 4rem;
600
- }
601
-
602
- .mr-2 {
603
- margin-right: 0.5rem;
604
- }
605
-
606
- .mr-4 {
607
- margin-right: 1rem;
608
- }
609
-
610
- .mt-1 {
611
- margin-top: 0.25rem;
612
- }
613
-
614
- .mt-16 {
615
- margin-top: 4rem;
616
- }
617
-
618
- .mt-2 {
619
- margin-top: 0.5rem;
620
- }
621
-
622
- .mt-4 {
623
- margin-top: 1rem;
624
- }
625
-
626
- .mt-\[3px\] {
627
- margin-top: 3px;
628
- }
629
-
630
- .block {
631
- display: block;
632
- }
633
-
634
- .inline-block {
635
- display: inline-block;
636
- }
637
-
638
- .\!inline {
639
- display: inline !important;
640
- }
641
-
642
- .inline {
643
- display: inline;
644
- }
645
-
646
- .flex {
647
- display: flex;
648
- }
649
-
650
- .inline-flex {
651
- display: inline-flex;
652
- }
653
-
654
- .table {
655
- display: table;
656
- }
657
-
658
- .grid {
659
- display: grid;
660
- }
661
-
662
- .contents {
663
- display: contents;
664
- }
665
-
666
- .list-item {
667
- display: list-item;
668
- }
669
-
670
- .h-5 {
671
- height: 1.25rem;
672
- }
673
-
674
- .h-6 {
675
- height: 1.5rem;
676
- }
677
-
678
- .h-full {
679
- height: 100%;
680
- }
681
-
682
- .max-h-\[28px\] {
683
- max-height: 28px;
684
- }
685
-
686
- .max-h-full {
687
- max-height: 100%;
688
- }
689
-
690
- .\!w-auto {
691
- width: auto !important;
692
- }
693
-
694
- .w-11 {
695
- width: 2.75rem;
696
- }
697
-
698
- .w-5 {
699
- width: 1.25rem;
700
- }
701
-
702
- .w-52 {
703
- width: 13rem;
704
- }
705
-
706
- .w-full {
707
- width: 100%;
708
- }
709
-
710
- .min-w-\[28px\] {
711
- min-width: 28px;
712
- }
713
-
714
- .min-w-\[32px\] {
715
- min-width: 32px;
716
- }
717
-
718
- .max-w-\[150px\] {
719
- max-width: 150px;
720
- }
721
-
722
- .shrink-0 {
723
- flex-shrink: 0;
724
- }
725
-
726
- .grow {
727
- flex-grow: 1;
728
- }
729
-
730
- .translate-x-0 {
731
- --tw-translate-x: 0px;
732
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
733
- }
734
-
735
- .translate-x-5 {
736
- --tw-translate-x: 1.25rem;
737
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
738
- }
739
-
740
- .transform {
741
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
742
- }
743
-
744
- .cursor-pointer {
745
- cursor: pointer;
746
- }
747
-
748
- .select-none {
749
- -webkit-user-select: none;
750
- -moz-user-select: none;
751
- user-select: none;
752
- }
753
-
754
- .grid-cols-1 {
755
- grid-template-columns: repeat(1, minmax(0, 1fr));
756
- }
757
-
758
- .grid-cols-2 {
759
- grid-template-columns: repeat(2, minmax(0, 1fr));
760
- }
761
-
762
- .grid-cols-3 {
763
- grid-template-columns: repeat(3, minmax(0, 1fr));
764
- }
765
-
766
- .grid-cols-4 {
767
- grid-template-columns: repeat(4, minmax(0, 1fr));
768
- }
769
-
770
- .grid-cols-5 {
771
- grid-template-columns: repeat(5, minmax(0, 1fr));
772
- }
773
-
774
- .flex-col {
775
- flex-direction: column;
776
- }
777
-
778
- .items-center {
779
- align-items: center;
780
- }
781
-
782
- .justify-end {
783
- justify-content: flex-end;
784
- }
785
-
786
- .justify-center {
787
- justify-content: center;
788
- }
789
-
790
- .gap-2 {
791
- gap: 0.5rem;
792
- }
793
-
794
- .gap-4 {
795
- gap: 1rem;
796
- }
797
-
798
- .space-x-4 > :not([hidden]) ~ :not([hidden]) {
799
- --tw-space-x-reverse: 0;
800
- margin-right: calc(1rem * var(--tw-space-x-reverse));
801
- margin-left: calc(1rem * (1 - var(--tw-space-x-reverse)));
802
- }
803
-
804
- .space-y-8 > :not([hidden]) ~ :not([hidden]) {
805
- --tw-space-y-reverse: 0;
806
- margin-top: calc(2rem * (1 - var(--tw-space-y-reverse)));
807
- margin-bottom: calc(2rem * var(--tw-space-y-reverse));
808
- }
809
-
810
- .overflow-hidden {
811
- overflow: hidden;
812
- }
813
-
814
- .overflow-scroll {
815
- overflow: scroll;
816
- }
817
-
818
- .overflow-y-auto {
819
- overflow-y: auto;
820
- }
821
-
822
- .truncate {
823
- overflow: hidden;
824
- text-overflow: ellipsis;
825
- white-space: nowrap;
826
- }
827
-
828
- .rounded-full {
829
- border-radius: 9999px;
830
- }
831
-
832
- .rounded-md {
833
- border-radius: 0.375rem;
834
- }
835
-
836
- .\!border-0 {
837
- border-width: 0px !important;
838
- }
839
-
840
- .border {
841
- border-width: 1px;
842
- }
843
-
844
- .border-2 {
845
- border-width: 2px;
846
- }
847
-
848
- .border-black {
849
- --tw-border-opacity: 1;
850
- border-color: rgb(0 0 0/var(--tw-border-opacity));
851
- }
852
-
853
- .border-transparent {
854
- border-color: transparent;
855
- }
856
-
857
- .\!bg-green-600 {
858
- --tw-bg-opacity: 1 !important;
859
- background-color: rgb(22 163 74/var(--tw-bg-opacity)) !important;
860
- }
861
-
862
- .bg-\[\#036fe3\] {
863
- --tw-bg-opacity: 1;
864
- background-color: rgb(3 111 227/var(--tw-bg-opacity));
865
- }
866
-
867
- .bg-gray-200 {
868
- --tw-bg-opacity: 1;
869
- background-color: rgb(229 231 235/var(--tw-bg-opacity));
870
- }
871
-
872
- .bg-green-500 {
873
- --tw-bg-opacity: 1;
874
- background-color: rgb(34 197 94/var(--tw-bg-opacity));
875
- }
876
-
877
- .bg-white {
878
- --tw-bg-opacity: 1;
879
- background-color: rgb(255 255 255/var(--tw-bg-opacity));
880
- }
881
-
882
- .\!p-1 {
883
- padding: 0.25rem !important;
884
- }
885
-
886
- .p-2 {
887
- padding: 0.5rem;
888
- }
889
-
890
- .p-4 {
891
- padding: 1rem;
892
- }
893
-
894
- .px-4 {
895
- padding-left: 1rem;
896
- padding-right: 1rem;
897
- }
898
-
899
- .px-8 {
900
- padding-left: 2rem;
901
- padding-right: 2rem;
902
- }
903
-
904
- .py-2 {
905
- padding-top: 0.5rem;
906
- padding-bottom: 0.5rem;
907
- }
908
-
909
- .py-4 {
910
- padding-top: 1rem;
911
- padding-bottom: 1rem;
912
- }
913
-
914
- .pb-2 {
915
- padding-bottom: 0.5rem;
916
- }
917
-
918
- .pr-2 {
919
- padding-right: 0.5rem;
920
- }
921
-
922
- .pt-1 {
923
- padding-top: 0.25rem;
924
- }
925
-
926
- .pt-2 {
927
- padding-top: 0.5rem;
928
- }
929
-
930
- .\!text-sm {
931
- font-size: 0.875rem !important;
932
- line-height: 1.25rem !important;
933
- }
934
-
935
- .\!text-xl {
936
- font-size: 1.25rem !important;
937
- line-height: 1.75rem !important;
938
- }
939
-
940
- .\!text-xs {
941
- font-size: 0.75rem !important;
942
- line-height: 1rem !important;
943
- }
944
-
945
- .text-lg {
946
- font-size: 1.125rem;
947
- line-height: 1.75rem;
948
- }
949
-
950
- .text-sm {
951
- font-size: 0.875rem;
952
- line-height: 1.25rem;
953
- }
954
-
955
- .font-bold {
956
- font-weight: 700;
957
- }
958
-
959
- .italic {
960
- font-style: italic;
961
- }
962
-
963
- .\!leading-\[18px\] {
964
- line-height: 18px !important;
965
- }
966
-
967
- .\!text-red-500 {
968
- --tw-text-opacity: 1 !important;
969
- color: rgb(239 68 68/var(--tw-text-opacity)) !important;
970
- }
971
-
972
- .\!text-white {
973
- --tw-text-opacity: 1 !important;
974
- color: rgb(255 255 255/var(--tw-text-opacity)) !important;
975
- }
976
-
977
- .text-black {
978
- --tw-text-opacity: 1;
979
- color: rgb(0 0 0/var(--tw-text-opacity));
980
- }
981
-
982
- .text-white {
983
- --tw-text-opacity: 1;
984
- color: rgb(255 255 255/var(--tw-text-opacity));
985
- }
986
-
987
- .shadow {
988
- --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
989
- --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
990
- box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-shadow);
991
- }
992
-
993
- .ring-0 {
994
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
995
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
996
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0, 0, 0, 0));
997
- }
998
-
999
- .filter {
1000
- filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
1001
- }
1002
-
1003
- .transition {
1004
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
1005
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
1006
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
1007
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1008
- transition-duration: 150ms;
1009
- }
1010
-
1011
- .duration-100 {
1012
- transition-duration: 100ms;
1013
- }
1014
-
1015
- .ease-in-out {
1016
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1017
- }
1018
-
1019
- .block-editor-wrapper {
1020
- position: relative;
1021
- display: flex;
1022
- height: 100%;
1023
- max-height: 100%;
1024
- max-width: 100%;
1025
- width: 100%;
1026
- }
1027
- .block-editor-wrapper .slate-editor-element-selected:not(.storybook-element-missing-attributes) .storybook-element-component {
1028
- outline: 2px dashed #61a2e9;
1029
- }
1030
- .block-editor-wrapper.storybook-active .slate-editor {
1031
- display: none;
1032
- overflow: hidden;
1033
- }
1034
- .block-editor-wrapper .storybook-target {
1035
- display: block;
1036
- height: 100%;
1037
- left: 0px;
1038
- position: fixed;
1039
- top: 0px;
1040
- width: 100%;
1041
- z-index: 1000;
1042
- }
1043
- .block-editor-wrapper .storybook-target:empty {
1044
- display: none;
1045
- }
1046
- .block-editor-wrapper .storybook-target .storybook-frame {
1047
- height: 100%;
1048
- width: 100%;
1049
- }
1050
- .block-editor-wrapper .storybook-target .storybook-frame iframe {
1051
- height: 100%;
1052
- width: 100%;
1053
- }
1054
- .block-editor-wrapper .slate-editor {
1055
- width: 100%;
1056
- height: 100%;
1057
- z-index: 100;
1058
- overflow-y: auto;
1059
- padding: 45px 0 0 0;
1060
- position: relative;
1061
- }
1062
- .block-editor-wrapper .slate-editor .editor-empty-element {
1063
- display: block !important;
1064
- }
1065
- .block-editor-wrapper .slate-editor p[data-slate-node=element] {
1066
- position: relative;
1067
- }
1068
- .block-editor-wrapper .slate-editor p[data-slate-node=element]:after {
1069
- font-size: 16px;
1070
- content: "P";
1071
- color: #CECECE;
1072
- position: absolute;
1073
- left: -20px;
1074
- text-transform: uppercase;
1075
- top: 0;
1076
- -webkit-user-select: none;
1077
- -moz-user-select: none;
1078
- user-select: none;
1079
- }
1080
- .block-editor-wrapper .slate-editor h1[data-slate-node=element] {
1081
- position: relative;
1082
- }
1083
- .block-editor-wrapper .slate-editor h1[data-slate-node=element]:after {
1084
- content: "h1";
1085
- font-size: 26px;
1086
- color: #CECECE;
1087
- position: absolute;
1088
- left: -36px;
1089
- text-transform: uppercase;
1090
- top: 6px;
1091
- -webkit-user-select: none;
1092
- -moz-user-select: none;
1093
- user-select: none;
1094
- }
1095
- .block-editor-wrapper .slate-editor h2[data-slate-node=element] {
1096
- position: relative;
1097
- }
1098
- .block-editor-wrapper .slate-editor h2[data-slate-node=element]:after {
1099
- content: "h2";
1100
- font-size: 24px;
1101
- color: #CECECE;
1102
- position: absolute;
1103
- left: -30px;
1104
- text-transform: uppercase;
1105
- top: 0;
1106
- -webkit-user-select: none;
1107
- -moz-user-select: none;
1108
- user-select: none;
1109
- }
1110
- .block-editor-wrapper .slate-editor h3[data-slate-node=element] {
1111
- position: relative;
1112
- }
1113
- .block-editor-wrapper .slate-editor h3[data-slate-node=element]:after {
1114
- content: "h3";
1115
- font-size: 20px;
1116
- color: #CECECE;
1117
- position: absolute;
1118
- left: -26px;
1119
- text-transform: uppercase;
1120
- top: 0;
1121
- -webkit-user-select: none;
1122
- -moz-user-select: none;
1123
- user-select: none;
1124
- }
1125
- .block-editor-wrapper .slate-editor h4[data-slate-node=element] {
1126
- position: relative;
1127
- }
1128
- .block-editor-wrapper .slate-editor h4[data-slate-node=element]:after {
1129
- content: "h4";
1130
- font-size: 16px;
1131
- color: #CECECE;
1132
- position: absolute;
1133
- left: -36px;
1134
- text-transform: uppercase;
1135
- top: 0;
1136
- -webkit-user-select: none;
1137
- -moz-user-select: none;
1138
- user-select: none;
1139
- }
1140
- .block-editor-wrapper .slate-editor h5[data-slate-node=element] {
1141
- position: relative;
1142
- }
1143
- .block-editor-wrapper .slate-editor h5[data-slate-node=element]:after {
1144
- content: "h5";
1145
- font-size: 14px;
1146
- color: #CECECE;
1147
- position: absolute;
1148
- left: -36px;
1149
- text-transform: uppercase;
1150
- top: 0;
1151
- -webkit-user-select: none;
1152
- -moz-user-select: none;
1153
- user-select: none;
1154
- }
1155
- .block-editor-wrapper .slate-editor h6[data-slate-node=element] {
1156
- position: relative;
1157
- }
1158
- .block-editor-wrapper .slate-editor h6[data-slate-node=element]:after {
1159
- content: "h6";
1160
- font-size: 12px;
1161
- color: #CECECE;
1162
- position: absolute;
1163
- left: -36px;
1164
- text-transform: uppercase;
1165
- top: 0;
1166
- -webkit-user-select: none;
1167
- -moz-user-select: none;
1168
- user-select: none;
1169
- }
1170
- .block-editor-wrapper .slate-editor .arrow-list {
1171
- list-style-type: "🠆" !important;
1172
- }
1173
- .block-editor-wrapper .slate-editor .arrow-list li::before {
1174
- content: none !important;
1175
- }
1176
- .block-editor-wrapper .slate-editor div[data-slate-editor=true] {
1177
- height: 100%;
1178
- }
1179
- .block-editor-wrapper .slate-editor .align-left {
1180
- text-align: left;
1181
- }
1182
- .block-editor-wrapper .slate-editor .align-right {
1183
- text-align: right;
1184
- }
1185
- .block-editor-wrapper .slate-editor .align-center {
1186
- text-align: center;
1187
- }
1188
- .block-editor-wrapper .slate-editor .align-justify {
1189
- text-align: justify;
1190
- }
1191
- .block-editor-wrapper .slate-editor .block-align-left {
1192
- display: inline-block;
1193
- float: left;
1194
- margin-right: 15px;
1195
- }
1196
- .block-editor-wrapper .slate-editor .block-align-undefined {
1197
- display: inline-block;
1198
- }
1199
- .block-editor-wrapper .slate-editor .block-align-right {
1200
- display: inline-block;
1201
- float: right;
1202
- margin-left: 15px;
1203
- }
1204
- .block-editor-wrapper .options-wrapper {
1205
- font-family: Arial, sans-serif;
1206
- position: relative;
1207
- color: #161616;
1208
- }
1209
- .block-editor-wrapper .options-wrapper:hover .options-container {
1210
- display: flex;
1211
- }
1212
- .block-editor-wrapper .options-wrapper .options-toolbar {
1213
- justify-content: space-between;
1214
- display: flex;
1215
- background-color: rgb(235, 235, 235);
1216
- padding: 0.25em;
1217
- }
1218
- .block-editor-wrapper .options-wrapper .options-container {
1219
- display: flex;
1220
- flex-direction: row;
1221
- justify-content: flex-end;
1222
- position: relative;
1223
- z-index: 200;
1224
- padding: 0.25em;
1225
- }
1226
- .block-editor-wrapper .options-wrapper .options-container .options-container-option {
1227
- cursor: pointer;
1228
- width: 26px;
1229
- margin-right: 0.25em;
1230
- }
1231
- .block-editor-wrapper .options-wrapper .options-container .options-container-option > svg {
1232
- width: 100%;
1233
- }
1234
- .block-editor-wrapper .options-wrapper .options-container .options-container-option.options-container-option-expand-text {
1235
- width: 100px;
1236
- }
1237
- .block-editor-wrapper .options-wrapper .options-container .options-container-option.options-container-option-delete {
1238
- color: red;
1239
- }
1240
- .block-editor-wrapper .options-wrapper .options-container.options-container-right {
1241
- self-align: flex-end;
1242
- }
1243
- .block-editor-wrapper .layout-slot-option-padding {
1244
- position: relative;
1245
- width: 26px;
1246
- height: 26px;
1247
- display: inline-block;
1248
- }
1249
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-item {
1250
- background-color: black;
1251
- display: block;
1252
- position: absolute;
1253
- cursor: pointer;
1254
- }
1255
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-item:hover {
1256
- background-color: #61a2e9;
1257
- z-index: 10;
1258
- }
1259
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-item.active {
1260
- background-color: #3490f3;
1261
- z-index: 10;
1262
- }
1263
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-top {
1264
- height: 20%;
1265
- width: 100%;
1266
- top: 0;
1267
- left: 0;
1268
- }
1269
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-right {
1270
- height: 100%;
1271
- width: 20%;
1272
- right: 0;
1273
- top: 0;
1274
- }
1275
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-bottom {
1276
- height: 20%;
1277
- width: 100%;
1278
- bottom: 0;
1279
- left: 0;
1280
- }
1281
- .block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-left {
1282
- height: 100%;
1283
- width: 20%;
1284
- top: 0;
1285
- left: 0;
1286
- }
1287
- .block-editor-wrapper .layout-block-grid {
1288
- display: grid;
1289
- }
1290
- .block-editor-wrapper .layout-block-flex {
1291
- display: flex;
1292
- }
1293
- .block-editor-wrapper .layout-block.article-width {
1294
- width: 44.4444444444%;
1295
- }
1296
- .block-editor-wrapper .layout-block.site-width {
1297
- width: 66.6666666667%;
1298
- }
1299
- .block-editor-wrapper .layout-block .layout-slot {
1300
- display: flex;
1301
- flex-direction: column;
1302
- position: relative;
1303
- outline: 1px dashed grey;
1304
- }
1305
- .block-editor-wrapper .layout-block .layout-slot .storybook-element-component {
1306
- display: block;
1307
- }
1308
- .block-editor-wrapper .layout-block .layout-slot .layout-slot-content {
1309
- flex-grow: 1;
1310
- }
1311
- .block-editor-wrapper .layout-block .layout-slot .layout-slot-options {
1312
- background-color: grey;
1313
- color: white;
1314
- font-size: 24px;
1315
- padding: 10px;
1316
- display: flex;
1317
- flex-direction: row;
1318
- justify-content: space-between;
1319
- }
1320
- .block-editor-wrapper .layout-block .layout-slot .layout-slot-options .layout-slot-option {
1321
- text-transform: uppercase;
1322
- display: inline-block;
1323
- }
1324
- .block-editor-wrapper .layout-block .layout-slot .layout-slot-options .layout-slot-name {
1325
- text-transform: uppercase;
1326
- display: inline-block;
1327
- }
1328
- .block-editor-wrapper .layout-block .layout-slot.layout-slot-grid-fill {
1329
- flex-grow: 1;
1330
- }
1331
- .block-editor-wrapper .layout-block .layout-slot.layout-slot-grid-auto {
1332
- flex-grow: 0;
1333
- width: auto;
1334
- }
1335
- @media only screen and (max-width: 360px) {
1336
- .block-editor-wrapper .layout-block {
1337
- grid-template-columns: 1fr;
1338
- }
1339
- }
1340
-
1341
- .button {
1342
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
1343
- width: 100%;
1344
- padding: 8px 0.75rem !important;
1345
- color: #FFFFFF !important;
1346
- border: 1px solid #036fe3 !important;
1347
- transition: all 100ms ease-in-out;
1348
- background-color: #036fe3 !important;
1349
- font-size: 0.875rem !important;
1350
- border-radius: 4px !important;
1351
- }
1352
-
1353
- .button:hover {
1354
- background-color: #0275F0 !important;
1355
- }
1356
-
1357
- .button:active {
1358
- background-color: #0262C9 !important;
1359
- }
1360
-
1361
- .button.button--secondary {
1362
- color: #036fe3 !important;
1363
- border: 1px solid #036fe3 !important;
1364
- background-color: transparent !important;
1365
- }
1366
-
1367
- .button.button--secondary:hover {
1368
- background-color: #036fe3 !important;
1369
- color: #FFFFFF !important;
1370
- }
1371
-
1372
- .button.button--secondary:active {
1373
- background-color: #0262C9 !important;
1374
- color: #FFFFFF !important;
1375
- }
1376
-
1377
- .button.button--tertiary {
1378
- color: rgb(90, 101, 124) !important;
1379
- background-color: white !important;
1380
- border: 1px solid #cfd9e0 !important;
1381
- }
1382
-
1383
- .button.button--tertiary:hover {
1384
- background-color: rgb(248, 248, 248) !important;
1385
- }
1386
-
1387
- .button.button--tertiary:active {
1388
- background-color: rgb(237, 237, 237) !important;
1389
- }
1390
-
1391
- .resizable.enabled .resizable-left {
1392
- max-width: calc(100vw - 300px);
1393
- }
1394
- .resizable .resizable-left {
1395
- scrollbar-width: none;
1396
- max-width: 100vw;
1397
- position: relative;
1398
- }
1399
- .resizable .resizable-right {
1400
- scrollbar-width: none;
1401
- max-width: calc(100vw - 300px);
1402
- position: relative;
1403
- }
1404
- .resizable .resizable-x-handle {
1405
- cursor: ew-resize;
1406
- content: "";
1407
- position: absolute;
1408
- height: 100%;
1409
- width: 10px;
1410
- text-align: center;
1411
- top: 0;
1412
- left: -2px;
1413
- background-color: transparent;
1414
- }
1415
-
1416
- .hover\:\!bg-green-700:hover {
1417
- --tw-bg-opacity: 1 !important;
1418
- background-color: rgb(21 128 61/var(--tw-bg-opacity)) !important;
1419
- }
1420
-
1421
- .focus\:outline-none:focus {
1422
- outline: 2px solid transparent;
1423
- outline-offset: 2px;
1424
- }
1425
-
1426
- @media (min-width: 768px) {
1427
- .md\:ml-4 {
1428
- margin-left: 1rem;
1429
- }
1430
- .md\:mr-4 {
1431
- margin-right: 1rem;
1432
- }
1433
- .md\:grid-cols-1 {
1434
- grid-template-columns: repeat(1, minmax(0, 1fr));
1435
- }
1436
- .md\:grid-cols-2 {
1437
- grid-template-columns: repeat(2, minmax(0, 1fr));
1438
- }
1439
- .md\:grid-cols-3 {
1440
- grid-template-columns: repeat(3, minmax(0, 1fr));
1441
- }
1442
- .md\:grid-cols-4 {
1443
- grid-template-columns: repeat(4, minmax(0, 1fr));
1444
- }
1445
- .md\:grid-cols-5 {
1446
- grid-template-columns: repeat(5, minmax(0, 1fr));
1447
- }
1448
- .md\:space-x-4 > :not([hidden]) ~ :not([hidden]) {
1449
- --tw-space-x-reverse: 0;
1450
- margin-right: calc(1rem * var(--tw-space-x-reverse));
1451
- margin-left: calc(1rem * (1 - var(--tw-space-x-reverse)));
1452
- }
1453
- }
1454
- .toolbar {
1455
- background-color: rgba(255, 255, 255, 0.95);
1456
- border-bottom: 1px solid rgba(0, 0, 0, 0.3);
1457
- display: none;
1458
- flex-direction: row;
1459
- justify-content: space-between;
1460
- font-family: Arial, sans-serif;
1461
- padding: 5px;
1462
- position: absolute;
1463
- z-index: 500;
1464
- }
1465
- .toolbar.toolbar-static {
1466
- display: block;
1467
- position: fixed;
1468
- width: 100%;
1469
- max-width: 100%;
1470
- top: 0px;
1471
- left: 0px;
1472
- }
1473
- .toolbar.active {
1474
- display: block;
1475
- }
1476
- .toolbar .toolbar-btns {
1477
- display: flex;
1478
- align-items: center;
1479
- }
1480
- .toolbar .toolbar-btn {
1481
- border-radius: 3px;
1482
- color: black;
1483
- cursor: pointer;
1484
- font-weight: bold;
1485
- margin-right: 5px;
1486
- padding: 5px 7px;
1487
- z-index: 500;
1488
- position: relative;
1489
- display: block;
1490
- }
1491
- .toolbar .toolbar-btn.active {
1492
- background-color: rgba(0, 0, 0, 0.3);
1493
- }
1494
- .toolbar .toolbar-btn:last-child {
1495
- margin-right: 0px;
1496
- }
1497
- .toolbar .toolbar-btn:hover, .toolbar .toolbar-btn:active {
1498
- background-color: rgba(0, 0, 0, 0.2);
1499
- }
1500
- .toolbar .toolbar-btn:hover .toolbar-btn-config, .toolbar .toolbar-btn:active .toolbar-btn-config {
1501
- display: block;
1502
- }
1503
- .toolbar .toolbar-btn .toolbar-btn-config {
1504
- position: absolute;
1505
- top: 28px;
1506
- left: 0px;
1507
- display: none;
1508
- background-color: rgba(255, 255, 255, 0.95);
1509
- border-bottom: 1px solid rgba(0, 0, 0, 0.3);
1510
- padding: 5px 7px;
1511
- }
1512
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner {
1513
- display: flex;
1514
- flex-direction: column;
1515
- }
1516
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row {
1517
- min-width: 250px;
1518
- padding: 5px 7px;
1519
- display: flex;
1520
- flex-direction: row;
1521
- }
1522
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-label {
1523
- flex-grow: 0;
1524
- padding: 0 7px 0 0;
1525
- }
1526
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-input {
1527
- flex-grow: 1;
1528
- }
1529
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-input input {
1530
- padding: 5px;
1531
- border: 1px solid grey;
1532
- background-color: white;
1533
- color: black;
1534
- }
1535
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-input input[type=checkbox]:checked {
1536
- color: white;
1537
- background-color: black;
1538
- }
1539
- .toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-btn {
1540
- display: flex;
1541
- flex-grow: 1;
1542
- border: 1px solid black;
1543
- }
1544
- .toolbar .toolbar-btn-expand {
1545
- z-index: 500;
1546
- display: block;
1547
- max-height: 28px;
1548
- overflow: hidden;
1549
- }
1550
- .toolbar .toolbar-btn-expand .toolbar-btn-expand-inner {
1551
- display: flex;
1552
- flex-direction: column;
1553
- }
1554
- .toolbar .toolbar-btn-expand .toolbar-btn-expand-inner .toolbar-btn.active {
1555
- order: -1;
1556
- }
1557
- .toolbar .toolbar-btn-expand:hover {
1558
- overflow: visible;
1559
- }
1560
- .toolbar .toolbar-btn-expand:hover .toolbar-btn-expand-inner {
1561
- background-color: rgba(255, 255, 255, 0.95);
1562
- border-bottom: 1px solid rgba(0, 0, 0, 0.3);
1563
- }
1564
- .toolbar .toolbar-btn-expand-right {
1565
- z-index: 500;
1566
- display: block;
1567
- max-height: 28px;
1568
- overflow: hidden;
1569
- }
1570
- .toolbar .toolbar-btn-expand-right .toolbar-btn-expand-inner {
1571
- left: 100%;
1572
- display: flex;
1573
- flex-direction: column;
1574
- }
1575
- .toolbar .toolbar-btn-expand-right .toolbar-btn-expand-inner .toolbar-btn.active {
1576
- order: -1;
1577
- }
1578
- .toolbar .toolbar-btn-expand-right:hover {
1579
- overflow: visible;
1580
- }
1581
- .toolbar .toolbar-btn-expand-right:hover .toolbar-btn-expand-inner {
1582
- background-color: rgba(255, 255, 255, 0.95);
1583
- border-bottom: 1px solid rgba(0, 0, 0, 0.3);
1584
- }
1585
- .storybook-element-wrapper {
1586
- max-width: 100vw;
1587
- width: 100%;
1588
- margin-left: auto;
1589
- margin-right: auto;
1590
- }
1591
-
1592
- .storybook-element {
1593
- display: inline-block;
1594
- width: 100%;
1595
- }
1596
- .storybook-element .storybook-element-component-overlay {
1597
- display: none;
1598
- width: 100%;
1599
- height: 100%;
1600
- position: absolute;
1601
- z-index: 20;
1602
- background-color: rgba(255, 255, 255, 0.7);
1603
- -webkit-backdrop-filter: blur(4px);
1604
- backdrop-filter: blur(4px);
1605
- color: black;
1606
- font-size: 1em;
1607
- align-items: center;
1608
- justify-content: center;
1609
- content-visibility: auto;
1610
- outline: 3px dashed #036fe3;
1611
- }
1612
- .storybook-element.storybook-element-missing-attributes .storybook-element-component-overlay {
1613
- display: flex;
1614
- outline: 3px dashed #ff0000;
1615
- }
1616
- .storybook-element.storybook-inline {
1617
- display: inline-block;
1618
- }
1619
- .storybook-element.storybook-inline .options-toolbar {
1620
- display: inline-block;
1621
- }
1622
- .storybook-element.storybook-inline .options-toolbar .options-container {
1623
- padding: 0.15em;
1624
- }
1625
- .storybook-element.storybook-inline .options-toolbar .options-container .options-container-option {
1626
- width: 16px;
1627
- }
1628
- .storybook-element.storybook-inline .storybook-element-component {
1629
- display: inline-block;
1630
- }
1631
- .storybook-element.storybook-inline .storybook-element-component .editor-empty-element {
1632
- min-width: 220px;
1633
- min-height: 10px;
1634
- padding: 0.15em;
1635
- }
1636
- .storybook-element.storybook-inline .storybook-element-component-overlay {
1637
- font-size: 0.75em;
1638
- min-width: 220px;
1639
- text-align: center;
1640
- }
1641
- .storybook-element.storybook-element-float-left {
1642
- float: left;
1643
- }
1644
- .storybook-element.storybook-element-float-right {
1645
- float: right;
1646
- }
1647
- .storybook-element .storybook-element-component {
1648
- -webkit-user-select: none;
1649
- -moz-user-select: none;
1650
- user-select: none;
1651
- display: block;
1652
- position: relative;
1653
- }
1654
- .storybook-element .storybook-element-component:hover .storybook-element-component-overlay {
1655
- -webkit-user-select: none;
1656
- -moz-user-select: none;
1657
- user-select: none;
1658
- display: flex;
1659
- cursor: pointer;
1660
- }
1661
- .storybook-element .storybook-element-component .editor-empty-element {
1662
- display: block;
1663
- background-color: #42000b;
1664
- color: white;
1665
- border: 1px solid black;
1666
- min-height: 40px;
1667
- padding: 2em;
1668
- min-width: 100%;
1669
- }
1670
- .storybook-element .storybook-element-component .editor-empty-element.editor-select-element {
1671
- background-color: #555555;
1672
- }
1673
- .storybook-element .storybook-element-component.storybook-inline .editor-empty-element {
1674
- min-height: 20px;
1675
- min-width: 100px;
1676
- }
1677
- .storybook-element .storybook-element-component .storybook-element-display:empty {
1678
- display: block;
1679
- background-color: red;
1680
- border: 1px solid black;
1681
- min-height: 30px;
1682
- min-width: 100px;
1683
- }
1684
- .storybook-element .storybook-element-component .storybook-element-display.storybook-element-display-empty {
1685
- display: block;
1686
- background-color: red;
1687
- border: 1px solid black;
1688
- color: white;
1689
- font-weight: bold;
1690
- font-size: 110%;
1691
- padding: 10px;
1692
- min-height: 30px;
1693
- min-width: 100px;
1694
- position: relative;
1695
- }
1696
- .storybook-element .storybook-element-component .storybook-element-display.storybook-element-display-empty::after {
1697
- position: absolute;
1698
- top: 0px;
1699
- left: 0px;
1700
- content: attr(data-content);
1701
- }
1702
- .storybook-element .storybook-element-error {
1703
- background-color: red;
1704
- padding: 15px;
1705
- font-size: 18px;
1706
- font-weight: bold;
1707
- min-height: 100px;
1708
- min-width: 100px;
1709
- }
1710
-
1711
- @container (min-width: 100px) {
1712
- .storybook-element-component-overlay {
1713
- font-size: 2em;
1714
- }
1715
- }
1716
- #sidebar-editor-wrapper {
1717
- padding-top: 45px;
1718
- height: 100%;
1719
- flex-basis: 400px;
1720
- flex-shrink: 0;
1721
- }
1722
-
1723
- #sidebar-editor {
1724
- display: flex;
1725
- flex-direction: column;
1726
- background-color: rgb(247, 249, 250);
1727
- max-height: 100%;
1728
- height: 100%;
1729
- overflow-y: auto;
1730
- padding: 16px;
1731
- /* button[data-test-id="cf-ui-button"] span {
1732
- color: #036fe3 !important;
1733
- }
1734
-
1735
- button[data-test-id="cf-ui-button"] svg {
1736
- fill: #036fe3 !important;
1737
- }
1738
-
1739
- button[data-test-id="cf-ui-button"]:hover span {
1740
- color: #FFFFFF !important;
1741
- }
1742
-
1743
- button[data-test-id="cf-ui-button"]:hover svg {
1744
- fill: #FFFFFF !important;
1745
- } */
1746
- }
1747
- #sidebar-editor * {
1748
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
1749
- }
1750
- #sidebar-editor p, #sidebar-editor label, #sidebar-editor b, #sidebar-editor span {
1751
- color: rgb(90, 101, 124);
1752
- }
1753
- #sidebar-editor label {
1754
- margin: 0 0 2px 0 !important;
1755
- }
1756
- #sidebar-editor input[type=text],
1757
- #sidebar-editor input[type=time],
1758
- #sidebar-editor input[type=date],
1759
- #sidebar-editor input[type=number],
1760
- #sidebar-editor input[type=color],
1761
- #sidebar-editor input[type=datetime-local],
1762
- #sidebar-editor input[type=search],
1763
- #sidebar-editor select,
1764
- #sidebar-editor textarea {
1765
- display: block;
1766
- font-size: 0.875rem !important;
1767
- color: rgb(90, 101, 124) !important;
1768
- background-color: white !important;
1769
- border: 1px solid #cfd9e0 !important;
1770
- border-radius: 6px !important;
1771
- box-shadow: none !important;
1772
- filter: none !important;
1773
- width: 100% !important;
1774
- padding: 8px 0.75rem !important;
1775
- }
1776
- #sidebar-editor textarea {
1777
- height: 42px;
1778
- max-height: 200px;
1779
- }
1780
- #sidebar-editor input[type=color] {
1781
- padding: 4px !important;
1782
- }
1783
- #sidebar-editor input[type=range] {
1784
- display: block;
1785
- width: 100%;
1786
- }
1787
- #sidebar-editor input[type=radio],
1788
- #sidebar-editor input[type=checkbox] {
1789
- margin-right: 8px;
1790
- margin-left: 4px;
1791
- }
1792
- #sidebar-editor option[disabled] {
1793
- color: rgba(0, 0, 0, 0.3);
1794
- }
1795
- #sidebar-editor .inline-check-wrapper {
1796
- display: inline-block;
1797
- margin-right: 8px;
1798
- }
1799
- #sidebar-editor details {
1800
- display: block;
1801
- font-size: 0.875rem !important;
1802
- color: rgb(90, 101, 124) !important;
1803
- background-color: white !important;
1804
- border: 1px solid #cfd9e0 !important;
1805
- border-radius: 6px !important;
1806
- box-shadow: none !important;
1807
- filter: none !important;
1808
- width: 100% !important;
1809
- padding: 16px !important;
1810
- }
1811
- #sidebar-editor summary {
1812
- cursor: pointer;
1813
- }
1814
- #sidebar-editor .disabled {
1815
- opacity: 0.4;
1816
- cursor: not-allowed !important;
1817
- }
1818
- #sidebar-editor .icon-button {
1819
- display: inline-block;
1820
- color: rgb(90, 101, 124) !important;
1821
- background-color: white !important;
1822
- border: 1px solid #cfd9e0 !important;
1823
- border-radius: 6px;
1824
- filter: none !important;
1825
- width: auto !important;
1826
- text-align: center;
1827
- }
1828
- #sidebar-editor .icon-button:not(.disabled):hover {
1829
- background-color: rgb(248, 248, 248) !important;
1830
- }
1831
- #sidebar-editor .icon-button:not(.disabled):active {
1832
- background-color: rgb(237, 237, 237) !important;
1833
- }
1834
- #sidebar-editor .icon-button-group {
1835
- display: inline-flex;
1836
- border-radius: 6px !important;
1837
- overflow: hidden;
1838
- border: 1px solid #cfd9e0 !important;
1839
- }
1840
- #sidebar-editor .icon-button-group .icon-button {
1841
- border-radius: 0 !important;
1842
- border: none !important;
1843
- border-right: 1px solid #cfd9e0 !important;
1844
- }
1845
- #sidebar-editor .icon-button-group .icon-button:last-child {
1846
- border: none !important;
1847
- }
1848
- #sidebar-editor .message {
1849
- font-size: 0.875rem;
1850
- padding: 16px;
1851
- border-radius: 4px;
1852
- }
1853
- #sidebar-editor .message.message--negative {
1854
- background-color: rgba(238, 26, 26, 0.2);
1855
- }
1856
- #sidebar-editor .collapsable-menu {
1857
- background-color: white !important;
1858
- border: 1px solid #cfd9e0 !important;
1859
- border-radius: 6px;
1860
- z-index: 2;
1861
- overflow: hidden;
1862
- }
1863
- #sidebar-editor .collapsable-menu-item {
1864
- color: rgb(90, 101, 124) !important;
1865
- }
1866
- #sidebar-editor .collapsable-menu-item:not(.disabled):hover {
1867
- background-color: rgb(248, 248, 248) !important;
1868
- }
1869
- #sidebar-editor .collapsable-menu-item:not(.disabled):active {
1870
- background-color: rgb(237, 237, 237) !important;
1871
- }
1
+ *,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}::before,::after{--tw-content: ""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:rgba(0,0,0,0);background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::before,::after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / 0.5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / 0.5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media(min-width: 640px){.container{max-width:640px}}@media(min-width: 768px){.container{max-width:768px}}@media(min-width: 1024px){.container{max-width:1024px}}@media(min-width: 1280px){.container{max-width:1280px}}@media(min-width: 1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.left-0{left:0px}.right-0{right:0px}.top-0{top:0px}.top-\[80px\]{top:80px}.z-50{z-index:50}.z-\[999999\]{z-index:999999}.m-2{margin:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.mb-1{margin-bottom:.25rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.ml-16{margin-left:4rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mr-1{margin-right:.25rem}.mr-16{margin-right:4rem}.mr-2{margin-right:.5rem}.mr-4{margin-right:1rem}.mt-1{margin-top:.25rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-\[3px\]{margin-top:3px}.block{display:block}.inline-block{display:inline-block}.\!inline{display:inline !important}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.contents{display:contents}.list-item{display:list-item}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-full{height:100%}.max-h-\[28px\]{max-height:28px}.max-h-full{max-height:100%}.\!w-auto{width:auto !important}.w-11{width:2.75rem}.w-5{width:1.25rem}.w-52{width:13rem}.w-full{width:100%}.min-w-\[28px\]{min-width:28px}.min-w-\[32px\]{min-width:32px}.max-w-\[150px\]{max-width:150px}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-5{--tw-translate-x: 1.25rem;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}.grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.grid-cols-5{grid-template-columns:repeat(5, minmax(0, 1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem*var(--tw-space-x-reverse));margin-left:calc(1rem*(1 - var(--tw-space-x-reverse)))}.space-y-8>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(2rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem*var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}.\!border-0{border-width:0px !important}.border{border-width:1px}.border-2{border-width:2px}.border-black{--tw-border-opacity: 1;border-color:rgb(0 0 0/var(--tw-border-opacity))}.border-transparent{border-color:rgba(0,0,0,0)}.\!bg-green-600{--tw-bg-opacity: 1 !important;background-color:rgb(22 163 74/var(--tw-bg-opacity)) !important}.bg-\[\#036fe3\]{--tw-bg-opacity: 1;background-color:rgb(3 111 227/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.bg-green-500{--tw-bg-opacity: 1;background-color:rgb(34 197 94/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.\!p-1{padding:.25rem !important}.p-2{padding:.5rem}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.pb-2{padding-bottom:.5rem}.pr-2{padding-right:.5rem}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.\!text-sm{font-size:.875rem !important;line-height:1.25rem !important}.\!text-xl{font-size:1.25rem !important;line-height:1.75rem !important}.\!text-xs{font-size:.75rem !important;line-height:1rem !important}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-bold{font-weight:700}.italic{font-style:italic}.\!leading-\[18px\]{line-height:18px !important}.\!text-red-500{--tw-text-opacity: 1 !important;color:rgb(239 68 68/var(--tw-text-opacity)) !important}.\!text-white{--tw-text-opacity: 1 !important;color:rgb(255 255 255/var(--tw-text-opacity)) !important}.text-black{--tw-text-opacity: 1;color:rgb(0 0 0/var(--tw-text-opacity))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255/var(--tw-text-opacity))}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-shadow)}.ring-0{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0, 0, 0, 0))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-100{transition-duration:100ms}.ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.block-editor-wrapper{position:relative;display:flex;height:100%;max-height:100%;max-width:100%;width:100%}.block-editor-wrapper .slate-editor-element-selected:not(.storybook-element-missing-attributes) .storybook-element-component{outline:2px dashed #61a2e9}.block-editor-wrapper.storybook-active .slate-editor{display:none;overflow:hidden}.block-editor-wrapper .storybook-target{display:block;height:100%;left:0px;position:fixed;top:0px;width:100%;z-index:1000}.block-editor-wrapper .storybook-target:empty{display:none}.block-editor-wrapper .storybook-target .storybook-frame{height:100%;width:100%}.block-editor-wrapper .storybook-target .storybook-frame iframe{height:100%;width:100%}.block-editor-wrapper .slate-editor{width:100%;height:100%;z-index:100;overflow-y:auto;padding:45px 0 0 0;position:relative}.block-editor-wrapper .slate-editor .editor-empty-element{display:block !important}.block-editor-wrapper .slate-editor p[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor p[data-slate-node=element]:after{font-size:16px;content:"P";color:#cecece;position:absolute;left:-20px;text-transform:uppercase;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor h1[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor h1[data-slate-node=element]:after{content:"h1";font-size:26px;color:#cecece;position:absolute;left:-36px;text-transform:uppercase;top:6px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor h2[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor h2[data-slate-node=element]:after{content:"h2";font-size:24px;color:#cecece;position:absolute;left:-30px;text-transform:uppercase;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor h3[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor h3[data-slate-node=element]:after{content:"h3";font-size:20px;color:#cecece;position:absolute;left:-26px;text-transform:uppercase;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor h4[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor h4[data-slate-node=element]:after{content:"h4";font-size:16px;color:#cecece;position:absolute;left:-36px;text-transform:uppercase;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor h5[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor h5[data-slate-node=element]:after{content:"h5";font-size:14px;color:#cecece;position:absolute;left:-36px;text-transform:uppercase;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor h6[data-slate-node=element]{position:relative}.block-editor-wrapper .slate-editor h6[data-slate-node=element]:after{content:"h6";font-size:12px;color:#cecece;position:absolute;left:-36px;text-transform:uppercase;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.block-editor-wrapper .slate-editor .arrow-list{list-style-type:"🠆" !important}.block-editor-wrapper .slate-editor .arrow-list li::before{content:none !important}.block-editor-wrapper .slate-editor div[data-slate-editor=true]{height:100%}.block-editor-wrapper .slate-editor .align-left{text-align:left}.block-editor-wrapper .slate-editor .align-right{text-align:right}.block-editor-wrapper .slate-editor .align-center{text-align:center}.block-editor-wrapper .slate-editor .align-justify{text-align:justify}.block-editor-wrapper .slate-editor .block-align-left{display:inline-block;float:left;margin-right:15px}.block-editor-wrapper .slate-editor .block-align-undefined{display:inline-block}.block-editor-wrapper .slate-editor .block-align-right{display:inline-block;float:right;margin-left:15px}.block-editor-wrapper .options-wrapper{font-family:Arial,sans-serif;position:relative;color:#161616}.block-editor-wrapper .options-wrapper:hover .options-container{display:flex}.block-editor-wrapper .options-wrapper .options-toolbar{justify-content:space-between;display:flex;background-color:#ebebeb;padding:.25em}.block-editor-wrapper .options-wrapper .options-container{display:flex;flex-direction:row;justify-content:flex-end;position:relative;z-index:200;padding:.25em}.block-editor-wrapper .options-wrapper .options-container .options-container-option{cursor:pointer;width:26px;margin-right:.25em}.block-editor-wrapper .options-wrapper .options-container .options-container-option>svg{width:100%}.block-editor-wrapper .options-wrapper .options-container .options-container-option.options-container-option-expand-text{width:100px}.block-editor-wrapper .options-wrapper .options-container .options-container-option.options-container-option-delete{color:red}.block-editor-wrapper .options-wrapper .options-container.options-container-right{self-align:flex-end}.block-editor-wrapper .layout-slot-option-padding{position:relative;width:26px;height:26px;display:inline-block}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-item{background-color:#000;display:block;position:absolute;cursor:pointer}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-item:hover{background-color:#61a2e9;z-index:10}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-item.active{background-color:#3490f3;z-index:10}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-top{height:20%;width:100%;top:0;left:0}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-right{height:100%;width:20%;right:0;top:0}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-bottom{height:20%;width:100%;bottom:0;left:0}.block-editor-wrapper .layout-slot-option-padding .layout-slot-option-padding-left{height:100%;width:20%;top:0;left:0}.block-editor-wrapper .layout-block-grid{display:grid}.block-editor-wrapper .layout-block-flex{display:flex}.block-editor-wrapper .layout-block.article-width{width:44.4444444444%}.block-editor-wrapper .layout-block.site-width{width:66.6666666667%}.block-editor-wrapper .layout-block .layout-slot{display:flex;flex-direction:column;position:relative;outline:1px dashed gray}.block-editor-wrapper .layout-block .layout-slot .storybook-element-component{display:block}.block-editor-wrapper .layout-block .layout-slot .layout-slot-content{flex-grow:1}.block-editor-wrapper .layout-block .layout-slot .layout-slot-options{background-color:gray;color:#fff;font-size:24px;padding:10px;display:flex;flex-direction:row;justify-content:space-between}.block-editor-wrapper .layout-block .layout-slot .layout-slot-options .layout-slot-option{text-transform:uppercase;display:inline-block}.block-editor-wrapper .layout-block .layout-slot .layout-slot-options .layout-slot-name{text-transform:uppercase;display:inline-block}.block-editor-wrapper .layout-block .layout-slot.layout-slot-grid-fill{flex-grow:1}.block-editor-wrapper .layout-block .layout-slot.layout-slot-grid-auto{flex-grow:0;width:auto}@media only screen and (max-width: 360px){.block-editor-wrapper .layout-block{grid-template-columns:1fr}}.button{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol" !important;width:100%;padding:8px .75rem !important;color:#fff !important;border:1px solid #036fe3 !important;transition:all 100ms ease-in-out;background-color:#036fe3 !important;font-size:.875rem !important;border-radius:4px !important}.button:hover{background-color:#0275f0 !important}.button:active{background-color:#0262c9 !important}.button.button--secondary{color:#036fe3 !important;border:1px solid #036fe3 !important;background-color:rgba(0,0,0,0) !important}.button.button--secondary:hover{background-color:#036fe3 !important;color:#fff !important}.button.button--secondary:active{background-color:#0262c9 !important;color:#fff !important}.button.button--tertiary{color:#5a657c !important;background-color:#fff !important;border:1px solid #cfd9e0 !important}.button.button--tertiary:hover{background-color:#f8f8f8 !important}.button.button--tertiary:active{background-color:#ededed !important}.resizable.enabled .resizable-left{max-width:calc(100vw - 300px)}.resizable .resizable-left{scrollbar-width:none;max-width:100vw;position:relative}.resizable .resizable-right{scrollbar-width:none;max-width:calc(100vw - 300px);position:relative}.resizable .resizable-x-handle{cursor:ew-resize;content:"";position:absolute;height:100%;width:10px;text-align:center;top:0;left:-2px;background-color:rgba(0,0,0,0)}.hover\:\!bg-green-700:hover{--tw-bg-opacity: 1 !important;background-color:rgb(21 128 61/var(--tw-bg-opacity)) !important}.focus\:outline-none:focus{outline:2px solid rgba(0,0,0,0);outline-offset:2px}@media(min-width: 768px){.md\:ml-4{margin-left:1rem}.md\:mr-4{margin-right:1rem}.md\:grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}.md\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.md\:grid-cols-5{grid-template-columns:repeat(5, minmax(0, 1fr))}.md\:space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem*var(--tw-space-x-reverse));margin-left:calc(1rem*(1 - var(--tw-space-x-reverse)))}}
2
+ .toolbar{background-color:rgba(255,255,255,.95);border-bottom:1px solid rgba(0,0,0,.3);display:none;flex-direction:row;justify-content:space-between;font-family:Arial,sans-serif;padding:5px;position:absolute;z-index:500}.toolbar.toolbar-static{display:block;position:fixed;width:100%;max-width:100%;top:0px;left:0px}.toolbar.active{display:block}.toolbar .toolbar-btns{display:flex;align-items:center}.toolbar .toolbar-btn{border-radius:3px;color:#000;cursor:pointer;font-weight:bold;margin-right:5px;padding:5px 7px;z-index:500;position:relative;display:block}.toolbar .toolbar-btn.active{background-color:rgba(0,0,0,.3)}.toolbar .toolbar-btn:last-child{margin-right:0px}.toolbar .toolbar-btn:hover,.toolbar .toolbar-btn:active{background-color:rgba(0,0,0,.2)}.toolbar .toolbar-btn:hover .toolbar-btn-config,.toolbar .toolbar-btn:active .toolbar-btn-config{display:block}.toolbar .toolbar-btn .toolbar-btn-config{position:absolute;top:28px;left:0px;display:none;background-color:rgba(255,255,255,.95);border-bottom:1px solid rgba(0,0,0,.3);padding:5px 7px}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner{display:flex;flex-direction:column}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row{min-width:250px;padding:5px 7px;display:flex;flex-direction:row}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-label{flex-grow:0;padding:0 7px 0 0}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-input{flex-grow:1}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-input input{padding:5px;border:1px solid gray;background-color:#fff;color:#000}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-form-input input[type=checkbox]:checked{color:#fff;background-color:#000}.toolbar .toolbar-btn .toolbar-btn-config .toolbar-btn-config-inner .toolbar-btn-config-row .toolbar-btn{display:flex;flex-grow:1;border:1px solid #000}.toolbar .toolbar-btn-expand{z-index:500;display:block;max-height:28px;overflow:hidden}.toolbar .toolbar-btn-expand .toolbar-btn-expand-inner{display:flex;flex-direction:column}.toolbar .toolbar-btn-expand .toolbar-btn-expand-inner .toolbar-btn.active{order:-1}.toolbar .toolbar-btn-expand:hover{overflow:visible}.toolbar .toolbar-btn-expand:hover .toolbar-btn-expand-inner{background-color:rgba(255,255,255,.95);border-bottom:1px solid rgba(0,0,0,.3)}.toolbar .toolbar-btn-expand-right{z-index:500;display:block;max-height:28px;overflow:hidden}.toolbar .toolbar-btn-expand-right .toolbar-btn-expand-inner{left:100%;display:flex;flex-direction:column}.toolbar .toolbar-btn-expand-right .toolbar-btn-expand-inner .toolbar-btn.active{order:-1}.toolbar .toolbar-btn-expand-right:hover{overflow:visible}.toolbar .toolbar-btn-expand-right:hover .toolbar-btn-expand-inner{background-color:rgba(255,255,255,.95);border-bottom:1px solid rgba(0,0,0,.3)}
3
+ .storybook-element-wrapper{max-width:100vw;width:100%;margin-left:auto;margin-right:auto}.storybook-element{display:inline-block;width:100%}.storybook-element .storybook-element-component-overlay{display:none;width:100%;height:100%;position:absolute;z-index:20;background-color:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#000;font-size:1em;align-items:center;justify-content:center;content-visibility:auto;outline:3px dashed #036fe3}.storybook-element.storybook-element-missing-attributes .storybook-element-component-overlay{display:flex;outline:3px dashed red}.storybook-element.storybook-inline{display:inline-block}.storybook-element.storybook-inline .options-toolbar{display:inline-block}.storybook-element.storybook-inline .options-toolbar .options-container{padding:.15em}.storybook-element.storybook-inline .options-toolbar .options-container .options-container-option{width:16px}.storybook-element.storybook-inline .storybook-element-component{display:inline-block}.storybook-element.storybook-inline .storybook-element-component .editor-empty-element{min-width:220px;min-height:10px;padding:.15em}.storybook-element.storybook-inline .storybook-element-component-overlay{font-size:.75em;min-width:220px;text-align:center}.storybook-element.storybook-element-float-left{float:left}.storybook-element.storybook-element-float-right{float:right}.storybook-element .storybook-element-component{-webkit-user-select:none;-moz-user-select:none;user-select:none;display:block;position:relative}.storybook-element .storybook-element-component:hover .storybook-element-component-overlay{-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;cursor:pointer}.storybook-element .storybook-element-component .editor-empty-element{display:block;background-color:#42000b;color:#fff;border:1px solid #000;min-height:40px;padding:2em;min-width:100%}.storybook-element .storybook-element-component .editor-empty-element.editor-select-element{background-color:#555}.storybook-element .storybook-element-component.storybook-inline .editor-empty-element{min-height:20px;min-width:100px}.storybook-element .storybook-element-component .storybook-element-display:empty{display:block;background-color:red;border:1px solid #000;min-height:30px;min-width:100px}.storybook-element .storybook-element-component .storybook-element-display.storybook-element-display-empty{display:block;background-color:red;border:1px solid #000;color:#fff;font-weight:bold;font-size:110%;padding:10px;min-height:30px;min-width:100px;position:relative}.storybook-element .storybook-element-component .storybook-element-display.storybook-element-display-empty::after{position:absolute;top:0px;left:0px;content:attr(data-content)}.storybook-element .storybook-element-error{background-color:red;padding:15px;font-size:18px;font-weight:bold;min-height:100px;min-width:100px}@container (min-width: 100px){.storybook-element-component-overlay{font-size:2em}}
4
+ #sidebar-editor-wrapper{padding-top:45px;height:100%;flex-basis:400px;flex-shrink:0}#sidebar-editor{display:flex;flex-direction:column;background-color:#f7f9fa;max-height:100%;height:100%;overflow-y:auto;padding:16px}#sidebar-editor *{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol" !important}#sidebar-editor p,#sidebar-editor label,#sidebar-editor b,#sidebar-editor span{color:#5a657c}#sidebar-editor label{margin:0 0 2px 0 !important}#sidebar-editor input[type=text],#sidebar-editor input[type=time],#sidebar-editor input[type=date],#sidebar-editor input[type=number],#sidebar-editor input[type=color],#sidebar-editor input[type=datetime-local],#sidebar-editor input[type=search],#sidebar-editor select,#sidebar-editor textarea{display:block;font-size:.875rem !important;color:#5a657c !important;background-color:#fff !important;border:1px solid #cfd9e0 !important;border-radius:6px !important;box-shadow:none !important;filter:none !important;width:100% !important;padding:8px .75rem !important}#sidebar-editor textarea{height:42px;max-height:200px}#sidebar-editor input[type=color]{padding:4px !important}#sidebar-editor input[type=range]{display:block;width:100%}#sidebar-editor input[type=radio],#sidebar-editor input[type=checkbox]{margin-right:8px;margin-left:4px}#sidebar-editor option[disabled]{color:rgba(0,0,0,.3)}#sidebar-editor .inline-check-wrapper{display:inline-block;margin-right:8px}#sidebar-editor details{display:block;font-size:.875rem !important;color:#5a657c !important;background-color:#fff !important;border:1px solid #cfd9e0 !important;border-radius:6px !important;box-shadow:none !important;filter:none !important;width:100% !important;padding:16px !important}#sidebar-editor summary{cursor:pointer}#sidebar-editor .disabled{opacity:.4;cursor:not-allowed !important}#sidebar-editor .icon-button{display:inline-block;color:#5a657c !important;background-color:#fff !important;border:1px solid #cfd9e0 !important;border-radius:6px;filter:none !important;width:auto !important;text-align:center}#sidebar-editor .icon-button:not(.disabled):hover{background-color:#f8f8f8 !important}#sidebar-editor .icon-button:not(.disabled):active{background-color:#ededed !important}#sidebar-editor .icon-button-group{display:inline-flex;border-radius:6px !important;overflow:hidden;border:1px solid #cfd9e0 !important}#sidebar-editor .icon-button-group .icon-button{border-radius:0 !important;border:none !important;border-right:1px solid #cfd9e0 !important}#sidebar-editor .icon-button-group .icon-button:last-child{border:none !important}#sidebar-editor .message{font-size:.875rem;padding:16px;border-radius:4px}#sidebar-editor .message.message--negative{background-color:rgba(238,26,26,.2)}#sidebar-editor .collapsable-menu{background-color:#fff !important;border:1px solid #cfd9e0 !important;border-radius:6px;z-index:2;overflow:hidden}#sidebar-editor .collapsable-menu-item{color:#5a657c !important}#sidebar-editor .collapsable-menu-item:not(.disabled):hover{background-color:#f8f8f8 !important}#sidebar-editor .collapsable-menu-item:not(.disabled):active{background-color:#ededed !important}