@oruga-ui/theme-oruga 0.2.1 → 0.3.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 (113) hide show
  1. package/README.md +6 -14
  2. package/dist/oruga.css +1728 -206
  3. package/dist/oruga.min.css +1 -1
  4. package/dist/scss/components/_autocomplete.scss +1 -54
  5. package/dist/scss/components/_button.scss +56 -88
  6. package/dist/scss/components/_carousel.scss +70 -97
  7. package/dist/scss/components/_checkbox.scss +57 -83
  8. package/dist/scss/components/_datepicker.scss +141 -242
  9. package/dist/scss/components/_dropdown.scss +71 -157
  10. package/dist/scss/components/_field.scss +16 -38
  11. package/dist/scss/components/_icon.scss +6 -8
  12. package/dist/scss/components/_input.scss +41 -52
  13. package/dist/scss/components/_loading.scss +5 -13
  14. package/dist/scss/components/_menu.scss +28 -64
  15. package/dist/scss/components/_modal.scss +25 -34
  16. package/dist/scss/components/_notification.scss +35 -72
  17. package/dist/scss/components/_pagination.scss +43 -86
  18. package/dist/scss/components/_radio.scss +45 -60
  19. package/dist/scss/components/_select.scss +45 -73
  20. package/dist/scss/components/_sidebar.scss +34 -108
  21. package/dist/scss/components/_skeleton.scss +10 -23
  22. package/dist/scss/components/_slider.scss +56 -110
  23. package/dist/scss/components/_steps.scss +138 -310
  24. package/dist/scss/components/_switch.scss +52 -87
  25. package/dist/scss/components/_table.scss +77 -139
  26. package/dist/scss/components/_tabs.scss +93 -151
  27. package/dist/scss/components/_taginput.scss +34 -103
  28. package/dist/scss/components/_timepicker.scss +26 -50
  29. package/dist/scss/components/_tooltip.scss +120 -216
  30. package/dist/scss/components/_upload.scss +17 -22
  31. package/dist/scss/oruga-build.scss +9 -0
  32. package/dist/scss/oruga.scss +39 -190
  33. package/dist/scss/utils/_animations.scss +11 -9
  34. package/dist/scss/utils/_base.scss +4 -4
  35. package/dist/scss/utils/_helpers.scss +4 -104
  36. package/dist/scss/utils/_root.scss +34 -18
  37. package/dist/scss/utils/_variables.scss +5 -7
  38. package/package.json +35 -37
  39. package/src/assets/scss/components/_autocomplete.scss +1 -54
  40. package/src/assets/scss/components/_button.scss +56 -88
  41. package/src/assets/scss/components/_carousel.scss +70 -97
  42. package/src/assets/scss/components/_checkbox.scss +57 -83
  43. package/src/assets/scss/components/_datepicker.scss +141 -242
  44. package/src/assets/scss/components/_dropdown.scss +71 -157
  45. package/src/assets/scss/components/_field.scss +16 -38
  46. package/src/assets/scss/components/_icon.scss +6 -8
  47. package/src/assets/scss/components/_input.scss +41 -52
  48. package/src/assets/scss/components/_loading.scss +5 -13
  49. package/src/assets/scss/components/_menu.scss +28 -64
  50. package/src/assets/scss/components/_modal.scss +25 -34
  51. package/src/assets/scss/components/_notification.scss +35 -72
  52. package/src/assets/scss/components/_pagination.scss +43 -86
  53. package/src/assets/scss/components/_radio.scss +45 -60
  54. package/src/assets/scss/components/_select.scss +45 -73
  55. package/src/assets/scss/components/_sidebar.scss +34 -108
  56. package/src/assets/scss/components/_skeleton.scss +10 -23
  57. package/src/assets/scss/components/_slider.scss +56 -110
  58. package/src/assets/scss/components/_steps.scss +138 -310
  59. package/src/assets/scss/components/_switch.scss +52 -87
  60. package/src/assets/scss/components/_table.scss +77 -139
  61. package/src/assets/scss/components/_tabs.scss +93 -151
  62. package/src/assets/scss/components/_taginput.scss +34 -103
  63. package/src/assets/scss/components/_timepicker.scss +26 -50
  64. package/src/assets/scss/components/_tooltip.scss +120 -216
  65. package/src/assets/scss/components/_upload.scss +17 -22
  66. package/src/assets/scss/oruga-build.scss +9 -0
  67. package/src/assets/scss/oruga.scss +39 -190
  68. package/src/assets/scss/utils/_animations.scss +11 -9
  69. package/src/assets/scss/utils/_base.scss +4 -4
  70. package/src/assets/scss/utils/_helpers.scss +4 -104
  71. package/src/assets/scss/utils/_root.scss +34 -18
  72. package/src/assets/scss/utils/_variables.scss +5 -7
  73. package/dist/oruga-full.css +0 -3919
  74. package/dist/oruga-full.min.css +0 -1
  75. package/dist/scss/oruga-common.scss +0 -37
  76. package/dist/scss/oruga-full.scss +0 -9
  77. package/src/App.vue +0 -105
  78. package/src/assets/scss/oruga-common.scss +0 -37
  79. package/src/assets/scss/oruga-full.scss +0 -9
  80. package/src/components/Autocomplete.vue +0 -606
  81. package/src/components/Button.vue +0 -80
  82. package/src/components/Carousel.vue +0 -295
  83. package/src/components/Checkbox.vue +0 -135
  84. package/src/components/Collapse.vue +0 -134
  85. package/src/components/Datepicker.vue +0 -282
  86. package/src/components/Datetimepicker.vue +0 -127
  87. package/src/components/Dropdown.vue +0 -329
  88. package/src/components/Field.vue +0 -235
  89. package/src/components/Icon.vue +0 -66
  90. package/src/components/Input.vue +0 -129
  91. package/src/components/Loading.vue +0 -70
  92. package/src/components/Menu.vue +0 -42
  93. package/src/components/Modal.vue +0 -230
  94. package/src/components/Notification.vue +0 -136
  95. package/src/components/Pagination.vue +0 -96
  96. package/src/components/Radio.vue +0 -111
  97. package/src/components/Select.vue +0 -155
  98. package/src/components/Sidebar.vue +0 -73
  99. package/src/components/Skeleton.vue +0 -75
  100. package/src/components/Slider.vue +0 -226
  101. package/src/components/Steps.vue +0 -233
  102. package/src/components/Switch.vue +0 -137
  103. package/src/components/Table.vue +0 -278
  104. package/src/components/Tabs.vue +0 -209
  105. package/src/components/Taginput.vue +0 -507
  106. package/src/components/Timepicker.vue +0 -122
  107. package/src/components/Tooltip.vue +0 -187
  108. package/src/components/Upload.vue +0 -66
  109. package/src/main.ts +0 -29
  110. package/src/plugins/theme.ts +0 -1
  111. package/src/router/index.ts +0 -39
  112. package/src/views/Home.vue +0 -24
  113. package/types/index.d.ts +0 -1
@@ -1,3919 +0,0 @@
1
- /*! Oruga v0.2.1 | MIT License | github.com/oruga-ui/oruga */
2
-
3
- /************************************
4
- * Oruga Default Theme Full Style
5
- *************************************/
6
- /*********************
7
- * Theme Variables
8
- **********************/
9
- @keyframes fadeOut {
10
- from {
11
- opacity: 1;
12
- }
13
- to {
14
- opacity: 0;
15
- }
16
- }
17
- .fadeOut {
18
- animation-name: fadeOut;
19
- }
20
-
21
- @keyframes fadeOutDown {
22
- from {
23
- opacity: 1;
24
- }
25
- to {
26
- opacity: 0;
27
- transform: translate3d(0, 100%, 0);
28
- }
29
- }
30
- .fadeOutDown {
31
- animation-name: fadeOutDown;
32
- }
33
-
34
- @keyframes fadeOutUp {
35
- from {
36
- opacity: 1;
37
- }
38
- to {
39
- opacity: 0;
40
- transform: translate3d(0, -100%, 0);
41
- }
42
- }
43
- .fadeOutUp {
44
- animation-name: fadeOutUp;
45
- }
46
-
47
- @keyframes fadeIn {
48
- from {
49
- opacity: 0;
50
- }
51
- to {
52
- opacity: 1;
53
- }
54
- }
55
- .fadeIn {
56
- animation-name: fadeIn;
57
- }
58
-
59
- @keyframes fadeInDown {
60
- from {
61
- opacity: 0;
62
- transform: translate3d(0, -100%, 0);
63
- }
64
- to {
65
- opacity: 1;
66
- transform: none;
67
- }
68
- }
69
- .fadeInDown {
70
- animation-name: fadeInDown;
71
- }
72
-
73
- @keyframes fadeInUp {
74
- from {
75
- opacity: 0;
76
- transform: translate3d(0, 100%, 0);
77
- }
78
- to {
79
- opacity: 1;
80
- transform: none;
81
- }
82
- }
83
- .fadeInUp {
84
- animation-name: fadeInUp;
85
- }
86
-
87
- @keyframes append-animate {
88
- from {
89
- transform: scale(0);
90
- opacity: 0;
91
- }
92
- to {
93
- transform: scale(1);
94
- opacity: 1;
95
- }
96
- }
97
- /**
98
- * Vue Transitions
99
- */
100
- .fade-enter-active,
101
- .fade-leave-active {
102
- transition: opacity 150ms ease-out;
103
- }
104
-
105
- .fade-enter,
106
- .fade-enter-from,
107
- .fade-leave-to {
108
- opacity: 0;
109
- }
110
-
111
- .zoom-in-enter-active,
112
- .zoom-in-leave-active {
113
- transition: opacity 150ms ease-out;
114
- }
115
- .zoom-in-enter-active .animation-content,
116
- .zoom-in-leave-active .animation-content {
117
- transition: transform 150ms ease-out;
118
- }
119
-
120
- .zoom-in-enter,
121
- .zoom-in-enter-from,
122
- .zoom-in-leave-active {
123
- opacity: 0;
124
- }
125
- .zoom-in-enter .animation-content,
126
- .zoom-in-enter-from .animation-content,
127
- .zoom-in-leave-active .animation-content {
128
- transform: scale(0.95);
129
- }
130
-
131
- .zoom-out-enter-active,
132
- .zoom-out-leave-active {
133
- transition: opacity 150ms ease-out;
134
- }
135
- .zoom-out-enter-active .animation-content,
136
- .zoom-out-leave-active .animation-content {
137
- transition: transform 150ms ease-out;
138
- }
139
-
140
- .zoom-out-enter,
141
- .zoom-out-enter-from,
142
- .zoom-out-leave-active {
143
- opacity: 0;
144
- }
145
- .zoom-out-enter .animation-content,
146
- .zoom-out-enter-from .animation-content,
147
- .zoom-out-leave-active .animation-content {
148
- transform: scale(1.05);
149
- }
150
-
151
- .slide-next-enter-active,
152
- .slide-next-leave-active,
153
- .slide-prev-enter-active,
154
- .slide-prev-leave-active {
155
- transition: transform 250ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
156
- }
157
-
158
- .slide-prev-leave-to,
159
- .slide-next-enter,
160
- .slide-next-enter-from {
161
- transform: translate3d(-100%, 0, 0);
162
- position: absolute;
163
- width: 100%;
164
- }
165
-
166
- .slide-prev-enter,
167
- .slide-prev-enter-from,
168
- .slide-next-leave-to {
169
- transform: translate3d(100%, 0, 0);
170
- position: absolute;
171
- width: 100%;
172
- }
173
-
174
- .slide-down-enter-active,
175
- .slide-down-leave-active,
176
- .slide-up-enter-active,
177
- .slide-up-leave-active {
178
- transition: transform 250ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
179
- }
180
-
181
- .slide-down-enter,
182
- .slide-up-leave-to,
183
- .slide-down-enter-from {
184
- transform: translate3d(0, -100%, 0);
185
- position: absolute;
186
- height: 100%;
187
- }
188
-
189
- .slide-up-enter,
190
- .slide-up-enter-from,
191
- .slide-down-leave-to {
192
- transform: translate3d(0, 100%, 0);
193
- position: absolute;
194
- height: 100%;
195
- }
196
-
197
- .slide-enter-active {
198
- transition: 150ms ease-out;
199
- }
200
-
201
- .slide-leave-active {
202
- transition: 150ms ease-out;
203
- transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
204
- }
205
-
206
- .slide-leave,
207
- .slide-enter-to,
208
- .slide-leave-from {
209
- max-height: 100px;
210
- overflow: hidden;
211
- }
212
-
213
- .slide-enter,
214
- .slide-enter-from,
215
- .slide-leave-to {
216
- overflow: hidden;
217
- max-height: 0;
218
- }
219
-
220
- :root {
221
- --oruga-primary: #445e00;
222
- --oruga-primary-invert: #ffffff;
223
- --oruga-secondary: #6c757d;
224
- --oruga-secondary-invert: #ffffff;
225
- --oruga-success: #006724;
226
- --oruga-success-invert: #ffffff;
227
- --oruga-info: #005c98;
228
- --oruga-info-invert: #ffffff;
229
- --oruga-warning: #f4c300;
230
- --oruga-warning-invert: #000000;
231
- --oruga-danger: #b60000;
232
- --oruga-danger-invert: #ffffff;
233
- --oruga-white: #ffffff;
234
- --oruga-black: #000000;
235
- --oruga-grey: #7a7a7a;
236
- --oruga-grey-light: #b5b5b5;
237
- --oruga-grey-lighter: #dbdbdb;
238
- --oruga-grey-dark: #4a4a4a;
239
- --oruga-size-small: 0.75rem;
240
- --oruga-size-medium: 1.25rem;
241
- --oruga-size-large: 1.5rem;
242
- --oruga-base-font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif;
243
- --oruga-base-font-size: 1rem;
244
- --oruga-base-font-weight: 400;
245
- --oruga-base-line-height: 1.5;
246
- }
247
-
248
- *,
249
- :after,
250
- :before {
251
- box-sizing: inherit;
252
- }
253
-
254
- html {
255
- box-sizing: border-box;
256
- }
257
-
258
- body {
259
- margin: 0;
260
- padding: 0;
261
- font-family: var(--oruga-base-font-family, system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif);
262
- font-size: var(--oruga-base-font-size, 1rem);
263
- font-weight: var(--oruga-base-font-weight, 400);
264
- line-height: var(--oruga-base-line-height, 1.5);
265
- }
266
-
267
- .o-noscroll {
268
- position: fixed;
269
- width: 100%;
270
- bottom: 0;
271
- overflow-x: hidden;
272
- overflow-y: scroll;
273
- }
274
-
275
- .o-clipped {
276
- overflow: hidden;
277
- }
278
-
279
- /* @docs */
280
- /* @docs */
281
- .o-acp {
282
- position: relative;
283
- }
284
- .o-acp__item {
285
- display: block;
286
- position: relative;
287
- white-space: nowrap;
288
- overflow: hidden;
289
- text-overflow: ellipsis;
290
- cursor: pointer;
291
- color: var(--oruga-autocomplete-item-color, #000000);
292
- font-size: var(--oruga-autocomplete-item-font-size, 1rem);
293
- line-height: var(--oruga-autocomplete-item-line-height, 1.5);
294
- padding: var(--oruga-autocomplete-item-padding, 0.375rem 1rem);
295
- }
296
- .o-acp__item-group-title, .o-acp__item--empty {
297
- pointer-events: none;
298
- opacity: var(--oruga-autocomplete-item-disabled-opacity, 0.5);
299
- }
300
- .o-acp__item--hover, .o-acp__item:hover {
301
- background: var(--oruga-autocomplete-item-hover-background-color, #f5f5f5);
302
- color: var(--oruga-autocomplete-item-hover-color, #000000);
303
- }
304
-
305
- /* @docs */
306
- /* @docs */
307
- @keyframes spinAround {
308
- from {
309
- transform: rotate(0deg);
310
- }
311
- to {
312
- transform: rotate(359deg);
313
- }
314
- }
315
- .o-btn {
316
- -moz-appearance: none;
317
- -webkit-appearance: none;
318
- position: relative;
319
- display: inline-flex;
320
- cursor: pointer;
321
- text-align: center;
322
- white-space: nowrap;
323
- align-items: center;
324
- justify-content: center;
325
- vertical-align: top;
326
- text-decoration: none;
327
- -webkit-touch-callout: none;
328
- -webkit-user-select: none;
329
- -moz-user-select: none;
330
- -ms-user-select: none;
331
- user-select: none;
332
- background-color: var(--oruga-button-background-color, #445e00);
333
- color: var(--oruga-button-color, #ffffff);
334
- padding: var(--oruga-button-padding, calc(0.375em - 1px) 0.75em);
335
- border: var(--oruga-button-border, 1px solid #445e00);
336
- border-radius: var(--oruga-button-border-radius, 4px);
337
- box-shadow: var(--oruga-button-box-shadow, none);
338
- font-size: var(--oruga-base-font-size, 1rem);
339
- font-weight: var(--oruga-button-font-weight, 400);
340
- line-height: var(--oruga-button-line-height, 1.5);
341
- margin: var(--oruga-button-margin, 0);
342
- height: var(--oruga-button-height, 2.25em);
343
- }
344
- .o-btn__wrapper {
345
- margin-left: -0.1875em;
346
- margin-right: -0.1875em;
347
- display: inline-flex;
348
- align-items: center;
349
- justify-content: center;
350
- position: relative;
351
- width: 100%;
352
- }
353
- .o-btn__wrapper > * {
354
- margin-left: 0.1875em;
355
- margin-right: 0.1875em;
356
- }
357
- .o-btn__label {
358
- width: 100%;
359
- }
360
- .o-btn--expanded {
361
- width: 100%;
362
- }
363
- .o-btn--rounded {
364
- border-radius: var(--oruga-button-rounded-border-radius, 9999px);
365
- }
366
- .o-btn--disabled {
367
- opacity: var(--oruga-button-disabled-opacity, 0.5);
368
- cursor: not-allowed;
369
- pointer-events: none;
370
- }
371
- .o-btn--small {
372
- font-size: var(--oruga-button-font-size-small, 0.75rem);
373
- }
374
- .o-btn--medium {
375
- font-size: var(--oruga-button-font-size-medium, 1.25rem);
376
- }
377
- .o-btn--large {
378
- font-size: var(--oruga-button-font-size-large, 1.5rem);
379
- }
380
- .o-btn--primary {
381
- border-color: transparent;
382
- background-color: var(--oruga-variant-primary, #445e00);
383
- color: var(--oruga-variant-invert-primary, #ffffff);
384
- }
385
- .o-btn--primary:hover {
386
- filter: brightness(97.5%);
387
- }
388
- .o-btn--secondary {
389
- border-color: transparent;
390
- background-color: var(--oruga-variant-secondary, #6c757d);
391
- color: var(--oruga-variant-invert-secondary, #ffffff);
392
- }
393
- .o-btn--secondary:hover {
394
- filter: brightness(97.5%);
395
- }
396
- .o-btn--success {
397
- border-color: transparent;
398
- background-color: var(--oruga-variant-success, #006724);
399
- color: var(--oruga-variant-invert-success, #ffffff);
400
- }
401
- .o-btn--success:hover {
402
- filter: brightness(97.5%);
403
- }
404
- .o-btn--info {
405
- border-color: transparent;
406
- background-color: var(--oruga-variant-info, #005c98);
407
- color: var(--oruga-variant-invert-info, #ffffff);
408
- }
409
- .o-btn--info:hover {
410
- filter: brightness(97.5%);
411
- }
412
- .o-btn--warning {
413
- border-color: transparent;
414
- background-color: var(--oruga-variant-warning, #f4c300);
415
- color: var(--oruga-variant-invert-warning, #000000);
416
- }
417
- .o-btn--warning:hover {
418
- filter: brightness(97.5%);
419
- }
420
- .o-btn--danger {
421
- border-color: transparent;
422
- background-color: var(--oruga-variant-danger, #b60000);
423
- color: var(--oruga-variant-invert-danger, #ffffff);
424
- }
425
- .o-btn--danger:hover {
426
- filter: brightness(97.5%);
427
- }
428
- .o-btn--outlined {
429
- background-color: var(--oruga-button-outlined-background-color, transparent);
430
- border-color: var(--oruga-button-background-color, #445e00);
431
- color: var(--oruga-button-background-color, #445e00);
432
- }
433
- .o-btn--outlined:hover {
434
- border-color: transparent;
435
- background-color: var(--oruga-button-background-color, #445e00);
436
- color: var(--oruga-button-color, #ffffff);
437
- }
438
- .o-btn--outlined-primary {
439
- background-color: var(--oruga-button-outlined-background-color, transparent);
440
- border-color: var(--oruga-variant-primary, #445e00);
441
- color: var(--oruga-variant-primary, #445e00);
442
- }
443
- .o-btn--outlined-primary:hover {
444
- border-color: transparent;
445
- background-color: var(--oruga-variant-primary, #445e00);
446
- color: var(--oruga-variant-invert-primary, #ffffff);
447
- }
448
- .o-btn--outlined-secondary {
449
- background-color: var(--oruga-button-outlined-background-color, transparent);
450
- border-color: var(--oruga-variant-secondary, #6c757d);
451
- color: var(--oruga-variant-secondary, #6c757d);
452
- }
453
- .o-btn--outlined-secondary:hover {
454
- border-color: transparent;
455
- background-color: var(--oruga-variant-secondary, #6c757d);
456
- color: var(--oruga-variant-invert-secondary, #ffffff);
457
- }
458
- .o-btn--outlined-success {
459
- background-color: var(--oruga-button-outlined-background-color, transparent);
460
- border-color: var(--oruga-variant-success, #006724);
461
- color: var(--oruga-variant-success, #006724);
462
- }
463
- .o-btn--outlined-success:hover {
464
- border-color: transparent;
465
- background-color: var(--oruga-variant-success, #006724);
466
- color: var(--oruga-variant-invert-success, #ffffff);
467
- }
468
- .o-btn--outlined-info {
469
- background-color: var(--oruga-button-outlined-background-color, transparent);
470
- border-color: var(--oruga-variant-info, #005c98);
471
- color: var(--oruga-variant-info, #005c98);
472
- }
473
- .o-btn--outlined-info:hover {
474
- border-color: transparent;
475
- background-color: var(--oruga-variant-info, #005c98);
476
- color: var(--oruga-variant-invert-info, #ffffff);
477
- }
478
- .o-btn--outlined-warning {
479
- background-color: var(--oruga-button-outlined-background-color, transparent);
480
- border-color: var(--oruga-variant-warning, #f4c300);
481
- color: var(--oruga-variant-warning, #f4c300);
482
- }
483
- .o-btn--outlined-warning:hover {
484
- border-color: transparent;
485
- background-color: var(--oruga-variant-warning, #f4c300);
486
- color: var(--oruga-variant-invert-warning, #000000);
487
- }
488
- .o-btn--outlined-danger {
489
- background-color: var(--oruga-button-outlined-background-color, transparent);
490
- border-color: var(--oruga-variant-danger, #b60000);
491
- color: var(--oruga-variant-danger, #b60000);
492
- }
493
- .o-btn--outlined-danger:hover {
494
- border-color: transparent;
495
- background-color: var(--oruga-variant-danger, #b60000);
496
- color: var(--oruga-variant-invert-danger, #ffffff);
497
- }
498
- .o-btn--loading {
499
- color: transparent !important;
500
- pointer-events: none;
501
- }
502
- .o-btn--loading::after {
503
- -webkit-animation: spinAround 500ms infinite linear;
504
- left: calc(50% - 0.5em);
505
- top: calc(50% - 0.5em);
506
- position: absolute !important;
507
- border: 2px solid #dbdbdb;
508
- border-radius: 9999px;
509
- border-right-color: transparent;
510
- border-top-color: transparent;
511
- content: "";
512
- display: block;
513
- height: 1em;
514
- width: 1em;
515
- }
516
- .o-btn--inverted {
517
- background-color: var(--oruga-button-color, #ffffff);
518
- border-color: var(--oruga-button-color, #ffffff);
519
- color: var(--oruga-button-background-color, #445e00);
520
- }
521
- .o-btn--inverted:hover {
522
- filter: brightness(95%);
523
- }
524
- .o-btn--inverted-primary {
525
- background-color: var(--oruga-variant-invert-primary, #ffffff);
526
- border-color: var(--oruga-variant-invert-primary, #ffffff);
527
- color: var(--oruga-variant-primary, #445e00);
528
- }
529
- .o-btn--inverted-primary:hover {
530
- filter: brightness(95%);
531
- }
532
- .o-btn--inverted-secondary {
533
- background-color: var(--oruga-variant-invert-secondary, #ffffff);
534
- border-color: var(--oruga-variant-invert-secondary, #ffffff);
535
- color: var(--oruga-variant-secondary, #6c757d);
536
- }
537
- .o-btn--inverted-secondary:hover {
538
- filter: brightness(95%);
539
- }
540
- .o-btn--inverted-success {
541
- background-color: var(--oruga-variant-invert-success, #ffffff);
542
- border-color: var(--oruga-variant-invert-success, #ffffff);
543
- color: var(--oruga-variant-success, #006724);
544
- }
545
- .o-btn--inverted-success:hover {
546
- filter: brightness(95%);
547
- }
548
- .o-btn--inverted-info {
549
- background-color: var(--oruga-variant-invert-info, #ffffff);
550
- border-color: var(--oruga-variant-invert-info, #ffffff);
551
- color: var(--oruga-variant-info, #005c98);
552
- }
553
- .o-btn--inverted-info:hover {
554
- filter: brightness(95%);
555
- }
556
- .o-btn--inverted-warning {
557
- background-color: var(--oruga-variant-invert-warning, #000000);
558
- border-color: var(--oruga-variant-invert-warning, #000000);
559
- color: var(--oruga-variant-warning, #f4c300);
560
- }
561
- .o-btn--inverted-warning:hover {
562
- filter: brightness(95%);
563
- }
564
- .o-btn--inverted-danger {
565
- background-color: var(--oruga-variant-invert-danger, #ffffff);
566
- border-color: var(--oruga-variant-invert-danger, #ffffff);
567
- color: var(--oruga-variant-danger, #b60000);
568
- }
569
- .o-btn--inverted-danger:hover {
570
- filter: brightness(95%);
571
- }
572
-
573
- /* @docs */
574
- /* @docs */
575
- .o-car {
576
- -webkit-touch-callout: none;
577
- -webkit-user-select: none;
578
- -moz-user-select: none;
579
- -ms-user-select: none;
580
- user-select: none;
581
- position: relative;
582
- overflow: hidden;
583
- width: 100%;
584
- }
585
- .o-car__overlay {
586
- bottom: 0;
587
- left: 0;
588
- right: 0;
589
- top: 0;
590
- align-items: center;
591
- flex-direction: column;
592
- justify-content: center;
593
- display: flex;
594
- max-height: 100vh;
595
- position: fixed;
596
- background-color: var(--oruga-carousel-overlay-background, hsla(0, 0%, 4%, 0.86));
597
- z-index: var(--oruga-carousel-overlay-zindex, 40);
598
- }
599
- .o-car__wrapper {
600
- position: relative;
601
- width: 100%;
602
- }
603
- .o-car__items {
604
- display: flex;
605
- width: 100%;
606
- }
607
- .o-car__items:not(.o-car__items--dragging) {
608
- transition: var(--oruga-carousel-items-transition, all 250ms ease-out 0s);
609
- }
610
- .o-car__item {
611
- border: var(--oruga-carousel-item-border, 2px solid transparent);
612
- flex-shrink: 0;
613
- }
614
- .o-car__item--clickable {
615
- cursor: pointer;
616
- }
617
- .o-car__indicators {
618
- width: 100%;
619
- display: flex;
620
- align-items: center;
621
- justify-content: center;
622
- padding: var(--oruga-carousel-indicators-padding, 0.5rem);
623
- background: var(--oruga-carousel-indicators-background, rgba(255, 255, 255, 0.5));
624
- }
625
- .o-car__indicators--inside {
626
- position: absolute;
627
- }
628
- .o-car__indicators--inside--bottom {
629
- bottom: 0;
630
- }
631
- .o-car__indicators--inside--top {
632
- top: 0;
633
- }
634
- .o-car__indicator:not(:last-child) {
635
- margin: var(--oruga-carousel-indicator-margin, 0 0.5rem 0 0);
636
- }
637
- .o-car__indicator__item {
638
- display: block;
639
- border: var(--oruga-carousel-indicator-border, 1px solid #445e00);
640
- background: var(--oruga-carousel-indicator-background, #ffffff);
641
- transition: var(--oruga-carousel-indicator-transition, 150ms ease-out);
642
- }
643
- .o-car__indicator__item--active,
644
- .o-car__indicator__item :hover {
645
- background: var(--oruga-carousel-indicator-active-background, #445e00);
646
- border: var(--oruga-carousel-indicator-active-border, 1px solid #445e00);
647
- }
648
- .o-car__indicator__item--boxes {
649
- width: var(--oruga-carousel-indicator-size, 10px);
650
- height: var(--oruga-carousel-indicator-size, 10px);
651
- }
652
- .o-car__indicator__item--dots {
653
- border-radius: var(--oruga-carousel-indicator-dots-border-radius, 4px);
654
- width: var(--oruga-carousel-indicator-size, 10px);
655
- height: var(--oruga-carousel-indicator-size, 10px);
656
- }
657
- .o-car__indicator__item--lines {
658
- width: var(--oruga-carousel-indicator-lines-width, 25px);
659
- height: var(--oruga-carousel-indicator-lines-height, 5px);
660
- }
661
- .o-car__arrow__icon {
662
- cursor: pointer;
663
- background: var(--oruga-carousel-arrow-background, #ffffff);
664
- color: var(--oruga-carousel-arrow-color, #445e00);
665
- width: var(--oruga-carousel-arrow-size, 1.5rem);
666
- height: var(--oruga-carousel-arrow-size, 1.5rem);
667
- border-radius: var(--oruga-carousel-arrow-border-radius, 9999px);
668
- border: var(--oruga-carousel-arrow-border, 1px solid #ffffff);
669
- transition: var(--oruga-carousel-arrow-transition, 150ms ease-out);
670
- }
671
- .o-car__arrow__icon-prev, .o-car__arrow__icon-next {
672
- position: absolute;
673
- top: var(--oruga-carousel-arrow-top, 50%);
674
- transform: translateY(var(--oruga-carousel-arrow-top, -50%));
675
- z-index: 1;
676
- }
677
- .o-car__arrow__icon-prev {
678
- left: var(--oruga-carousel-arrow-icon-spaced, 1.5rem);
679
- }
680
- .o-car__arrow__icon-next {
681
- right: var(--oruga-carousel-arrow-icon-spaced, 1.5rem);
682
- }
683
-
684
- /* @docs */
685
- /* @docs */
686
- .o-chk {
687
- display: inline-flex;
688
- align-items: center;
689
- cursor: pointer;
690
- position: relative;
691
- -webkit-touch-callout: none;
692
- -webkit-user-select: none;
693
- -moz-user-select: none;
694
- -ms-user-select: none;
695
- user-select: none;
696
- line-height: var(--oruga-checkbox-line-height, 1.5);
697
- margin-right: var(--oruga-checkbox-margin-sibiling, 0.5em);
698
- }
699
- .o-chk__input {
700
- width: var(--oruga-checkbox-size, 1rem);
701
- height: var(--oruga-checkbox-size, 1rem);
702
- outline: none;
703
- margin: 0;
704
- vertical-align: top;
705
- background-position: center;
706
- background-size: contain;
707
- -webkit-appearance: none;
708
- -moz-appearance: none;
709
- appearance: none;
710
- -webkit-print-color-adjust: exact;
711
- print-color-adjust: exact;
712
- flex-shrink: 0;
713
- cursor: pointer;
714
- background-repeat: no-repeat;
715
- background-color: var(--oruga-checkbox-background-color, #445e00);
716
- border-radius: var(--oruga-checkbox-border-radius, 4px);
717
- border-width: var(--oruga-checkbox-border-width, 2px);
718
- border-color: var(--oruga-checkbox-border-color, #445e00);
719
- border-style: solid;
720
- transition-property: background;
721
- transition-duration: var(--oruga-transition-duration, 150ms);
722
- transition-timing-function: var(--oruga-transition-timing, ease-out);
723
- }
724
- .o-chk__input--checked {
725
- background-color: var(--oruga-checkbox-active-background-color, #445e00);
726
- border-color: var(--oruga-checkbox-active-background-color, #445e00);
727
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-checkbox-checkmark-color, %23ffffff)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
728
- }
729
- .o-chk__input--indeterminate {
730
- background-color: var(--oruga-checkbox-active-background-color, #445e00);
731
- border-color: var(--oruga-checkbox-active-background-color, #445e00);
732
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-checkbox-checkmark-color, %23ffffff)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
733
- }
734
- .o-chk__label {
735
- padding: var(--oruga-checkbox-label-padding, 0 0 0 0.5em);
736
- }
737
- .o-chk--disabled {
738
- opacity: var(--oruga-checkbox-disabled-opacity, 0.5);
739
- }
740
- .o-chk--small {
741
- font-size: var(--oruga-checkbox-font-size-small, 0.75rem);
742
- }
743
- .o-chk--medium {
744
- font-size: var(--oruga-checkbox-font-size-medium, 1.25rem);
745
- }
746
- .o-chk--large {
747
- font-size: var(--oruga-checkbox-font-size-large, 1.5rem);
748
- }
749
- .o-chk--primary .o-chk__input {
750
- border-color: var(--oruga-variant-primary, #445e00);
751
- background-color: var(--oruga-variant-primary, #445e00);
752
- }
753
- .o-chk--primary .o-chk__input--checked {
754
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-variant-invert-primary, %23ffffff)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
755
- }
756
- .o-chk--primary .o-chk__input--indeterminate {
757
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-variant-invert-primary, %23ffffff)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
758
- }
759
- .o-chk--secondary .o-chk__input {
760
- border-color: var(--oruga-variant-secondary, #6c757d);
761
- background-color: var(--oruga-variant-secondary, #6c757d);
762
- }
763
- .o-chk--secondary .o-chk__input--checked {
764
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-variant-invert-secondary, %23ffffff)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
765
- }
766
- .o-chk--secondary .o-chk__input--indeterminate {
767
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-variant-invert-secondary, %23ffffff)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
768
- }
769
- .o-chk--success .o-chk__input {
770
- border-color: var(--oruga-variant-success, #006724);
771
- background-color: var(--oruga-variant-success, #006724);
772
- }
773
- .o-chk--success .o-chk__input--checked {
774
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-variant-invert-success, %23ffffff)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
775
- }
776
- .o-chk--success .o-chk__input--indeterminate {
777
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-variant-invert-success, %23ffffff)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
778
- }
779
- .o-chk--info .o-chk__input {
780
- border-color: var(--oruga-variant-info, #005c98);
781
- background-color: var(--oruga-variant-info, #005c98);
782
- }
783
- .o-chk--info .o-chk__input--checked {
784
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-variant-invert-info, %23ffffff)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
785
- }
786
- .o-chk--info .o-chk__input--indeterminate {
787
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-variant-invert-info, %23ffffff)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
788
- }
789
- .o-chk--warning .o-chk__input {
790
- border-color: var(--oruga-variant-warning, #f4c300);
791
- background-color: var(--oruga-variant-warning, #f4c300);
792
- }
793
- .o-chk--warning .o-chk__input--checked {
794
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-variant-invert-warning, %23000000)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
795
- }
796
- .o-chk--warning .o-chk__input--indeterminate {
797
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-variant-invert-warning, %23000000)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
798
- }
799
- .o-chk--danger .o-chk__input {
800
- border-color: var(--oruga-variant-danger, #b60000);
801
- background-color: var(--oruga-variant-danger, #b60000);
802
- }
803
- .o-chk--danger .o-chk__input--checked {
804
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:var(--oruga-variant-invert-danger, %23ffffff)' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
805
- }
806
- .o-chk--danger .o-chk__input--indeterminate {
807
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:var(--oruga-variant-invert-danger, %23ffffff)' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
808
- }
809
-
810
- /* @docs */
811
- /* @docs */
812
- .o-clps__trigger {
813
- cursor: pointer;
814
- }
815
- .o-clps__content {
816
- display: inherit;
817
- }
818
-
819
- /* @docs */
820
- /* @docs */
821
- .o-dpck {
822
- font-size: var(--oruga-datepicker-font-size, 1rem);
823
- }
824
- .o-dpck--small {
825
- font-size: var(--oruga-datepicker-font-size-small, 0.75rem);
826
- }
827
- .o-dpck--medium {
828
- font-size: var(--oruga-datepicker-font-size-medium, 1.25rem);
829
- }
830
- .o-dpck--large {
831
- font-size: var(--oruga-datepicker-font-size-large, 1.5rem);
832
- }
833
- .o-dpck__dropdown {
834
- width: 100%;
835
- }
836
- .o-dpck__box {
837
- display: block;
838
- position: relative;
839
- line-height: var(--oruga-datepicker-box-line-height, 1.5);
840
- padding: var(--oruga-datepicker-box-padding, 0.375rem 1rem);
841
- }
842
- .o-dpck__header {
843
- padding: var(--oruga-datepicker-header-padding, 0 0 0.875rem 0);
844
- margin: var(--oruga-datepicker-header-margin, 0 0 0.875rem 0);
845
- border-bottom: var(--oruga-datepicker-header-border-bottom, 1px solid #dbdbdb);
846
- }
847
- .o-dpck__header__buttons {
848
- align-items: center;
849
- display: flex;
850
- justify-content: center;
851
- text-align: center;
852
- }
853
- .o-dpck__header__buttons--small {
854
- font-size: var(--oruga-datepicker-font-size-small, 0.75rem);
855
- }
856
- .o-dpck__header__buttons--medium {
857
- font-size: var(--oruga-datepicker-font-size-medium, 1.25rem);
858
- }
859
- .o-dpck__header__buttons--large {
860
- font-size: var(--oruga-datepicker-font-size-large, 1.5rem);
861
- }
862
- .o-dpck__header__previous {
863
- order: 1;
864
- }
865
- .o-dpck__header__next {
866
- order: 3;
867
- }
868
- .o-dpck__header__previous, .o-dpck__header__next {
869
- justify-content: center;
870
- text-align: center;
871
- text-decoration: none;
872
- cursor: pointer;
873
- -moz-appearance: none;
874
- -webkit-appearance: none;
875
- align-items: center;
876
- box-shadow: none;
877
- display: inline-flex;
878
- position: relative;
879
- vertical-align: top;
880
- -webkit-touch-callout: none;
881
- -webkit-user-select: none;
882
- -moz-user-select: none;
883
- -ms-user-select: none;
884
- user-select: none;
885
- line-height: var(--oruga-datepicker-btn-line-height, 1.5);
886
- border: var(--oruga-datepicker-btn-border, 1px solid transparent);
887
- border-radius: var(--oruga-datepicker-btn-border-radius, 4px);
888
- border-color: var(--oruga-datepicker-btn-border-color, #dbdbdb);
889
- color: var(--oruga-datepicker-btn-color, #363636);
890
- min-width: var(--oruga-datepicker-btn-min-width, 2.25em);
891
- height: var(--oruga-datepicker-btn-height, 2.25em);
892
- padding: var(--oruga-datepicker-btn-padding, 0.5em 0.5em);
893
- margin: var(--oruga-datepicker-btn-margin, 0.25rem);
894
- }
895
- .o-dpck__header__previous:hover, .o-dpck__header__next:hover {
896
- text-decoration: none;
897
- border-color: var(--oruga-datepicker-btn-hover-border-color, #b5b5b5);
898
- color: var(--oruga-datepicker-btn-hover-color, #363636);
899
- }
900
- .o-dpck__header__list {
901
- order: 2;
902
- align-items: center;
903
- display: flex;
904
- justify-content: center;
905
- text-align: center;
906
- list-style: none;
907
- flex-wrap: wrap;
908
- margin: 0;
909
- padding: 0;
910
- margin-left: -0.125rem;
911
- margin-right: -0.125rem;
912
- }
913
- .o-dpck__header__list > * {
914
- margin-left: 0.125rem;
915
- margin-right: 0.125rem;
916
- }
917
- .o-dpck__footer {
918
- padding: var(--oruga-datepicker-header-padding, 0.875rem 0.5rem 0 0.5rem);
919
- margin: var(--oruga-datepicker-header-margin, 0.875rem 0 0.875rem 0);
920
- border-top: var(--oruga-datepicker-header-border-top, 1px solid #dbdbdb);
921
- }
922
- .o-dpck__table, .o-dpck__month {
923
- display: table;
924
- margin: 0 auto 0 auto;
925
- }
926
- .o-dpck__table__head, .o-dpck__month__head {
927
- display: table-header-group;
928
- padding: var(--oruga-datepicker-table-head-padding, 0 0 0.875rem 0);
929
- margin: var(--oruga-datepicker-table-head-margin, 0 0 0.875rem 0);
930
- border-bottom: var(--oruga-datepicker-table-head-border-bottom, 1px solid #dbdbdb);
931
- }
932
- .o-dpck__table__body, .o-dpck__month__body {
933
- display: table-row-group;
934
- }
935
- .o-dpck__table__row, .o-dpck__month__row {
936
- display: table-row;
937
- }
938
- .o-dpck__table__head-cell, .o-dpck__month__head-cell {
939
- padding: var(--oruga-datepicker-table-head-item-padding, #7a7a7a);
940
- font-weight: var(--oruga-datepicker-table-head-item-font-weight, 600);
941
- }
942
- .o-dpck__table__cell, .o-dpck__month__cell {
943
- text-align: center;
944
- vertical-align: middle;
945
- display: table-cell;
946
- text-decoration: none;
947
- border-radius: var(--oruga-datepicker-item-border-radius, 4px);
948
- padding: var(--oruga-datepicker-item-padding, 0.5rem 0.75rem);
949
- }
950
- .o-dpck__table__cell--unselectable, .o-dpck__month__cell--unselectable {
951
- color: var(--oruga-datepicker-item-disabled-color, #b5b5b5);
952
- }
953
- .o-dpck__table__cell--today, .o-dpck__month__cell--today {
954
- border: var(--oruga-datepicker-item-today-border, solid 1px rgba(68, 94, 0, 0.5));
955
- }
956
- .o-dpck__table__cell--selectable, .o-dpck__month__cell--selectable {
957
- color: var(--oruga-datepicker-item-selectable-color, #4a4a4a);
958
- }
959
- .o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered {
960
- background-color: var(--oruga-datepicker-item-hovered-background-color, #7a7a7a);
961
- color: var(--oruga-datepicker-item-hovered-color, #dbdbdb);
962
- border-bottom-right-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
963
- border-top-right-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
964
- }
965
- .o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered {
966
- background-color: var(--oruga-datepicker-item-hovered-within-background-color, rgba(122, 122, 122, 0.5));
967
- color: var(--oruga-datepicker-item-hovered-color, #dbdbdb);
968
- border-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
969
- }
970
- .o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered {
971
- background-color: var(--oruga-datepicker-item-hovered-background-color, #7a7a7a);
972
- color: var(--oruga-datepicker-item-hovered-color, #dbdbdb);
973
- border-bottom-left-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
974
- border-top-left-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
975
- }
976
- .o-dpck__table__cell--selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) {
977
- background-color: var(--oruga-datepicker-item-selected-background-color, #445e00);
978
- color: var(--oruga-datepicker-item-selected-color, #ffffff);
979
- }
980
- .o-dpck__table__cell--first-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--first-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) {
981
- background-color: var(--oruga-datepicker-item-selected-background-color, #445e00);
982
- color: var(--oruga-datepicker-item-selected-color, #ffffff);
983
- border-bottom-right-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
984
- border-top-right-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
985
- }
986
- .o-dpck__table__cell--within-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--within-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) {
987
- background-color: var(--oruga-datepicker-item-selected-within-background-color, rgba(68, 94, 0, 0.5));
988
- border-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
989
- }
990
- .o-dpck__table__cell--last-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--last-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) {
991
- background-color: var(--oruga-datepicker-item-selected-background-color, #445e00);
992
- color: var(--oruga-datepicker-item-selected-color, #ffffff);
993
- border-bottom-left-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
994
- border-top-left-radius: var(--oruga-datepicker-item-selected-border-radius, 0);
995
- }
996
- .o-dpck__table__cell--nearby:not(.o-dpck__table__cell--selected, .o-dpck__month__cell--selected), .o-dpck__month__cell--nearby:not(.o-dpck__table__cell--selected, .o-dpck__month__cell--selected) {
997
- color: var(--oruga-datepicker-item-nearby-color, #b5b5b5);
998
- }
999
- .o-dpck__table__cell--invisible, .o-dpck__month__cell--invisible {
1000
- visibility: hidden;
1001
- }
1002
- .o-dpck__table__cell--events, .o-dpck__month__cell--events {
1003
- padding: var(--oruga-datepicker-events-item-padding, 0.3rem 0.75rem 0.75rem);
1004
- position: relative;
1005
- }
1006
- .o-dpck__table__events, .o-dpck__month__events {
1007
- display: flex;
1008
- justify-content: center;
1009
- position: absolute;
1010
- width: 100%;
1011
- left: 0;
1012
- bottom: 15%;
1013
- }
1014
- .o-dpck__table__event, .o-dpck__month__event {
1015
- background-color: var(--oruga-datepicker-event-background-color, #b5b5b5);
1016
- }
1017
- .o-dpck__table__event--primary, .o-dpck__month__event--primary {
1018
- background-color: #445e00;
1019
- background-color: var(--oruga-variant-primary, #445e00);
1020
- }
1021
- .o-dpck__table__event--secondary, .o-dpck__month__event--secondary {
1022
- background-color: #6c757d;
1023
- background-color: var(--oruga-variant-secondary, #6c757d);
1024
- }
1025
- .o-dpck__table__event--success, .o-dpck__month__event--success {
1026
- background-color: #006724;
1027
- background-color: var(--oruga-variant-success, #006724);
1028
- }
1029
- .o-dpck__table__event--info, .o-dpck__month__event--info {
1030
- background-color: #005c98;
1031
- background-color: var(--oruga-variant-info, #005c98);
1032
- }
1033
- .o-dpck__table__event--warning, .o-dpck__month__event--warning {
1034
- background-color: #f4c300;
1035
- background-color: var(--oruga-variant-warning, #f4c300);
1036
- }
1037
- .o-dpck__table__event--danger, .o-dpck__month__event--danger {
1038
- background-color: #b60000;
1039
- background-color: var(--oruga-variant-danger, #b60000);
1040
- }
1041
- .o-dpck__table__event--dots, .o-dpck__month__event--dots {
1042
- border-radius: 50%;
1043
- margin: var(--oruga-datepicker-event-dots-margin, 0 0.1em);
1044
- height: var(--oruga-datepicker-event-dots-size, 0.35em);
1045
- width: var(--oruga-datepicker-event-dots-size, 0.35em);
1046
- }
1047
- .o-dpck__table__event--bars, .o-dpck__month__event--bars {
1048
- height: var(--oruga-datepicker-event-bars-height, 0.25em);
1049
- width: 100%;
1050
- }
1051
- .o-dpck__month__table {
1052
- display: inline-flex;
1053
- flex-wrap: wrap;
1054
- flex-direction: row;
1055
- width: 17rem;
1056
- }
1057
- .o-dpck__month__cell {
1058
- display: flex;
1059
- align-items: center;
1060
- justify-content: center;
1061
- width: 33.33%;
1062
- height: 2.5rem;
1063
- }
1064
- .o-dpck--mobile .o-dpck__header__previous {
1065
- order: 1;
1066
- flex-grow: 1;
1067
- flex-shrink: 1;
1068
- }
1069
- .o-dpck--mobile .o-dpck__header__next {
1070
- order: 3;
1071
- flex-grow: 1;
1072
- flex-shrink: 1;
1073
- }
1074
- .o-dpck--mobile .o-dpck__header__list {
1075
- order: 2;
1076
- flex-grow: 1;
1077
- flex-shrink: 1;
1078
- }
1079
-
1080
- /* @docs */
1081
- /* @docs */
1082
- .o-dtpck__time {
1083
- display: flex;
1084
- justify-content: center;
1085
- align-items: center;
1086
- }
1087
-
1088
- /* @docs */
1089
- /* @docs */
1090
- .o-drop {
1091
- display: inline-flex;
1092
- position: relative;
1093
- vertical-align: top;
1094
- }
1095
- .o-drop__overlay {
1096
- position: fixed;
1097
- bottom: 0;
1098
- left: 0;
1099
- right: 0;
1100
- top: 0;
1101
- cursor: pointer;
1102
- display: none;
1103
- background-color: var(--oruga-dropdown-mobile-overlay-color, rgba(0, 0, 0, 0.86));
1104
- z-index: var(--oruga-dropdown-mobile-overlay-zindex, 40);
1105
- }
1106
- .o-drop__trigger {
1107
- width: 100%;
1108
- }
1109
- .o-drop__menu {
1110
- position: absolute;
1111
- display: block;
1112
- min-width: var(--oruga-dropdown-menu-width, 12rem);
1113
- z-index: var(--oruga-dropdown-menu-zindex, 20);
1114
- background-color: var(--oruga-dropdown-menu-background, #ffffff);
1115
- border-radius: var(--oruga-dropdown-menu-border-radius, 4px);
1116
- box-shadow: var(--oruga-dropdown-menu-box-shadow, 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02));
1117
- padding: var(--oruga-dropdown-menu-padding, 0.5rem 0 0.5rem 0);
1118
- margin: var(--oruga-dropdown-menu-margin, 0);
1119
- }
1120
- .o-drop__menu--bottom {
1121
- left: 50%;
1122
- right: auto;
1123
- top: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1124
- bottom: auto;
1125
- transform: translateX(-50%);
1126
- }
1127
- .o-drop__menu--top {
1128
- left: 50%;
1129
- right: auto;
1130
- top: auto;
1131
- bottom: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1132
- transform: translateX(-50%);
1133
- }
1134
- .o-drop__menu--left {
1135
- right: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1136
- left: auto;
1137
- top: 50%;
1138
- bottom: auto;
1139
- transform: translateY(-50%);
1140
- }
1141
- .o-drop__menu--right {
1142
- right: auto;
1143
- left: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1144
- top: 50%;
1145
- bottom: auto;
1146
- transform: translateY(-50%);
1147
- }
1148
- .o-drop__menu--top-right {
1149
- right: 0;
1150
- left: auto;
1151
- top: auto;
1152
- bottom: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1153
- }
1154
- .o-drop__menu--top-left {
1155
- right: auto;
1156
- left: 0;
1157
- top: auto;
1158
- bottom: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1159
- }
1160
- .o-drop__menu--bottom-right {
1161
- right: 0;
1162
- left: auto;
1163
- top: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1164
- bottom: auto;
1165
- }
1166
- .o-drop__menu--bottom-left {
1167
- right: auto;
1168
- left: 0;
1169
- top: calc(100% + var(--oruga-dropdown-menu-spacer, 0px));
1170
- bottom: auto;
1171
- }
1172
- .o-drop__item {
1173
- display: block;
1174
- position: relative;
1175
- color: var(--oruga-dropdown-item-color, #000000);
1176
- font-size: var(--oruga-dropdown-item-font-size, 1rem);
1177
- font-weight: var(--oruga-dropdown-item-font-weight, 400);
1178
- line-height: var(--oruga-dropdown-item-line-height, 1.5);
1179
- padding: var(--oruga-dropdown-item-padding, 0.375rem 1rem);
1180
- }
1181
- .o-drop__item--disabled {
1182
- opacity: var(--oruga-dropdown-item-disabled-opacity, 0.5);
1183
- pointer-events: none;
1184
- }
1185
- .o-drop__item--active {
1186
- background-color: var(--oruga-dropdown-item-active-background-color, #445e00);
1187
- color: var(--oruga-dropdown-item-active-color, #ffffff);
1188
- }
1189
- .o-drop__item--clickable {
1190
- cursor: pointer;
1191
- }
1192
- .o-drop__item--clickable:hover:not(.o-drop__item--clickable--active) {
1193
- background-color: var(--oruga-dropdown-item-hover-background-color, #f5f5f5);
1194
- color: var(--oruga-dropdown-item-hover-color, #000000);
1195
- }
1196
- .o-drop--inline {
1197
- display: inline;
1198
- }
1199
- .o-drop--inline .o-drop__menu {
1200
- position: static;
1201
- display: inline-block;
1202
- padding: 0;
1203
- }
1204
- .o-drop--expanded {
1205
- width: 100%;
1206
- }
1207
- .o-drop--expanded .o-drop__menu {
1208
- width: 100%;
1209
- }
1210
- .o-drop--disabled {
1211
- opacity: var(--oruga-dropdown-disabled-opacity, 0.5);
1212
- pointer-events: none;
1213
- }
1214
- .o-drop--mobile > .o-drop__menu {
1215
- position: fixed;
1216
- top: 25%;
1217
- left: 50%;
1218
- bottom: auto;
1219
- right: auto;
1220
- transform: translate3d(-50%, -25%, 0);
1221
- overflow-y: auto;
1222
- width: var(--oruga-dropdown-mobile-width, calc(100vw - 40px));
1223
- max-width: var(--oruga-dropdown-mobile-max-width, 460px);
1224
- max-height: var(--oruga-dropdown-mobile-max-height, calc(100vh - 120px));
1225
- z-index: var(--oruga-dropdown-mobile-zindex, 50);
1226
- }
1227
- .o-drop--mobile > .o-drop__overlay {
1228
- display: block;
1229
- }
1230
- .o-drop--teleport {
1231
- width: unset;
1232
- }
1233
-
1234
- /* @docs */
1235
- /* @docs */
1236
- .o-field {
1237
- flex-grow: 1;
1238
- }
1239
- .o-field:not(:last-child) {
1240
- margin-bottom: var(--oruga-field-margin-bottom, 0.75rem);
1241
- }
1242
- .o-field__label {
1243
- display: block;
1244
- color: var(--oruga-field-label-color, #363636);
1245
- font-size: var(--oruga-base-font-size, 1rem);
1246
- font-weight: var(--oruga-field-label-font-weight, 600);
1247
- }
1248
- .o-field__label-small {
1249
- font-size: var(--oruga-field-font-size-small, 0.75rem);
1250
- }
1251
- .o-field__label-medium {
1252
- font-size: var(--oruga-field-font-size-medium, 1.25rem);
1253
- }
1254
- .o-field__label-large {
1255
- font-size: var(--oruga-field-font-size-large, 1.5rem);
1256
- }
1257
- .o-field__message {
1258
- display: block;
1259
- font-size: var(--oruga-field-message-font-size, 0.75rem);
1260
- margin-top: var(--oruga-field-message-margin-top, 0.25rem);
1261
- }
1262
- .o-field__message-primary {
1263
- color: var(--oruga-variant-primary, #445e00);
1264
- }
1265
- .o-field__message-secondary {
1266
- color: var(--oruga-variant-secondary, #6c757d);
1267
- }
1268
- .o-field__message-success {
1269
- color: var(--oruga-variant-success, #006724);
1270
- }
1271
- .o-field__message-info {
1272
- color: var(--oruga-variant-info, #005c98);
1273
- }
1274
- .o-field__message-warning {
1275
- color: var(--oruga-variant-warning, #f4c300);
1276
- }
1277
- .o-field__message-danger {
1278
- color: var(--oruga-variant-danger, #b60000);
1279
- }
1280
- .o-field--addons {
1281
- display: flex;
1282
- justify-content: flex-start;
1283
- }
1284
- .o-field--addons > button:first-child,
1285
- .o-field--addons > *:first-child:not(:only-child) button,
1286
- .o-field--addons > input:first-child,
1287
- .o-field--addons > *:first-child:not(:only-child) input,
1288
- .o-field--addons > select:first-child,
1289
- .o-field--addons > *:first-child:not(:only-child) select {
1290
- border-bottom-right-radius: 0;
1291
- border-top-right-radius: 0;
1292
- }
1293
- .o-field--addons > button:last-child,
1294
- .o-field--addons > *:last-child:not(:only-child) button,
1295
- .o-field--addons > input:last-child,
1296
- .o-field--addons > *:last-child:not(:only-child) input,
1297
- .o-field--addons > select:last-child,
1298
- .o-field--addons > *:last-child:not(:only-child) select {
1299
- border-bottom-left-radius: 0;
1300
- border-top-left-radius: 0;
1301
- }
1302
- .o-field--addons > *:not(:first-child):not(:last-child) button,
1303
- .o-field--addons > button:not(:first-child):not(:last-child),
1304
- .o-field--addons > *:not(:first-child):not(:last-child) input,
1305
- .o-field--addons > input:not(:first-child):not(:last-child),
1306
- .o-field--addons > *:not(:first-child):not(:last-child) select,
1307
- .o-field--addons > select:not(:first-child):not(:last-child) {
1308
- border-radius: 0;
1309
- }
1310
- .o-field--grouped {
1311
- display: flex;
1312
- margin-left: -0.37rem;
1313
- margin-right: -0.37rem;
1314
- }
1315
- .o-field--grouped > * {
1316
- margin-left: 0.37rem;
1317
- margin-right: 0.37rem;
1318
- }
1319
- .o-field--grouped-multiline {
1320
- flex-wrap: wrap;
1321
- }
1322
- .o-field--grouped-multiline:last-child {
1323
- margin-bottom: var(--oruga-field-margin-bottom, -0.75rem);
1324
- }
1325
- .o-field__horizontal-body {
1326
- display: flex;
1327
- flex-basis: 0;
1328
- flex-grow: 5;
1329
- flex-shrink: 1;
1330
- margin-left: -0.37rem;
1331
- margin-right: -0.37rem;
1332
- }
1333
- .o-field__horizontal-body > * {
1334
- margin-left: 0.37rem;
1335
- margin-right: 0.37rem;
1336
- }
1337
- .o-field--horizontal {
1338
- display: flex;
1339
- }
1340
- .o-field__horizontal-label {
1341
- flex-basis: 0;
1342
- flex-grow: 1;
1343
- flex-shrink: 0;
1344
- margin: 0 1.5rem 0 0;
1345
- text-align: right;
1346
- }
1347
- .o-field--mobile .o-field__horizontal-body {
1348
- all: unset;
1349
- }
1350
- .o-field--mobile.o-field--horizontal {
1351
- all: unset;
1352
- }
1353
- .o-field--mobile .o-field__horizontal-label {
1354
- all: unset;
1355
- }
1356
-
1357
- /* @docs */
1358
- /* @docs */
1359
- @keyframes icon-spin {
1360
- 0% {
1361
- -webkit-transform: rotate(0deg);
1362
- transform: rotate(0deg);
1363
- }
1364
- 100% {
1365
- -webkit-transform: rotate(359deg);
1366
- transform: rotate(359deg);
1367
- }
1368
- }
1369
- .o-icon {
1370
- align-items: center;
1371
- display: inline-flex;
1372
- justify-content: center;
1373
- transition: transform 150ms ease-out, opacity 300ms ease-out;
1374
- }
1375
- .o-icon--small {
1376
- font-size: var(--oruga-icon-font-size-small, 0.75rem);
1377
- }
1378
- .o-icon--medium {
1379
- font-size: var(--oruga-icon-font-size-medium, 1.25rem);
1380
- }
1381
- .o-icon--large {
1382
- font-size: var(--oruga-icon-font-size-large, 1.5rem);
1383
- }
1384
- .o-icon--primary {
1385
- color: var(--oruga-variant-primary, #445e00);
1386
- }
1387
- .o-icon--secondary {
1388
- color: var(--oruga-variant-secondary, #6c757d);
1389
- }
1390
- .o-icon--success {
1391
- color: var(--oruga-variant-success, #006724);
1392
- }
1393
- .o-icon--info {
1394
- color: var(--oruga-variant-info, #005c98);
1395
- }
1396
- .o-icon--warning {
1397
- color: var(--oruga-variant-warning, #f4c300);
1398
- }
1399
- .o-icon--danger {
1400
- color: var(--oruga-variant-danger, #b60000);
1401
- }
1402
- .o-icon--clickable {
1403
- pointer-events: auto;
1404
- cursor: pointer;
1405
- }
1406
- .o-icon--spin {
1407
- animation-name: icon-spin;
1408
- animation-iteration-count: infinite;
1409
- animation-timing-function: linear;
1410
- animation-duration: var(--oruga-icon-spin-duration, 2s);
1411
- }
1412
-
1413
- /* @docs */
1414
- /* @docs */
1415
- .o-input {
1416
- -moz-appearance: none;
1417
- -webkit-appearance: none;
1418
- display: inline-flex;
1419
- position: relative;
1420
- vertical-align: top;
1421
- box-shadow: var(--oruga-input-box-shadow, inset 0 1px 2px hsla(0, 0%, 4%, 0.1));
1422
- background-color: var(--oruga-input-background-color, #ffffff);
1423
- border-color: var(--oruga-input-border-color, #dbdbdb);
1424
- border-style: var(--oruga-input-border-style, solid);
1425
- border-width: var(--oruga-input-border-width, 1px);
1426
- border-radius: var(--oruga-input-border-radius, 4px);
1427
- color: var(--oruga-input-color, #363636);
1428
- font-size: var(--oruga-base-font-size, 1rem);
1429
- height: var(--oruga-input-height, 2.25em);
1430
- line-height: var(--oruga-input-line-height, 1.5);
1431
- padding: var(--oruga-input-padding, calc(0.375em - 1px) calc(0.625em - 1px));
1432
- margin: var(--oruga-input-margin, 0);
1433
- }
1434
- .o-input__wrapper {
1435
- display: inline-block;
1436
- position: relative;
1437
- }
1438
- .o-input__wrapper--expanded {
1439
- width: 100%;
1440
- flex-grow: 1;
1441
- flex-shrink: 1;
1442
- }
1443
- .o-input__wrapper--expanded .o-input {
1444
- width: 100%;
1445
- }
1446
- .o-input__textarea {
1447
- display: block;
1448
- max-width: 100%;
1449
- min-width: 100%;
1450
- height: auto;
1451
- resize: vertical;
1452
- padding: var(--oruga-input-textarea-padding, 0.625em);
1453
- }
1454
- .o-input__textarea:not([rows]) {
1455
- max-height: var(--oruga-input-textarea-max-height, 600px);
1456
- min-height: var(--oruga-input-textarea-min-height, 120px);
1457
- }
1458
- .o-input__counter {
1459
- display: block;
1460
- float: right;
1461
- font-size: var(--oruga-input-counter-font-size, 0.75rem);
1462
- margin: var(--oruga-input-counter-margin, 0.25rem 0 0 0.5rem);
1463
- }
1464
- .o-input__icon-left, .o-input__icon-right {
1465
- position: absolute;
1466
- top: 0;
1467
- height: 100%;
1468
- width: var(--oruga-input-height, 2.25em);
1469
- z-index: var(--oruga-input-icon-zindex, 4);
1470
- }
1471
- .o-input__icon-right {
1472
- right: 0;
1473
- }
1474
- .o-input__icon-left {
1475
- left: 0;
1476
- }
1477
- .o-input--iconspace-left {
1478
- padding-left: var(--oruga-input-height, 2.25em);
1479
- }
1480
- .o-input--iconspace-right {
1481
- padding-right: var(--oruga-input-height, 2.25em);
1482
- }
1483
- .o-input--rounded {
1484
- border-radius: var(--oruga-input-rounded-border-radius, 9999px);
1485
- }
1486
- .o-input--small {
1487
- font-size: var(--oruga-input-font-size-small, 0.75rem);
1488
- }
1489
- .o-input--medium {
1490
- font-size: var(--oruga-input-font-size-medium, 1.25rem);
1491
- }
1492
- .o-input--large {
1493
- font-size: var(--oruga-input-font-size-large, 1.5rem);
1494
- }
1495
- .o-input--primary {
1496
- border-color: var(--oruga-variant-primary, #445e00);
1497
- }
1498
- .o-input--secondary {
1499
- border-color: var(--oruga-variant-secondary, #6c757d);
1500
- }
1501
- .o-input--success {
1502
- border-color: var(--oruga-variant-success, #006724);
1503
- }
1504
- .o-input--info {
1505
- border-color: var(--oruga-variant-info, #005c98);
1506
- }
1507
- .o-input--warning {
1508
- border-color: var(--oruga-variant-warning, #f4c300);
1509
- }
1510
- .o-input--danger {
1511
- border-color: var(--oruga-variant-danger, #b60000);
1512
- }
1513
-
1514
- /* @docs */
1515
- /* @docs */
1516
- .o-load {
1517
- position: absolute;
1518
- bottom: 0;
1519
- left: 0;
1520
- right: 0;
1521
- top: 0;
1522
- align-items: center;
1523
- display: flex;
1524
- justify-content: center;
1525
- overflow: hidden;
1526
- z-index: var(--oruga-loading-zindex, 29);
1527
- }
1528
- .o-load--fullpage {
1529
- position: fixed;
1530
- z-index: var(--oruga-loading-fullpage-zindex, 999);
1531
- }
1532
- .o-load__overlay {
1533
- position: absolute;
1534
- bottom: 0;
1535
- left: 0;
1536
- right: 0;
1537
- top: 0;
1538
- background: var(--oruga-loading-overlay-legacy, #7f7f7f);
1539
- background: var(--oruga-loading-overlay, rgba(255, 255, 255, 0.5));
1540
- }
1541
-
1542
- /* @docs */
1543
- /* @docs */
1544
- .o-menu {
1545
- font-size: var(--oruga-base-font-size, 1rem);
1546
- }
1547
- .o-menu--small {
1548
- font-size: var(--oruga-menu-font-size-small, 0.75rem);
1549
- }
1550
- .o-menu--medium {
1551
- font-size: var(--oruga-menu-font-size-medium, 1.25rem);
1552
- }
1553
- .o-menu--large {
1554
- font-size: var(--oruga-menu-font-size-large, 1.5rem);
1555
- }
1556
- .o-menu__list, .o-menu__item__wrapper {
1557
- list-style: none;
1558
- }
1559
- .o-menu__list {
1560
- line-height: var(--oruga-menu-list-line-height, 1.25em);
1561
- }
1562
- .o-menu__item__submenu {
1563
- border-left: var(--oruga-menu-list-border-left, 1px solid #445e00);
1564
- padding-left: var(--oruga-menu-nested-list-padding-left, 0.75em);
1565
- margin: var(--oruga-menu-nested-list-margin, 0.75em);
1566
- }
1567
- .o-menu__label {
1568
- color: var(--oruga-menu-label-color, #7a7a7a);
1569
- font-size: var(--oruga-menu-label-font-size, 0.75em);
1570
- text-transform: uppercase;
1571
- }
1572
- .o-menu__label:not(:first-child) {
1573
- margin-top: var(--oruga-menu-label-spacing, 1em);
1574
- }
1575
- .o-menu__label:not(:last-child) {
1576
- margin-bottom: var(--oruga-menu-label-spacing, 1em);
1577
- }
1578
- .o-menu__item {
1579
- color: var(--oruga-menu-item-color, #4a4a4a);
1580
- padding: var(--oruga-menu-item-padding, 0.5em 0.75em);
1581
- display: block;
1582
- list-style: none;
1583
- }
1584
- .o-menu__item:hover:not(.o-menu__item--active):not(.o-menu__item--disabled) {
1585
- color: var(--oruga-menu-item-hover-color, #000000);
1586
- background-color: var(--oruga-menu-item-hover-background-color, #b5b5b5);
1587
- }
1588
- .o-menu__item--active {
1589
- color: var(--oruga-menu-item-active-color, #ffffff);
1590
- background-color: var(--oruga-menu-item-active-background-color, #445e00);
1591
- }
1592
- .o-menu__item--disabled {
1593
- color: var(--oruga-menu-item-disabled-color, #b5b5b5);
1594
- }
1595
-
1596
- /* @docs */
1597
- /* @docs */
1598
- .o-modal {
1599
- display: flex;
1600
- flex-direction: column;
1601
- justify-content: center;
1602
- align-items: center;
1603
- overflow: hidden;
1604
- position: fixed;
1605
- bottom: 0;
1606
- left: 0;
1607
- right: 0;
1608
- top: 0;
1609
- z-index: var(--oruga-modal-zindex, 40);
1610
- }
1611
- .o-modal__overlay {
1612
- bottom: 0;
1613
- left: 0;
1614
- position: absolute;
1615
- right: 0;
1616
- top: 0;
1617
- background-color: var(--oruga-modal-overlay-background-color, hsla(0, 0%, 4%, 0.86));
1618
- }
1619
- .o-modal__content {
1620
- overflow: auto;
1621
- position: relative;
1622
- margin: var(--oruga-modal-content-margin, 0 auto);
1623
- max-height: var(--oruga-modal-content-max-height, calc(100vh - 160px));
1624
- background-color: var(--oruga-modal-content-background-color, #ffffff);
1625
- border-radius: var(--oruga-modal-content-border-radius, 4px);
1626
- }
1627
- .o-modal__content--full-screen {
1628
- width: 100%;
1629
- height: 100%;
1630
- max-height: 100vh;
1631
- margin: 0;
1632
- background-color: var(--oruga-modal-content-fullscreen-background-color, #f5f5f5);
1633
- }
1634
- .o-modal__close {
1635
- background: none;
1636
- position: fixed;
1637
- border: none;
1638
- display: inline-block;
1639
- vertical-align: top;
1640
- border-radius: var(--oruga-modal-close-border-radius, 9999px);
1641
- right: var(--oruga-modal-close-right, 20px);
1642
- top: var(--oruga-modal-close-top, 20px);
1643
- height: var(--oruga-modal-close-size, 32px);
1644
- width: var(--oruga-modal-close-size, 32px);
1645
- color: var(--oruga-modal-close-color, #ffffff);
1646
- }
1647
- .o-modal--mobile .o-modal__content {
1648
- width: 100%;
1649
- }
1650
-
1651
- /* @docs */
1652
- /* @docs */
1653
- .o-notification {
1654
- background-color: var(--oruga-notification-background-color, #445e00);
1655
- color: var(--oruga-notification-color, #ffffff);
1656
- border-radius: var(--oruga-notification-border-radius, 4px);
1657
- padding: var(--oruga-notification-padding, 1.75em 1.75em);
1658
- margin-bottom: var(--oruga-notification-margin-bottom, 1.5rem);
1659
- position: relative;
1660
- transform-origin: 50% 0;
1661
- }
1662
- .o-notification__content {
1663
- flex-basis: auto;
1664
- flex-grow: 1;
1665
- flex-shrink: 1;
1666
- text-align: inherit;
1667
- overflow-y: hidden;
1668
- overflow-x: auto;
1669
- }
1670
- .o-notification__wrapper {
1671
- align-items: flex-start;
1672
- display: flex;
1673
- text-align: inherit;
1674
- padding-top: 0;
1675
- border: 0;
1676
- }
1677
- .o-notification__icon {
1678
- flex-basis: auto;
1679
- flex-grow: 0;
1680
- flex-shrink: 0;
1681
- margin-right: var(--oruga-notification-icon-margin-right, 1rem);
1682
- }
1683
- .o-notification__close {
1684
- position: absolute;
1685
- border: none;
1686
- cursor: pointer;
1687
- pointer-events: auto;
1688
- display: flex;
1689
- justify-content: center;
1690
- align-items: center;
1691
- flex-grow: 0;
1692
- flex-shrink: 0;
1693
- vertical-align: top;
1694
- background-color: var(--oruga-notification-close-background-color, hsla(0, 0%, 4%, 0.2));
1695
- border-radius: var(--oruga-notification-close-border-radius, 9999px);
1696
- right: var(--oruga-notification-close-right, 0.5rem);
1697
- top: var(--oruga-notification-close-top, 0.5rem);
1698
- height: var(--oruga-notification-close-size, 20px);
1699
- width: var(--oruga-notification-close-size, 20px);
1700
- color: var(--oruga-notification-close-color, #ffffff);
1701
- }
1702
- .o-notification--primary {
1703
- border-color: transparent;
1704
- background-color: var(--oruga-variant-primary, #445e00);
1705
- color: var(--oruga-variant-invert-primary, #ffffff);
1706
- }
1707
- .o-notification--primary:hover {
1708
- filter: brightness(97.5%);
1709
- }
1710
- .o-notification--secondary {
1711
- border-color: transparent;
1712
- background-color: var(--oruga-variant-secondary, #6c757d);
1713
- color: var(--oruga-variant-invert-secondary, #ffffff);
1714
- }
1715
- .o-notification--secondary:hover {
1716
- filter: brightness(97.5%);
1717
- }
1718
- .o-notification--success {
1719
- border-color: transparent;
1720
- background-color: var(--oruga-variant-success, #006724);
1721
- color: var(--oruga-variant-invert-success, #ffffff);
1722
- }
1723
- .o-notification--success:hover {
1724
- filter: brightness(97.5%);
1725
- }
1726
- .o-notification--info {
1727
- border-color: transparent;
1728
- background-color: var(--oruga-variant-info, #005c98);
1729
- color: var(--oruga-variant-invert-info, #ffffff);
1730
- }
1731
- .o-notification--info:hover {
1732
- filter: brightness(97.5%);
1733
- }
1734
- .o-notification--warning {
1735
- border-color: transparent;
1736
- background-color: var(--oruga-variant-warning, #f4c300);
1737
- color: var(--oruga-variant-invert-warning, #000000);
1738
- }
1739
- .o-notification--warning:hover {
1740
- filter: brightness(97.5%);
1741
- }
1742
- .o-notification--danger {
1743
- border-color: transparent;
1744
- background-color: var(--oruga-variant-danger, #b60000);
1745
- color: var(--oruga-variant-invert-danger, #ffffff);
1746
- }
1747
- .o-notification--danger:hover {
1748
- filter: brightness(97.5%);
1749
- }
1750
-
1751
- .o-notices {
1752
- position: fixed;
1753
- display: flex;
1754
- top: 0;
1755
- bottom: 0;
1756
- left: 0;
1757
- right: 0;
1758
- overflow: hidden;
1759
- pointer-events: none;
1760
- padding: var(--oruga-notification-notices-padding, 2em);
1761
- z-index: var(--oruga-notification-notices-zindex, 1000);
1762
- }
1763
- .o-notices .o-notification {
1764
- pointer-events: stroke;
1765
- max-width: 600px;
1766
- animation: var(--oruga-notification-animantion, append-animate 0.3s linear);
1767
- }
1768
- .o-notices .o-notification--top, .o-notices .o-notification--bottom {
1769
- align-self: center;
1770
- }
1771
- .o-notices .o-notification--top-right, .o-notices .o-notification--bottom-right {
1772
- align-self: flex-end;
1773
- }
1774
- .o-notices .o-notification--top-left, .o-notices .o-notification--bottom-left {
1775
- align-self: flex-start;
1776
- }
1777
- .o-notices--top {
1778
- flex-direction: column;
1779
- }
1780
- .o-notices--bottom {
1781
- flex-direction: column-reverse;
1782
- }
1783
- .o-notices--bottom .o-notification {
1784
- margin-bottom: 0;
1785
- }
1786
- .o-notices--bottom .o-notification:not(:first-child) {
1787
- margin-bottom: 1.5rem;
1788
- }
1789
- .o-notices__custom-container {
1790
- position: absolute;
1791
- }
1792
-
1793
- /* @docs */
1794
- /* @docs */
1795
- .o-pag {
1796
- align-items: center;
1797
- display: flex;
1798
- text-align: center;
1799
- justify-content: space-between;
1800
- font-size: var(--oruga-base-font-size, 1rem);
1801
- margin: var(--oruga-pagination-margin, -0.25rem);
1802
- }
1803
- .o-pag--small {
1804
- font-size: var(--oruga-pagination-font-size-small, 0.75rem);
1805
- }
1806
- .o-pag--medium {
1807
- font-size: var(--oruga-pagination-font-size-medium, 1.25rem);
1808
- }
1809
- .o-pag--large {
1810
- font-size: var(--oruga-pagination-font-size-large, 1.5rem);
1811
- }
1812
- .o-pag__link {
1813
- -moz-appearance: none;
1814
- -webkit-appearance: none;
1815
- align-items: center;
1816
- box-shadow: none;
1817
- display: inline-flex;
1818
- position: relative;
1819
- vertical-align: top;
1820
- justify-content: center;
1821
- text-align: center;
1822
- text-decoration: none;
1823
- cursor: pointer;
1824
- -webkit-touch-callout: none;
1825
- -webkit-user-select: none;
1826
- -moz-user-select: none;
1827
- -ms-user-select: none;
1828
- user-select: none;
1829
- line-height: var(--oruga-pagination-link-line-height, 1.5);
1830
- border: var(--oruga-pagination-link-border, 1px solid transparent);
1831
- border-radius: var(--oruga-pagination-link-border-radius, 4px);
1832
- border-color: var(--oruga-pagination-link-border-color, #dbdbdb);
1833
- color: var(--oruga-pagination-link-color, #363636);
1834
- min-width: var(--oruga-pagination-link-min-width, 2.25em);
1835
- height: var(--oruga-pagination-link-height, 2.25em);
1836
- padding: var(--oruga-pagination-link-padding, 0.5em 0.5em);
1837
- margin: var(--oruga-pagination-link-margin, 0.25rem);
1838
- }
1839
- .o-pag__link:hover {
1840
- text-decoration: none;
1841
- border-color: var(--oruga-pagination-link-hover-border-color, #b5b5b5);
1842
- }
1843
- .o-pag__link--rounded {
1844
- border-radius: var(--oruga-pagination-rounded-border-radius, 9999px);
1845
- }
1846
- .o-pag__link--disabled {
1847
- pointer-events: none;
1848
- opacity: var(--oruga-pagination-disabled-opacity, 0.5);
1849
- }
1850
- .o-pag__link--current {
1851
- pointer-events: none;
1852
- background-color: var(--oruga-pagination-link-current-background-color, #445e00);
1853
- border-color: var(--oruga-pagination-link-current-border-color, #445e00);
1854
- color: var(--oruga-pagination-link-current-color, #fff);
1855
- }
1856
- .o-pag__ellipsis {
1857
- justify-content: center;
1858
- text-align: center;
1859
- pointer-events: none;
1860
- margin: var(--oruga-pagination-link-margin, 0.25rem);
1861
- color: var(--oruga-pagination-ellipsis-color, #b5b5b5);
1862
- }
1863
- .o-pag__next {
1864
- order: 3;
1865
- }
1866
- .o-pag__previous {
1867
- order: 2;
1868
- }
1869
- .o-pag__list {
1870
- align-items: center;
1871
- display: flex;
1872
- text-align: center;
1873
- list-style: none;
1874
- flex-wrap: wrap;
1875
- margin: 0;
1876
- padding: 0;
1877
- flex-grow: 1;
1878
- flex-shrink: 1;
1879
- justify-content: flex-start;
1880
- order: 1;
1881
- }
1882
- .o-pag--simple {
1883
- justify-content: normal;
1884
- }
1885
- .o-pag--centered {
1886
- justify-content: center;
1887
- }
1888
- .o-pag--centered .o-pag__previous {
1889
- order: 1;
1890
- }
1891
- .o-pag--centered .o-pag__next {
1892
- order: 3;
1893
- }
1894
- .o-pag--centered .o-pag__list {
1895
- justify-content: center;
1896
- order: 2;
1897
- }
1898
- .o-pag--right {
1899
- justify-content: flex-end;
1900
- }
1901
- .o-pag--right .o-pag__previous {
1902
- order: 1;
1903
- }
1904
- .o-pag--right .o-pag__next {
1905
- order: 2;
1906
- }
1907
- .o-pag--right .o-pag__list {
1908
- justify-content: flex-end;
1909
- order: 2;
1910
- }
1911
- .o-pag--mobile {
1912
- justify-content: flex-start;
1913
- flex-wrap: wrap;
1914
- }
1915
- .o-pag--mobile .o-pag__link {
1916
- flex-grow: 1;
1917
- flex-shrink: 1;
1918
- }
1919
- .o-pag--mobile .o-pag__previous {
1920
- flex-grow: 1;
1921
- flex-shrink: 1;
1922
- order: 0;
1923
- }
1924
- .o-pag--mobile .o-pag__next {
1925
- flex-grow: 1;
1926
- flex-shrink: 1;
1927
- order: 0;
1928
- }
1929
- .o-pag--mobile .o-pag__ellipsis {
1930
- flex-grow: 1;
1931
- flex-shrink: 1;
1932
- }
1933
- .o-pag--mobile .o-pag__list {
1934
- order: 0;
1935
- }
1936
-
1937
- /* @docs */
1938
- /* @docs */
1939
- .o-radio {
1940
- display: inline-flex;
1941
- align-items: center;
1942
- cursor: pointer;
1943
- -webkit-touch-callout: none;
1944
- -webkit-user-select: none;
1945
- -moz-user-select: none;
1946
- -ms-user-select: none;
1947
- user-select: none;
1948
- line-height: var(--oruga-radio-line-height, 1.25);
1949
- margin-right: var(--oruga-radio-margin-sibiling, 0.5em);
1950
- }
1951
- .o-radio__input {
1952
- width: var(--oruga-radio-size, 1rem);
1953
- height: var(--oruga-radio-size, 1rem);
1954
- margin: 0;
1955
- vertical-align: top;
1956
- background-position: center;
1957
- background-size: contain;
1958
- -webkit-appearance: none;
1959
- -moz-appearance: none;
1960
- appearance: none;
1961
- -webkit-print-color-adjust: exact;
1962
- print-color-adjust: exact;
1963
- border-radius: 50%;
1964
- cursor: pointer;
1965
- background-repeat: no-repeat;
1966
- transition-property: background;
1967
- transition-duration: var(--oruga-transition-duration, 150ms);
1968
- transition-timing-function: var(--oruga-transition-timing, ease-out);
1969
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-radio-active-background-color, %23445e00);'/%3E%3C/g%3E%3C/svg%3E");
1970
- }
1971
- .o-radio__input--checked {
1972
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-radio-active-background-color, %23445e00);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:transparent;'/%3E%3C/g%3E%3C/svg%3E");
1973
- }
1974
- .o-radio__label {
1975
- padding: var(--oruga-radio-label-padding, 0 0 0 0.5em);
1976
- }
1977
- .o-radio--disabled {
1978
- opacity: var(--oruga-radio-disabled-opacity, 0.5);
1979
- }
1980
- .o-radio--small {
1981
- font-size: var(--oruga-radio-font-size-small, 0.75rem);
1982
- }
1983
- .o-radio--medium {
1984
- font-size: var(--oruga-radio-font-size-medium, 1.25rem);
1985
- }
1986
- .o-radio--large {
1987
- font-size: var(--oruga-radio-font-size-large, 1.5rem);
1988
- }
1989
- .o-radio--primary .o-radio__input {
1990
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-variant-primary, %23445e00);'/%3E%3C/g%3E%3C/svg%3E");
1991
- }
1992
- .o-radio--primary .o-radio__input--checked {
1993
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-variant-primary, %23445e00);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:var(--oruga-variant-invert-primary, %23ffffff);'/%3E%3C/g%3E%3C/svg%3E");
1994
- }
1995
- .o-radio--secondary .o-radio__input {
1996
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-variant-secondary, %236c757d);'/%3E%3C/g%3E%3C/svg%3E");
1997
- }
1998
- .o-radio--secondary .o-radio__input--checked {
1999
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-variant-secondary, %236c757d);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:var(--oruga-variant-invert-secondary, %23ffffff);'/%3E%3C/g%3E%3C/svg%3E");
2000
- }
2001
- .o-radio--success .o-radio__input {
2002
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-variant-success, %23006724);'/%3E%3C/g%3E%3C/svg%3E");
2003
- }
2004
- .o-radio--success .o-radio__input--checked {
2005
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-variant-success, %23006724);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:var(--oruga-variant-invert-success, %23ffffff);'/%3E%3C/g%3E%3C/svg%3E");
2006
- }
2007
- .o-radio--info .o-radio__input {
2008
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-variant-info, %23005c98);'/%3E%3C/g%3E%3C/svg%3E");
2009
- }
2010
- .o-radio--info .o-radio__input--checked {
2011
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-variant-info, %23005c98);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:var(--oruga-variant-invert-info, %23ffffff);'/%3E%3C/g%3E%3C/svg%3E");
2012
- }
2013
- .o-radio--warning .o-radio__input {
2014
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-variant-warning, %23f4c300);'/%3E%3C/g%3E%3C/svg%3E");
2015
- }
2016
- .o-radio--warning .o-radio__input--checked {
2017
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-variant-warning, %23f4c300);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:var(--oruga-variant-invert-warning, %23000000);'/%3E%3C/g%3E%3C/svg%3E");
2018
- }
2019
- .o-radio--danger .o-radio__input {
2020
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:var(--oruga-variant-danger, %23b60000);'/%3E%3C/g%3E%3C/svg%3E");
2021
- }
2022
- .o-radio--danger .o-radio__input--checked {
2023
- background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:var(--oruga-variant-danger, %23b60000);'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:var(--oruga-variant-invert-danger, %23ffffff);'/%3E%3C/g%3E%3C/svg%3E");
2024
- }
2025
-
2026
- /* @docs */
2027
- /* @docs */
2028
- .o-ctrl-sel {
2029
- display: inline-flex;
2030
- position: relative;
2031
- }
2032
- .o-ctrl-sel--expanded {
2033
- width: 100%;
2034
- flex-grow: 1;
2035
- flex-shrink: 1;
2036
- }
2037
-
2038
- .o-sel {
2039
- -moz-appearance: none;
2040
- -webkit-appearance: none;
2041
- display: inline-block;
2042
- position: relative;
2043
- vertical-align: top;
2044
- cursor: pointer;
2045
- justify-content: flex-start;
2046
- align-items: center;
2047
- font-size: var(--oruga-base-font-size, 1rem);
2048
- max-width: var(--oruga-select-max-width, 100%);
2049
- width: var(--oruga-select-width, 100%);
2050
- background-color: var(--oruga-select-background-color, #fff);
2051
- border-color: var(--oruga-select-border-color, #dbdbdb);
2052
- border-width: var(--oruga-select-border-width, 1px);
2053
- border-style: var(--oruga-select-border-style, solid);
2054
- border-radius: var(--oruga-select-border-radius, 4px);
2055
- color: var(--oruga-select-color, #363636);
2056
- margin: var(--oruga-select-margin, 0);
2057
- box-shadow: var(--oruga-select-box-shadow, none);
2058
- line-height: var(--oruga-select-line-height, 1.5);
2059
- padding: var(--oruga-select-padding, calc(0.375em - 1px) calc(0.625em - 1px));
2060
- height: var(--oruga-select-height, 2.25em);
2061
- }
2062
- .o-sel-arrow {
2063
- background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:serif='http://www.serif.com/' width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xml:space='preserve' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(5.70052,0,0,5.70052,-1329.79,-547.054)'%3E%3Cpath d='M233.451,101.749L235.617,99.422L242.013,105.565L248.463,99.422L250.642,101.749L242.013,110.052L233.451,101.749Z' style='fill:var(--oruga-select-arrow-color, %23363636);stroke:white;stroke-width:0.18px;'/%3E%3C/g%3E%3C/svg%3E");
2064
- background-repeat: no-repeat;
2065
- background-size: var(--oruga-select-arrow-size, 1rem);
2066
- background-position: calc(100% - var(--oruga-select-arrow-size, 1rem) * 0.5) center;
2067
- padding-right: calc(var(--oruga-select-arrow-size, 1rem) * 2);
2068
- }
2069
- .o-sel-iconspace-left {
2070
- padding-left: var(--oruga-select-height, 2.25em);
2071
- }
2072
- .o-sel-iconspace-right {
2073
- padding-right: var(--oruga-select-height, 2.25em);
2074
- }
2075
- .o-sel--small {
2076
- font-size: var(--oruga-select-font-size-small, 0.75rem);
2077
- }
2078
- .o-sel--medium {
2079
- font-size: var(--oruga-select-font-size-medium, 1.25rem);
2080
- }
2081
- .o-sel--large {
2082
- font-size: var(--oruga-select-font-size-large, 1.5rem);
2083
- }
2084
- .o-sel--primary {
2085
- border-color: var(--oruga-variant-primary, #445e00);
2086
- }
2087
- .o-sel--secondary {
2088
- border-color: var(--oruga-variant-secondary, #6c757d);
2089
- }
2090
- .o-sel--success {
2091
- border-color: var(--oruga-variant-success, #006724);
2092
- }
2093
- .o-sel--info {
2094
- border-color: var(--oruga-variant-info, #005c98);
2095
- }
2096
- .o-sel--warning {
2097
- border-color: var(--oruga-variant-warning, #f4c300);
2098
- }
2099
- .o-sel--danger {
2100
- border-color: var(--oruga-variant-danger, #b60000);
2101
- }
2102
- .o-sel--rounded {
2103
- border-radius: var(--oruga-select-rounded-border-radius, 9999px);
2104
- }
2105
- .o-sel--multiple {
2106
- height: auto;
2107
- padding: 0;
2108
- }
2109
- .o-sel--placeholder {
2110
- opacity: var(--oruga-select-placeholder-opacity, 0.5);
2111
- }
2112
- .o-sel__icon-left, .o-sel__icon-right {
2113
- position: absolute;
2114
- top: 0;
2115
- height: 100%;
2116
- width: var(--oruga-select-height, 2.25em);
2117
- z-index: var(--oruga-select-icon-zindex, 4);
2118
- }
2119
- .o-sel__icon-right {
2120
- right: 0;
2121
- }
2122
- .o-sel__icon-left {
2123
- left: 0;
2124
- }
2125
-
2126
- /* @docs */
2127
- /* @docs */
2128
- @keyframes skeleton-loading {
2129
- 0% {
2130
- background-position: 100% 50%;
2131
- }
2132
- 100% {
2133
- background-position: 0 50%;
2134
- }
2135
- }
2136
- .o-sklt {
2137
- display: inline-flex;
2138
- flex-direction: column;
2139
- vertical-align: middle;
2140
- width: 100%;
2141
- }
2142
- .o-sklt__item {
2143
- width: 100%;
2144
- background: var(--oruga-skeleton-background, linear-gradient(90deg, #dbdbdb 25%, rgba(219, 219, 219, 0.5) 50%, #dbdbdb 75%));
2145
- margin: var(--oruga-skeleton-margin, 0.5rem 0 0 0);
2146
- line-height: var(--oruga-skeleton-font-size, 1rem);
2147
- }
2148
- .o-sklt__item--rounded {
2149
- border-radius: var(--oruga-skeleton-border-radius, 4px);
2150
- }
2151
- .o-sklt__item--animated {
2152
- background-size: 400% 100%;
2153
- animation-name: skeleton-loading;
2154
- animation-iteration-count: infinite;
2155
- animation-duration: var(--oruga-skeleton-duration, 1.5s);
2156
- }
2157
- .o-sklt__item::after {
2158
- content: " ";
2159
- }
2160
- .o-sklt__item--small {
2161
- line-height: var(--oruga-skeleton-font-size-small, 0.75rem);
2162
- }
2163
- .o-sklt__item--medium {
2164
- line-height: var(--oruga-skeleton-font-size-medium, 1.25rem);
2165
- }
2166
- .o-sklt__item--large {
2167
- line-height: var(--oruga-skeleton-font-size-large, 1.5rem);
2168
- }
2169
- .o-sklt--centered {
2170
- align-items: center;
2171
- }
2172
- .o-sklt--right {
2173
- align-items: flex-end;
2174
- margin: var(--oruga-skeleton-margin, 0.5rem 0 0 0);
2175
- }
2176
-
2177
- /* @docs */
2178
- /* @docs */
2179
- .o-side {
2180
- position: fixed;
2181
- top: 0;
2182
- left: 0;
2183
- height: 100%;
2184
- width: 100%;
2185
- display: none;
2186
- z-index: var(--oruga-sidebar-zindex, 100);
2187
- }
2188
- .o-side__content {
2189
- position: absolute;
2190
- background-color: var(--oruga-sidebar-content-background-color, #dbdbdb);
2191
- border-radius: var(--oruga-sidebar-border-radius, 4px);
2192
- box-shadow: var(--oruga-sidebar-box-shadow, 5px 0px 13px 3px rgba(0, 0, 0, 0.1));
2193
- }
2194
- .o-side__content--primary {
2195
- background-color: var(--oruga-variant-primary, #445e00);
2196
- }
2197
- .o-side__content--secondary {
2198
- background-color: var(--oruga-variant-secondary, #6c757d);
2199
- }
2200
- .o-side__content--success {
2201
- background-color: var(--oruga-variant-success, #006724);
2202
- }
2203
- .o-side__content--info {
2204
- background-color: var(--oruga-variant-info, #005c98);
2205
- }
2206
- .o-side__content--warning {
2207
- background-color: var(--oruga-variant-warning, #f4c300);
2208
- }
2209
- .o-side__content--danger {
2210
- background-color: var(--oruga-variant-danger, #b60000);
2211
- }
2212
- .o-side__content--right, .o-side__content--left {
2213
- transition-duration: var(--oruga-transition-duration, 150ms);
2214
- transition-timing-function: var(--oruga-transition-timing, ease-out);
2215
- width: var(--oruga-sidebar-width, 260px);
2216
- transition: width;
2217
- }
2218
- .o-side__content--top, .o-side__content--bottom {
2219
- transition-duration: var(--oruga-transition-duration, 150ms);
2220
- transition-timing-function: var(--oruga-transition-timing, ease-out);
2221
- height: var(--oruga-sidebar-width, 260px);
2222
- transition: height;
2223
- }
2224
- .o-side__content--right {
2225
- left: auto;
2226
- right: 0;
2227
- border-left: var(--oruga-sidebar-border-width, 1px) solid var(--oruga-sidebar-border-color, rgba(0, 0, 0, 0.175));
2228
- }
2229
- .o-side__content--left {
2230
- left: 0;
2231
- right: auto;
2232
- border-right: var(--oruga-sidebar-border-width, 1px) solid var(--oruga-sidebar-border-color, rgba(0, 0, 0, 0.175));
2233
- }
2234
- .o-side__content--top {
2235
- top: 0;
2236
- bottom: auto;
2237
- border-bottom: var(--oruga-sidebar-border-width, 1px) solid var(--oruga-sidebar-border-color, rgba(0, 0, 0, 0.175));
2238
- }
2239
- .o-side__content--bottom {
2240
- top: auto;
2241
- bottom: 0;
2242
- border-top: var(--oruga-sidebar-border-width, 1px) solid var(--oruga-sidebar-border-color, rgba(0, 0, 0, 0.175));
2243
- }
2244
- .o-side__content--reduced {
2245
- width: var(--oruga-sidebar-reduced-width, 80px);
2246
- }
2247
- .o-side__content--reduced-expand:hover {
2248
- transition-duration: var(--oruga-transition-duration, 150ms);
2249
- transition-timing-function: var(--oruga-transition-timing, ease-out);
2250
- width: var(--oruga-sidebar-width, 260px);
2251
- transition: width;
2252
- }
2253
- .o-side__content--fullwidth {
2254
- width: 100%;
2255
- max-width: 100%;
2256
- }
2257
- .o-side__content--fullheight {
2258
- height: 100%;
2259
- max-height: 100%;
2260
- }
2261
- .o-side__overlay {
2262
- position: absolute;
2263
- bottom: 0;
2264
- left: 0;
2265
- right: 0;
2266
- top: 0;
2267
- background: var(--oruga-sidebar-overlay, hsla(0, 0%, 4%, 0.86));
2268
- }
2269
- .o-side--active {
2270
- display: block;
2271
- }
2272
- .o-side--inline {
2273
- position: relative;
2274
- }
2275
- .o-side--inline .o-side__overlay {
2276
- position: absolute;
2277
- }
2278
- .o-side--inline .o-side__content {
2279
- position: relative;
2280
- }
2281
-
2282
- /* @docs */
2283
- /* @docs */
2284
- .o-slide {
2285
- margin: var(--oruga-slider-margin, 1em 0);
2286
- background: var(--oruga-slider-background, transparent);
2287
- width: 100%;
2288
- }
2289
- .o-slide__thumb {
2290
- box-shadow: var(--oruga-slider-thumb-shadow, none);
2291
- border: var(--oruga-slider-thumb-border, 1px solid #b5b5b5);
2292
- border-radius: var(--oruga-slider-thumb-radius, 4px);
2293
- background: var(--oruga-slider-thumb-background, #ffffff);
2294
- }
2295
- .o-slide__thumb:focus {
2296
- transform: var(--oruga-slider-thumb-transform, scale(1.25));
2297
- }
2298
- .o-slide__thumb--rounded {
2299
- border-radius: var(--oruga-slider-rounded-borded-radius, 9999px);
2300
- }
2301
- .o-slide__thumb--dragging {
2302
- cursor: grabbing;
2303
- filter: brightness(0.8);
2304
- }
2305
- .o-slide__track {
2306
- display: flex;
2307
- align-items: center;
2308
- position: relative;
2309
- cursor: pointer;
2310
- background: var(--oruga-slider-track-background, #dbdbdb);
2311
- border-radius: var(--oruga-slider-track-border-radius, 4px);
2312
- }
2313
- .o-slide__fill {
2314
- position: absolute;
2315
- height: 100%;
2316
- box-shadow: var(--oruga-slider-track-shadow, 0px 0px 0px #7a7a7a);
2317
- background: var(--oruga-slider-fill-background, #445e00);
2318
- border-radius: var(--oruga-slider-track-radius, 4px);
2319
- border: var(--oruga-slider-track-border, 0px solid #7a7a7a);
2320
- top: 50%;
2321
- transform: translateY(-50%);
2322
- }
2323
- .o-slide__fill--primary {
2324
- background: var(--oruga-variant-primary, #445e00);
2325
- }
2326
- .o-slide__fill--secondary {
2327
- background: var(--oruga-variant-secondary, #6c757d);
2328
- }
2329
- .o-slide__fill--success {
2330
- background: var(--oruga-variant-success, #006724);
2331
- }
2332
- .o-slide__fill--info {
2333
- background: var(--oruga-variant-info, #005c98);
2334
- }
2335
- .o-slide__fill--warning {
2336
- background: var(--oruga-variant-warning, #f4c300);
2337
- }
2338
- .o-slide__fill--danger {
2339
- background: var(--oruga-variant-danger, #b60000);
2340
- }
2341
- .o-slide .o-slide__track {
2342
- height: var(--oruga-slider-track-height, 0.5rem);
2343
- }
2344
- .o-slide .o-slide__thumb {
2345
- height: var(--oruga-slider-thumb-size, 1rem);
2346
- width: var(--oruga-slider-thumb-size, 1rem);
2347
- }
2348
- .o-slide .o-slide__tick {
2349
- height: var(--oruga-slider-tick-height, 0.25rem);
2350
- }
2351
- .o-slide .o-slide__tick-label {
2352
- font-size: var(--oruga-slider-mark-size, 0.75rem);
2353
- position: absolute;
2354
- top: calc(var(--oruga-slider-tick-label-top-, 0.5rem) * 0.5 + 2px);
2355
- left: 50%;
2356
- transform: translateX(-50%);
2357
- }
2358
- .o-slide--small .o-slide__track {
2359
- height: var(--oruga-slider-track-height-small, 0.375rem);
2360
- }
2361
- .o-slide--small .o-slide__thumb {
2362
- height: var(--oruga-slider-thumb-size-small, 0.75rem);
2363
- width: var(--oruga-slider-thumb-size-small, 0.75rem);
2364
- }
2365
- .o-slide--small .o-slide__tick {
2366
- height: var(--oruga-slider-tick-height-small, 0.1875rem);
2367
- }
2368
- .o-slide--small .o-slide__tick-label {
2369
- font-size: var(--oruga-slider-mark-size-small, 0.75rem);
2370
- position: absolute;
2371
- top: calc(var(--oruga-slider-tick-label-top-small, 0.375rem) * 0.5 + 2px);
2372
- left: 50%;
2373
- transform: translateX(-50%);
2374
- }
2375
- .o-slide--medium .o-slide__track {
2376
- height: var(--oruga-slider-track-height-medium, 0.625rem);
2377
- }
2378
- .o-slide--medium .o-slide__thumb {
2379
- height: var(--oruga-slider-thumb-size-medium, 1.25rem);
2380
- width: var(--oruga-slider-thumb-size-medium, 1.25rem);
2381
- }
2382
- .o-slide--medium .o-slide__tick {
2383
- height: var(--oruga-slider-tick-height-medium, 0.3125rem);
2384
- }
2385
- .o-slide--medium .o-slide__tick-label {
2386
- font-size: var(--oruga-slider-mark-size-medium, 0.75rem);
2387
- position: absolute;
2388
- top: calc(var(--oruga-slider-tick-label-top-medium, 0.625rem) * 0.5 + 2px);
2389
- left: 50%;
2390
- transform: translateX(-50%);
2391
- }
2392
- .o-slide--large .o-slide__track {
2393
- height: var(--oruga-slider-track-height-large, 0.75rem);
2394
- }
2395
- .o-slide--large .o-slide__thumb {
2396
- height: var(--oruga-slider-thumb-size-large, 1.5rem);
2397
- width: var(--oruga-slider-thumb-size-large, 1.5rem);
2398
- }
2399
- .o-slide--large .o-slide__tick {
2400
- height: var(--oruga-slider-tick-height-large, 0.375rem);
2401
- }
2402
- .o-slide--large .o-slide__tick-label {
2403
- font-size: var(--oruga-slider-mark-size-large, 0.75rem);
2404
- position: absolute;
2405
- top: calc(var(--oruga-slider-tick-label-top-large, 0.75rem) * 0.5 + 2px);
2406
- left: 50%;
2407
- transform: translateX(-50%);
2408
- }
2409
- .o-slide__tick {
2410
- position: absolute;
2411
- transform: translate(-50%, -50%);
2412
- top: 50%;
2413
- width: var(--oruga-slider-tick-width, 3px);
2414
- background: var(--oruga-slider-tick-background, #445e00);
2415
- border-radius: var(--oruga-slider-tick-radius, 4px);
2416
- }
2417
- .o-slide__tick--hidden {
2418
- background: transparent;
2419
- }
2420
- .o-slide__thumb-wrapper {
2421
- display: inline-flex;
2422
- align-items: center;
2423
- position: absolute;
2424
- cursor: grab;
2425
- transform: translate(-50%, -50%);
2426
- top: 50%;
2427
- flex-direction: column;
2428
- }
2429
- .o-slide--disabled {
2430
- cursor: not-allowed;
2431
- pointer-events: none;
2432
- opacity: var(--oruga-slider-track-disabled, 0.5);
2433
- }
2434
-
2435
- /* @docs */
2436
- /* @docs */
2437
- .o-steps {
2438
- display: flex;
2439
- flex-wrap: wrap;
2440
- margin: 0;
2441
- padding: 0;
2442
- font-size: var(--oruga-steps-size, 1rem);
2443
- min-height: calc(var(--oruga-steps-size, 1rem) * 2);
2444
- }
2445
- .o-steps .o-steps__divider {
2446
- height: var(--oruga-steps-divider-height, 0.2em);
2447
- top: var(--oruga-steps-size, 1rem);
2448
- }
2449
- .o-steps .o-steps__marker {
2450
- height: calc(var(--oruga-steps-size, 1rem) * 2);
2451
- width: calc(var(--oruga-steps-size, 1rem) * 2);
2452
- }
2453
- .o-steps .o-steps__title {
2454
- background-color: var(--oruga-steps-details-background-color, hsl(0, 0%, 100%));
2455
- text-align: center;
2456
- z-index: 1;
2457
- padding: var(--oruga-steps-details-padding, 0.2em);
2458
- font-size: calc(var(--oruga-steps-size, 1rem) * 1.2);
2459
- height: var(--oruga-steps-details-title-font-weight, 600);
2460
- line-height: var(--oruga-steps-size, 1rem);
2461
- }
2462
- .o-steps .o-steps__wrapper-vertical .o-steps--label-right .o-steps__divider {
2463
- left: calc((var(--oruga-steps-size, 1rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2464
- }
2465
- .o-steps .o-steps__wrapper-vertical .o-steps--label-left .o-steps__divider {
2466
- left: auto;
2467
- right: calc((var(--oruga-steps-size, 1rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2468
- }
2469
- .o-steps .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-right .o-steps__divider {
2470
- left: calc((var(--oruga-steps-size, 1rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2471
- }
2472
- .o-steps .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-left .o-steps__divider {
2473
- left: auto;
2474
- right: calc((var(--oruga-steps-size, 1rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2475
- }
2476
- .o-steps--small {
2477
- font-size: var(--oruga-size-small, 0.75rem);
2478
- min-height: calc(var(--oruga-size-small, 0.75rem) * 2);
2479
- }
2480
- .o-steps--small .o-steps__divider {
2481
- height: var(--oruga-steps-divider-height, 0.2em);
2482
- top: var(--oruga-size-small, 0.75rem);
2483
- }
2484
- .o-steps--small .o-steps__marker {
2485
- height: calc(var(--oruga-size-small, 0.75rem) * 2);
2486
- width: calc(var(--oruga-size-small, 0.75rem) * 2);
2487
- }
2488
- .o-steps--small .o-steps__title {
2489
- background-color: var(--oruga-steps-details-background-color, hsl(0, 0%, 100%));
2490
- text-align: center;
2491
- z-index: 1;
2492
- padding: var(--oruga-steps-details-padding, 0.2em);
2493
- font-size: calc(var(--oruga-size-small, 0.75rem) * 1.2);
2494
- height: var(--oruga-steps-details-title-font-weight, 600);
2495
- line-height: var(--oruga-size-small, 0.75rem);
2496
- }
2497
- .o-steps--small .o-steps__wrapper-vertical .o-steps--label-right .o-steps__divider {
2498
- left: calc((var(--oruga-size-small, 0.75rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2499
- }
2500
- .o-steps--small .o-steps__wrapper-vertical .o-steps--label-left .o-steps__divider {
2501
- left: auto;
2502
- right: calc((var(--oruga-size-small, 0.75rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2503
- }
2504
- .o-steps--small .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-right .o-steps__divider {
2505
- left: calc((var(--oruga-size-small, 0.75rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2506
- }
2507
- .o-steps--small .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-left .o-steps__divider {
2508
- left: auto;
2509
- right: calc((var(--oruga-size-small, 0.75rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2510
- }
2511
- .o-steps--medium {
2512
- font-size: var(--oruga-size-medium, 1.25rem);
2513
- min-height: calc(var(--oruga-size-medium, 1.25rem) * 2);
2514
- }
2515
- .o-steps--medium .o-steps__divider {
2516
- height: var(--oruga-steps-divider-height, 0.2em);
2517
- top: var(--oruga-size-medium, 1.25rem);
2518
- }
2519
- .o-steps--medium .o-steps__marker {
2520
- height: calc(var(--oruga-size-medium, 1.25rem) * 2);
2521
- width: calc(var(--oruga-size-medium, 1.25rem) * 2);
2522
- }
2523
- .o-steps--medium .o-steps__title {
2524
- background-color: var(--oruga-steps-details-background-color, hsl(0, 0%, 100%));
2525
- text-align: center;
2526
- z-index: 1;
2527
- padding: var(--oruga-steps-details-padding, 0.2em);
2528
- font-size: calc(var(--oruga-size-medium, 1.25rem) * 1.2);
2529
- height: var(--oruga-steps-details-title-font-weight, 600);
2530
- line-height: var(--oruga-size-medium, 1.25rem);
2531
- }
2532
- .o-steps--medium .o-steps__wrapper-vertical .o-steps--label-right .o-steps__divider {
2533
- left: calc((var(--oruga-size-medium, 1.25rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2534
- }
2535
- .o-steps--medium .o-steps__wrapper-vertical .o-steps--label-left .o-steps__divider {
2536
- left: auto;
2537
- right: calc((var(--oruga-size-medium, 1.25rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2538
- }
2539
- .o-steps--medium .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-right .o-steps__divider {
2540
- left: calc((var(--oruga-size-medium, 1.25rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2541
- }
2542
- .o-steps--medium .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-left .o-steps__divider {
2543
- left: auto;
2544
- right: calc((var(--oruga-size-medium, 1.25rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2545
- }
2546
- .o-steps--large {
2547
- font-size: var(--oruga-size-large, 1.5rem);
2548
- min-height: calc(var(--oruga-size-large, 1.5rem) * 2);
2549
- }
2550
- .o-steps--large .o-steps__divider {
2551
- height: var(--oruga-steps-divider-height, 0.2em);
2552
- top: var(--oruga-size-large, 1.5rem);
2553
- }
2554
- .o-steps--large .o-steps__marker {
2555
- height: calc(var(--oruga-size-large, 1.5rem) * 2);
2556
- width: calc(var(--oruga-size-large, 1.5rem) * 2);
2557
- }
2558
- .o-steps--large .o-steps__title {
2559
- background-color: var(--oruga-steps-details-background-color, hsl(0, 0%, 100%));
2560
- text-align: center;
2561
- z-index: 1;
2562
- padding: var(--oruga-steps-details-padding, 0.2em);
2563
- font-size: calc(var(--oruga-size-large, 1.5rem) * 1.2);
2564
- height: var(--oruga-steps-details-title-font-weight, 600);
2565
- line-height: var(--oruga-size-large, 1.5rem);
2566
- }
2567
- .o-steps--large .o-steps__wrapper-vertical .o-steps--label-right .o-steps__divider {
2568
- left: calc((var(--oruga-size-large, 1.5rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2569
- }
2570
- .o-steps--large .o-steps__wrapper-vertical .o-steps--label-left .o-steps__divider {
2571
- left: auto;
2572
- right: calc((var(--oruga-size-large, 1.5rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2573
- }
2574
- .o-steps--large .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-right .o-steps__divider {
2575
- left: calc((var(--oruga-size-large, 1.5rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2576
- }
2577
- .o-steps--large .o-steps__wrapper-vertical.o-steps__wrapper-position-right .o-steps--label-left .o-steps__divider {
2578
- left: auto;
2579
- right: calc((var(--oruga-size-large, 1.5rem) - var(--oruga-steps-divider-height, 0.2em)) * 0.5);
2580
- }
2581
- .o-steps__nav-item {
2582
- margin: 0;
2583
- padding: 0;
2584
- line-height: var(--oruga-steps-item-line-height, 1.5);
2585
- margin-top: 0;
2586
- position: relative;
2587
- flex-grow: 1;
2588
- flex-basis: 1em;
2589
- }
2590
- .o-steps__nav-item--primary.o-steps__nav-item-active .o-steps__marker {
2591
- background-color: var(--oruga-variant-invert-primary, #ffffff);
2592
- border-color: var(--oruga-variant-primary, #445e00);
2593
- color: var(--oruga-variant-primary, #445e00);
2594
- }
2595
- .o-steps__nav-item--primary.o-steps__nav-item-active .o-steps__divider {
2596
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-primary, #dbdbdb) 50%, var(--oruga-steps-divider-color-primary, #445e00) 50%);
2597
- background-size: 200% 100%;
2598
- }
2599
- .o-steps__nav-item--primary.o-steps__nav-item-previous .o-steps__marker {
2600
- color: var(--oruga-variant-invert-primary, #ffffff);
2601
- background-color: var(--oruga-variant-primary, #445e00);
2602
- }
2603
- .o-steps__nav-item--primary.o-steps__nav-item-previous .o-steps__divider {
2604
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-primary, #dbdbdb) 50%, var(--oruga-steps-divider-color-primary, #445e00) 50%);
2605
- background-size: 200% 100%;
2606
- }
2607
- .o-steps__nav-item--secondary.o-steps__nav-item-active .o-steps__marker {
2608
- background-color: var(--oruga-variant-invert-secondary, #ffffff);
2609
- border-color: var(--oruga-variant-secondary, #6c757d);
2610
- color: var(--oruga-variant-secondary, #6c757d);
2611
- }
2612
- .o-steps__nav-item--secondary.o-steps__nav-item-active .o-steps__divider {
2613
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-secondary, #dbdbdb) 50%, var(--oruga-steps-divider-color-secondary, #6c757d) 50%);
2614
- background-size: 200% 100%;
2615
- }
2616
- .o-steps__nav-item--secondary.o-steps__nav-item-previous .o-steps__marker {
2617
- color: var(--oruga-variant-invert-secondary, #ffffff);
2618
- background-color: var(--oruga-variant-secondary, #6c757d);
2619
- }
2620
- .o-steps__nav-item--secondary.o-steps__nav-item-previous .o-steps__divider {
2621
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-secondary, #dbdbdb) 50%, var(--oruga-steps-divider-color-secondary, #6c757d) 50%);
2622
- background-size: 200% 100%;
2623
- }
2624
- .o-steps__nav-item--success.o-steps__nav-item-active .o-steps__marker {
2625
- background-color: var(--oruga-variant-invert-success, #ffffff);
2626
- border-color: var(--oruga-variant-success, #006724);
2627
- color: var(--oruga-variant-success, #006724);
2628
- }
2629
- .o-steps__nav-item--success.o-steps__nav-item-active .o-steps__divider {
2630
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-success, #dbdbdb) 50%, var(--oruga-steps-divider-color-success, #006724) 50%);
2631
- background-size: 200% 100%;
2632
- }
2633
- .o-steps__nav-item--success.o-steps__nav-item-previous .o-steps__marker {
2634
- color: var(--oruga-variant-invert-success, #ffffff);
2635
- background-color: var(--oruga-variant-success, #006724);
2636
- }
2637
- .o-steps__nav-item--success.o-steps__nav-item-previous .o-steps__divider {
2638
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-success, #dbdbdb) 50%, var(--oruga-steps-divider-color-success, #006724) 50%);
2639
- background-size: 200% 100%;
2640
- }
2641
- .o-steps__nav-item--info.o-steps__nav-item-active .o-steps__marker {
2642
- background-color: var(--oruga-variant-invert-info, #ffffff);
2643
- border-color: var(--oruga-variant-info, #005c98);
2644
- color: var(--oruga-variant-info, #005c98);
2645
- }
2646
- .o-steps__nav-item--info.o-steps__nav-item-active .o-steps__divider {
2647
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-info, #dbdbdb) 50%, var(--oruga-steps-divider-color-info, #005c98) 50%);
2648
- background-size: 200% 100%;
2649
- }
2650
- .o-steps__nav-item--info.o-steps__nav-item-previous .o-steps__marker {
2651
- color: var(--oruga-variant-invert-info, #ffffff);
2652
- background-color: var(--oruga-variant-info, #005c98);
2653
- }
2654
- .o-steps__nav-item--info.o-steps__nav-item-previous .o-steps__divider {
2655
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-info, #dbdbdb) 50%, var(--oruga-steps-divider-color-info, #005c98) 50%);
2656
- background-size: 200% 100%;
2657
- }
2658
- .o-steps__nav-item--warning.o-steps__nav-item-active .o-steps__marker {
2659
- background-color: var(--oruga-variant-invert-warning, #000000);
2660
- border-color: var(--oruga-variant-warning, #f4c300);
2661
- color: var(--oruga-variant-warning, #f4c300);
2662
- }
2663
- .o-steps__nav-item--warning.o-steps__nav-item-active .o-steps__divider {
2664
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-warning, #dbdbdb) 50%, var(--oruga-steps-divider-color-warning, #f4c300) 50%);
2665
- background-size: 200% 100%;
2666
- }
2667
- .o-steps__nav-item--warning.o-steps__nav-item-previous .o-steps__marker {
2668
- color: var(--oruga-variant-invert-warning, #000000);
2669
- background-color: var(--oruga-variant-warning, #f4c300);
2670
- }
2671
- .o-steps__nav-item--warning.o-steps__nav-item-previous .o-steps__divider {
2672
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-warning, #dbdbdb) 50%, var(--oruga-steps-divider-color-warning, #f4c300) 50%);
2673
- background-size: 200% 100%;
2674
- }
2675
- .o-steps__nav-item--danger.o-steps__nav-item-active .o-steps__marker {
2676
- background-color: var(--oruga-variant-invert-danger, #ffffff);
2677
- border-color: var(--oruga-variant-danger, #b60000);
2678
- color: var(--oruga-variant-danger, #b60000);
2679
- }
2680
- .o-steps__nav-item--danger.o-steps__nav-item-active .o-steps__divider {
2681
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-danger, #dbdbdb) 50%, var(--oruga-steps-divider-color-danger, #b60000) 50%);
2682
- background-size: 200% 100%;
2683
- }
2684
- .o-steps__nav-item--danger.o-steps__nav-item-previous .o-steps__marker {
2685
- color: var(--oruga-variant-invert-danger, #ffffff);
2686
- background-color: var(--oruga-variant-danger, #b60000);
2687
- }
2688
- .o-steps__nav-item--danger.o-steps__nav-item-previous .o-steps__divider {
2689
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-danger, #dbdbdb) 50%, var(--oruga-steps-divider-color-danger, #b60000) 50%);
2690
- background-size: 200% 100%;
2691
- }
2692
- .o-steps__divider {
2693
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg, #dbdbdb) 50%, var(--oruga-steps-divider-color, #445e00) 50%);
2694
- background-size: 200% 100%;
2695
- background-position: right bottom;
2696
- content: " ";
2697
- display: block;
2698
- position: absolute;
2699
- bottom: 0;
2700
- left: -50%;
2701
- width: 100%;
2702
- }
2703
- .o-steps__content {
2704
- position: relative;
2705
- overflow: visible;
2706
- display: flex;
2707
- flex-direction: column;
2708
- padding: var(--oruga-steps-content-padding, 1rem);
2709
- }
2710
- .o-steps__content-transitioning {
2711
- overflow: hidden;
2712
- }
2713
- .o-steps--animated .o-steps__divider {
2714
- transition-property: background;
2715
- transition-duration: var(--oruga-transition-duration, 150ms);
2716
- transition-timing-function: var(--oruga-transition-timing, ease-out);
2717
- }
2718
- .o-steps__link {
2719
- display: flex;
2720
- align-items: center;
2721
- justify-content: center;
2722
- flex-direction: column;
2723
- color: var(--oruga-steps-link-color, hsl(0, 0%, 29%));
2724
- cursor: pointer;
2725
- text-decoration: none;
2726
- }
2727
- .o-steps__link-label-right {
2728
- flex-direction: row;
2729
- }
2730
- .o-steps__link-label-left {
2731
- flex-direction: row-reverse;
2732
- }
2733
- .o-steps__link:hover {
2734
- text-decoration: none;
2735
- }
2736
- .o-steps__link:not(.o-steps__link-clickable) {
2737
- cursor: not-allowed;
2738
- }
2739
- .o-steps__marker {
2740
- align-items: center;
2741
- display: flex;
2742
- justify-content: center;
2743
- font-weight: var(--oruga-steps-marker-font-weight, 700);
2744
- background: var(--oruga-steps-marker-background, #b5b5b5);
2745
- color: var(--oruga-steps-marker-color, #ffffff);
2746
- border: var(--oruga-steps-marker-border, 0.2em solid #fff);
2747
- z-index: 1;
2748
- overflow: hidden;
2749
- }
2750
- .o-steps__marker--rounded {
2751
- border-radius: var(--oruga-steps-marker-rounded-border-radius, 9999px);
2752
- }
2753
- .o-steps__details {
2754
- background-color: var(--oruga-steps-details-background-color, hsl(0, 0%, 100%));
2755
- text-align: center;
2756
- z-index: 1;
2757
- padding: var(--oruga-steps-details-padding, 0.2em);
2758
- }
2759
- .o-steps__nav-item-active .o-steps__link {
2760
- cursor: default;
2761
- }
2762
- .o-steps__nav-item-active .o-steps__marker {
2763
- background-color: var(--oruga-steps-marker-color, #ffffff);
2764
- border-color: var(--oruga-steps-active-color, #445e00);
2765
- color: var(--oruga-steps-active-color, #445e00);
2766
- }
2767
- .o-steps__nav-item-active .o-steps__divider {
2768
- background-position: left bottom;
2769
- }
2770
- .o-steps__nav-item-previous .o-steps__marker {
2771
- color: var(--oruga-steps-marker-color, #ffffff);
2772
- background-color: var(--oruga-steps-previous-color, #445e00);
2773
- }
2774
- .o-steps__nav-item-previous .o-steps__divider {
2775
- background-position: left bottom;
2776
- }
2777
- .o-steps__item {
2778
- flex-shrink: 0;
2779
- flex-basis: auto;
2780
- }
2781
- .o-steps__wrapper-vertical {
2782
- display: flex;
2783
- flex-direction: row;
2784
- flex-wrap: wrap;
2785
- }
2786
- .o-steps__wrapper-vertical .o-steps {
2787
- height: 100%;
2788
- flex-direction: column;
2789
- }
2790
- .o-steps__wrapper-vertical .o-steps__divider {
2791
- height: 100%;
2792
- width: var(--oruga-steps-divider-height, 0.2em);
2793
- top: -50%;
2794
- left: calc(50% - 0.1em);
2795
- }
2796
- .o-steps__wrapper-vertical .o-steps__item-active .o-steps__divider,
2797
- .o-steps__wrapper-vertical .o-steps__item-previous .o-steps__divider {
2798
- background-position: right top;
2799
- }
2800
- .o-steps__wrapper-vertical .o-steps__nav-item {
2801
- width: 100%;
2802
- display: flex;
2803
- align-items: center;
2804
- justify-content: center;
2805
- padding: var(--oruga-steps-vertical-padding, 1em 0);
2806
- }
2807
- .o-steps__wrapper-vertical .o-steps__nav-item--primary .o-steps__divider {
2808
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-primary, #dbdbdb) 50%, var(--oruga-steps-divider-color-primary, #445e00) 50%);
2809
- background-size: 100% 200%;
2810
- background-position: left bottom;
2811
- }
2812
- .o-steps__wrapper-vertical .o-steps__nav-item--secondary .o-steps__divider {
2813
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-secondary, #dbdbdb) 50%, var(--oruga-steps-divider-color-secondary, #6c757d) 50%);
2814
- background-size: 100% 200%;
2815
- background-position: left bottom;
2816
- }
2817
- .o-steps__wrapper-vertical .o-steps__nav-item--success .o-steps__divider {
2818
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-success, #dbdbdb) 50%, var(--oruga-steps-divider-color-success, #006724) 50%);
2819
- background-size: 100% 200%;
2820
- background-position: left bottom;
2821
- }
2822
- .o-steps__wrapper-vertical .o-steps__nav-item--info .o-steps__divider {
2823
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-info, #dbdbdb) 50%, var(--oruga-steps-divider-color-info, #005c98) 50%);
2824
- background-size: 100% 200%;
2825
- background-position: left bottom;
2826
- }
2827
- .o-steps__wrapper-vertical .o-steps__nav-item--warning .o-steps__divider {
2828
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-warning, #dbdbdb) 50%, var(--oruga-steps-divider-color-warning, #f4c300) 50%);
2829
- background-size: 100% 200%;
2830
- background-position: left bottom;
2831
- }
2832
- .o-steps__wrapper-vertical .o-steps__nav-item--danger .o-steps__divider {
2833
- background: linear-gradient(to left, var(--oruga-steps-divider-color-bg-danger, #dbdbdb) 50%, var(--oruga-steps-divider-color-danger, #b60000) 50%);
2834
- background-size: 100% 200%;
2835
- background-position: left bottom;
2836
- }
2837
- .o-steps__wrapper-vertical .o-steps__content {
2838
- flex-grow: 1;
2839
- flex-basis: 70%;
2840
- }
2841
- .o-steps__wrapper-vertical .o-steps__navigation {
2842
- flex-basis: 100%;
2843
- }
2844
- .o-steps__wrapper-vertical.o-steps__wrapper-position-right {
2845
- flex-direction: row-reverse;
2846
- }
2847
- .o-steps--mobile .o-steps__title {
2848
- display: none;
2849
- padding: 0;
2850
- }
2851
- .o-steps--mobile .o-steps__divider {
2852
- height: var(--oruga-steps-divider-height, 0.2em);
2853
- top: var(--oruga-steps-divider-top, 1rem);
2854
- }
2855
- .o-steps--mobile .o-steps__divider .o-steps--small {
2856
- top: var(--oruga-size-small, 0.75rem);
2857
- }
2858
- .o-steps--mobile .o-steps__divider .o-steps--medium {
2859
- top: var(--oruga-size-medium, 1.25rem);
2860
- }
2861
- .o-steps--mobile .o-steps__divider .o-steps--large {
2862
- top: var(--oruga-size-large, 1.5rem);
2863
- }
2864
-
2865
- /* @docs */
2866
- /* @docs */
2867
- .o-switch {
2868
- cursor: pointer;
2869
- display: inline-flex;
2870
- align-items: center;
2871
- position: relative;
2872
- -webkit-touch-callout: none;
2873
- -webkit-user-select: none;
2874
- -moz-user-select: none;
2875
- -ms-user-select: none;
2876
- user-select: none;
2877
- }
2878
- .o-switch--primary .o-switch__check--checked {
2879
- background: var(--oruga-variant-primary, #445e00);
2880
- }
2881
- .o-switch--primary-passive .o-switch__check:not(.o-switch__check--checked) {
2882
- background: var(--oruga-variant-primary, #445e00);
2883
- }
2884
- .o-switch--secondary .o-switch__check--checked {
2885
- background: var(--oruga-variant-secondary, #6c757d);
2886
- }
2887
- .o-switch--secondary-passive .o-switch__check:not(.o-switch__check--checked) {
2888
- background: var(--oruga-variant-secondary, #6c757d);
2889
- }
2890
- .o-switch--success .o-switch__check--checked {
2891
- background: var(--oruga-variant-success, #006724);
2892
- }
2893
- .o-switch--success-passive .o-switch__check:not(.o-switch__check--checked) {
2894
- background: var(--oruga-variant-success, #006724);
2895
- }
2896
- .o-switch--info .o-switch__check--checked {
2897
- background: var(--oruga-variant-info, #005c98);
2898
- }
2899
- .o-switch--info-passive .o-switch__check:not(.o-switch__check--checked) {
2900
- background: var(--oruga-variant-info, #005c98);
2901
- }
2902
- .o-switch--warning .o-switch__check--checked {
2903
- background: var(--oruga-variant-warning, #f4c300);
2904
- }
2905
- .o-switch--warning-passive .o-switch__check:not(.o-switch__check--checked) {
2906
- background: var(--oruga-variant-warning, #f4c300);
2907
- }
2908
- .o-switch--danger .o-switch__check--checked {
2909
- background: var(--oruga-variant-danger, #b60000);
2910
- }
2911
- .o-switch--danger-passive .o-switch__check:not(.o-switch__check--checked) {
2912
- background: var(--oruga-variant-danger, #b60000);
2913
- }
2914
- .o-switch--small {
2915
- font-size: var(--oruga-font-size-name, 0.75rem);
2916
- }
2917
- .o-switch--medium {
2918
- font-size: var(--oruga-font-size-name, 1.25rem);
2919
- }
2920
- .o-switch--large {
2921
- font-size: var(--oruga-font-size-name, 1.5rem);
2922
- }
2923
- .o-switch__label {
2924
- margin-left: var(--oruga-switch-margin-label, 0.5em);
2925
- }
2926
- .o-switch--left {
2927
- flex-direction: row-reverse;
2928
- }
2929
- .o-switch--left .o-switch__label {
2930
- margin-left: 0;
2931
- margin-right: var(--oruga-switch-margin-label, 0.5em);
2932
- }
2933
- .o-switch__check-switch {
2934
- content: "";
2935
- display: block;
2936
- height: calc((var(--oruga-switch-width, 2.75em) - var(--oruga-switch-padding, 0.2em) * 2) * 0.5);
2937
- width: calc((var(--oruga-switch-width, 2.75em) - var(--oruga-switch-padding, 0.2em) * 2) * 0.5);
2938
- background: var(--oruga-switch-action-background, #f5f5f5);
2939
- box-shadow: var(--oruga-switch-box-shadow, 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05));
2940
- transition-property: transform;
2941
- transition-duration: var(--oruga-transition-duration, 150ms);
2942
- transition-timing-function: var(--oruga-transition-timing, ease-out);
2943
- will-change: transform;
2944
- transform-origin: left;
2945
- }
2946
- .o-switch__check {
2947
- display: flex;
2948
- align-items: center;
2949
- flex-shrink: 0;
2950
- width: var(--oruga-switch-width, 2.75em);
2951
- height: calc(var(--oruga-switch-width, 2.75em) * 0.5 + var(--oruga-switch-padding, 0.2em));
2952
- padding: var(--oruga-switch-padding, 0.2em);
2953
- background: var(--oruga-switch-background, #b5b5b5);
2954
- border-radius: var(--oruga-switch-border-radius, 4px);
2955
- transition-property: background;
2956
- transition-duration: var(--oruga-transition-duration, 150ms);
2957
- transition-timing-function: var(--oruga-transition-timing, ease-out);
2958
- }
2959
- .o-switch__check--checked {
2960
- background: var(--oruga-switch-active-background-color, #445e00);
2961
- }
2962
- .o-switch__check--checked .o-switch__check-switch {
2963
- transform: translate3d(100%, 0, 0);
2964
- }
2965
- .o-switch__input {
2966
- position: absolute;
2967
- left: 0;
2968
- opacity: 0;
2969
- z-index: -1;
2970
- }
2971
- .o-switch--rounded {
2972
- border-radius: var(--oruga-switch-rounded-border-radius, 9999px);
2973
- }
2974
- .o-switch--disabled {
2975
- opacity: var(--oruga-switch-disabled-opacity, 0.5);
2976
- }
2977
-
2978
- /* @docs */
2979
- /* @docs */
2980
- .o-table {
2981
- display: table;
2982
- width: 100%;
2983
- border-collapse: separate;
2984
- border-spacing: 0;
2985
- border: var(--oruga-table-boder, 1px solid transparent);
2986
- border-radius: var(--oruga-table-border-radius, 4px);
2987
- background-color: var(--oruga-table-background-color, #fff);
2988
- color: var(--oruga-table-color, black);
2989
- }
2990
- .o-table__root {
2991
- position: relative;
2992
- }
2993
- .o-table__wrapper {
2994
- transition: opacity 300ms ease-out;
2995
- position: relative;
2996
- }
2997
- .o-table__wrapper--sticky-header {
2998
- height: var(--oruga-table-sticky-header-height, 300px);
2999
- overflow-y: auto;
3000
- }
3001
- .o-table__wrapper--sticky-header th {
3002
- position: -webkit-sticky;
3003
- position: sticky;
3004
- left: 0;
3005
- top: 0;
3006
- background: var(--oruga-table-background-color, #fff);
3007
- }
3008
- .o-table__wrapper--scrollable {
3009
- -webkit-overflow-scrolling: touch;
3010
- overflow-x: auto;
3011
- max-width: 100%;
3012
- }
3013
- .o-table__wrapper--mobile {
3014
- overflow-x: auto;
3015
- }
3016
- .o-table__wrapper--mobile .o-table__mobile-sort {
3017
- display: block;
3018
- }
3019
- .o-table__wrapper--mobile .o-table {
3020
- background-color: transparent;
3021
- }
3022
- .o-table__wrapper--mobile thead tr {
3023
- box-shadow: none;
3024
- border-width: 0;
3025
- }
3026
- .o-table__wrapper--mobile thead tr th {
3027
- display: none;
3028
- }
3029
- .o-table__wrapper--mobile thead tr .o-table-th-checkbox {
3030
- display: block;
3031
- width: 100%;
3032
- text-align: right;
3033
- border: 0;
3034
- }
3035
- .o-table__wrapper--mobile tfoot th {
3036
- border: 0;
3037
- display: inherit;
3038
- }
3039
- .o-table__wrapper--mobile tr {
3040
- box-shadow: var(--oruga-table-card-box-shadow, 0 2px 3px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.1));
3041
- max-width: 100%;
3042
- position: relative;
3043
- display: block;
3044
- }
3045
- .o-table__wrapper--mobile tr td {
3046
- border: 0;
3047
- display: inherit;
3048
- }
3049
- .o-table__wrapper--mobile tr td:last-child {
3050
- border-bottom: 0;
3051
- }
3052
- .o-table__wrapper--mobile tr:not(:last-child) {
3053
- margin: var(--oruga-table-card-margin, 0 0 1rem 0);
3054
- }
3055
- .o-table__wrapper--mobile tr:not(.o-table__tr--selected) {
3056
- background: inherit;
3057
- background: #fff;
3058
- }
3059
- .o-table__wrapper--mobile tr:not(.o-table__tr--selected):hover {
3060
- background-color: inherit;
3061
- background-color: #fff;
3062
- }
3063
- .o-table__wrapper--mobile tr.o-table--detailed {
3064
- margin: var(--oruga-table-card-detail-margin, -1rem 0 0 0);
3065
- }
3066
- .o-table__wrapper--mobile tr:not(.o-table--detailed):not(.o-table--empty):not(.o-table__footer) td {
3067
- display: flex;
3068
- width: auto;
3069
- justify-content: space-between;
3070
- text-align: right;
3071
- border-bottom: var(--oruga-table-background, #f5f5f5 1px solid);
3072
- }
3073
- .o-table__wrapper--mobile tr:not(.o-table--detailed):not(.o-table--empty):not(.o-table__footer) td:before {
3074
- content: attr(data-label);
3075
- font-weight: var(--oruga-table-card-cell-font-weight, 600);
3076
- padding-right: var(--oruga-table-card-cell-padding, 0 0.5em 0 0);
3077
- text-align: var(--oruga-table-card-cell-text-align, left);
3078
- }
3079
- .o-table__mobile-sort {
3080
- display: none;
3081
- }
3082
- .o-table__th {
3083
- vertical-align: top;
3084
- text-align: left;
3085
- position: relative;
3086
- font-weight: var(--oruga-table-th-font-weight, 600);
3087
- color: var(--oruga-table-th-color, #363636);
3088
- border-bottom: var(--oruga-table-th-border, 2px solid #dbdbdb);
3089
- padding: var(--oruga-table-th-padding, 0.5em 0.75em);
3090
- }
3091
- .o-table__th--centered {
3092
- text-align: center;
3093
- }
3094
- .o-table__th--right {
3095
- text-align: right;
3096
- }
3097
- .o-table__th__sort-icon {
3098
- position: absolute;
3099
- right: 0;
3100
- }
3101
- .o-table__th-checkbox {
3102
- width: var(--oruga-table-th-checkbox-width, 40px);
3103
- }
3104
- .o-table__th-current-sort {
3105
- border-color: var(--oruga-table-current-sort-border-color, #7a7a7a);
3106
- font-weight: var(--oruga-table-current-sort-font-weight, 700);
3107
- }
3108
- .o-table__th--sortable {
3109
- cursor: pointer;
3110
- }
3111
- .o-table__th--sortable:hover {
3112
- border-color: var(--oruga-table-current-sort-hover-border-color, #7a7a7a);
3113
- }
3114
- .o-table__th--sticky {
3115
- position: -webkit-sticky;
3116
- position: sticky;
3117
- left: 0;
3118
- top: 0;
3119
- z-index: calc(var(--oruga-table-sticky-zindex, 1) + 2);
3120
- background: var(--oruga-table-background-color, #fff);
3121
- }
3122
- .o-table__th--unselectable {
3123
- -webkit-touch-callout: none;
3124
- -webkit-user-select: none;
3125
- -moz-user-select: none;
3126
- -ms-user-select: none;
3127
- user-select: none;
3128
- }
3129
- .o-table__th--detailed {
3130
- width: var(--oruga-table-th-detail-width, 14px);
3131
- }
3132
- .o-table__td {
3133
- vertical-align: top;
3134
- text-align: left;
3135
- border-bottom: var(--oruga-table-td-border, 1px solid #dbdbdb);
3136
- padding: var(--oruga-table-td-padding, 0.5em 0.75em);
3137
- }
3138
- .o-table__td--sticky {
3139
- position: -webkit-sticky;
3140
- position: sticky;
3141
- left: 0;
3142
- z-index: var(--oruga-table-sticky-zindex, 1);
3143
- background: var(--oruga-table-background-color, #fff);
3144
- }
3145
- .o-table__td--right {
3146
- text-align: right;
3147
- }
3148
- .o-table__td--centered {
3149
- text-align: center;
3150
- }
3151
- .o-table__td-chevron {
3152
- vertical-align: middle;
3153
- width: var(--oruga-table-detail-chevron-width, 40px);
3154
- color: var(--oruga-table-detail-chevron-color, #445e00);
3155
- }
3156
- .o-table:focus {
3157
- border-color: var(--oruga-table-focus-border-color, #445e00);
3158
- box-shadow: var(--oruga-table-focus-box-shadow, 0 0 0 0.125em rgba(68, 94, 0, 0.25));
3159
- }
3160
- .o-table--bordered tr:last-child td,
3161
- .o-table--bordered tr:last-child th {
3162
- border: var(--oruga-table-td-border, 1px solid #dbdbdb);
3163
- }
3164
- .o-table--bordered td,
3165
- .o-table--bordered th {
3166
- border: var(--oruga-table-td-border, 1px solid #dbdbdb);
3167
- }
3168
- .o-table--striped tbody tr:not(.o-table__tr--selected):nth-child(2n) {
3169
- background-color: var(--oruga-table-striped-background-color, #fafafa);
3170
- }
3171
- .o-table--narrowed td,
3172
- .o-table--narrowed th {
3173
- padding: var(--oruga-table-narrow-padding, 0.25em 0.5em);
3174
- }
3175
- .o-table--hoverable tbody tr:not(.o-table__tr--selected):hover {
3176
- background-color: var(--oruga-table-hoverable-background-color, #fafafa);
3177
- }
3178
- .o-table__detail {
3179
- box-shadow: var(--oruga-table-detail-box-shadow, inset 0 1px 3px #7a7a7a);
3180
- background: var(--oruga-table-detail-background, #fafafa);
3181
- }
3182
- .o-table__detail td {
3183
- padding: var(--oruga-table-detail-padding, 1rem);
3184
- }
3185
- .o-table__tr--selected {
3186
- background-color: #445e00;
3187
- color: #ffffff;
3188
- }
3189
- .o-table__tr--selected-primary {
3190
- background-color: #445e00;
3191
- color: #ffffff;
3192
- }
3193
- .o-table__tr--selected-secondary {
3194
- background-color: #6c757d;
3195
- color: #ffffff;
3196
- }
3197
- .o-table__tr--selected-success {
3198
- background-color: #006724;
3199
- color: #ffffff;
3200
- }
3201
- .o-table__tr--selected-info {
3202
- background-color: #005c98;
3203
- color: #ffffff;
3204
- }
3205
- .o-table__tr--selected-warning {
3206
- background-color: #f4c300;
3207
- color: #000000;
3208
- }
3209
- .o-table__tr--selected-danger {
3210
- background-color: #b60000;
3211
- color: #ffffff;
3212
- }
3213
- .o-table__pagination {
3214
- align-items: center;
3215
- justify-content: space-between;
3216
- display: flex;
3217
- }
3218
- .o-table__pagination > div {
3219
- flex-basis: auto;
3220
- flex-grow: 0;
3221
- flex-shrink: 0;
3222
- }
3223
- .o-table__pagination > div:first-child {
3224
- align-items: center;
3225
- justify-content: flex-start;
3226
- }
3227
- .o-table__pagination > div:last-child {
3228
- align-items: center;
3229
- justify-content: flex-end;
3230
- }
3231
- .o-table__pagination > div:last-child > div {
3232
- align-items: center;
3233
- display: flex;
3234
- flex-basis: auto;
3235
- flex-grow: 0;
3236
- flex-shrink: 0;
3237
- justify-content: center;
3238
- }
3239
-
3240
- /* @docs */
3241
- /* @docs */
3242
- .o-tabs--fullwidth {
3243
- width: 100%;
3244
- }
3245
- .o-tabs--fullwidth .o-tabs__nav-item-wrapper {
3246
- flex-grow: 1;
3247
- flex-shrink: 0;
3248
- }
3249
- .o-tabs--fullwidth .o-tabs__nav-item-default,
3250
- .o-tabs--fullwidth .o-tabs__nav-item-boxed,
3251
- .o-tabs--fullwidth .o-tabs__nav-item-toggle {
3252
- height: 100%;
3253
- }
3254
- .o-tabs--vertical {
3255
- display: flex;
3256
- flex-direction: row;
3257
- }
3258
- .o-tabs--vertical .o-tabs__nav {
3259
- flex-direction: column;
3260
- align-items: stretch;
3261
- flex-grow: 0;
3262
- border-bottom: none;
3263
- }
3264
- .o-tabs--vertical .o-tabs__nav-item-boxed {
3265
- border-bottom-color: transparent;
3266
- border-right-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3267
- border-radius: var(--oruga-tabs-border-bottom-color, 4px 0 0 4px);
3268
- }
3269
- .o-tabs--vertical .o-tabs__nav-item-boxed--active {
3270
- border-bottom-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3271
- border-right-color: transparent;
3272
- }
3273
- .o-tabs--right {
3274
- flex-direction: row-reverse;
3275
- }
3276
- .o-tabs--right .o-tabs__nav-item-boxed {
3277
- border-bottom-color: transparent;
3278
- border-right-color: transparent;
3279
- border-left-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3280
- border-radius: var(--oruga-tabs-border-bottom-color, 0 4px 4px 0);
3281
- }
3282
- .o-tabs--right .o-tabs__nav-item-boxed--active {
3283
- border-bottom-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3284
- border-right-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3285
- border-left-color: transparent;
3286
- }
3287
- .o-tabs__nav {
3288
- -webkit-touch-callout: none;
3289
- -webkit-user-select: none;
3290
- -moz-user-select: none;
3291
- -ms-user-select: none;
3292
- user-select: none;
3293
- margin: 0;
3294
- padding: 0;
3295
- align-items: center;
3296
- display: flex;
3297
- flex-grow: 1;
3298
- flex-shrink: 0;
3299
- justify-content: flex-start;
3300
- overflow-x: auto;
3301
- padding-bottom: var(--oruga-tabs-border-bottom-width, 1px);
3302
- font-size: var(--oruga-tabs-font-size, 1rem);
3303
- }
3304
- .o-tabs__nav--small {
3305
- font-size: var(--oruga-tabs-font-size-small, 0.75rem);
3306
- }
3307
- .o-tabs__nav--medium {
3308
- font-size: var(--oruga-tabs-font-size-medium, 1.25rem);
3309
- }
3310
- .o-tabs__nav--large {
3311
- font-size: var(--oruga-tabs-font-size-large, 1.5rem);
3312
- }
3313
- .o-tabs__nav--centered {
3314
- justify-content: center;
3315
- }
3316
- .o-tabs__nav--right {
3317
- justify-content: flex-end;
3318
- }
3319
- .o-tabs__nav-item-icon {
3320
- margin-right: var(--oruga-tabs-icon-margin, 0.5em);
3321
- }
3322
- .o-tabs__nav-item-default {
3323
- -moz-appearance: none;
3324
- -webkit-appearance: none;
3325
- width: 100%;
3326
- margin: 0;
3327
- padding: 0;
3328
- border: 1px solid transparent;
3329
- background-color: transparent;
3330
- align-items: center;
3331
- line-height: 1.5;
3332
- font-size: var(--oruga-tabs-font-size, 1rem);
3333
- border-bottom-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3334
- border-bottom-style: var(--oruga-tabs-border-bottom-style, solid);
3335
- border-bottom-width: var(--oruga-tabs-border-bottom-width, 1px);
3336
- color: var(--oruga-tabs-link-color, hsl(0, 0%, 29%));
3337
- display: flex;
3338
- justify-content: center;
3339
- margin-bottom: -1px;
3340
- padding: var(--oruga-tabs-link-padding, 0.5em 1em);
3341
- vertical-align: top;
3342
- cursor: pointer;
3343
- text-decoration: none;
3344
- }
3345
- .o-tabs__nav-item-default--active {
3346
- border-bottom-color: var(--oruga-tabs-link-active-border-bottom-color, #445e00);
3347
- color: var(--oruga-tabs-link-active-color, #445e00);
3348
- }
3349
- .o-tabs__nav-item-default--disabled {
3350
- pointer-events: none;
3351
- cursor: not-allowed;
3352
- opacity: var(--oruga-tabs-disabled-opacity, 0.5);
3353
- }
3354
- .o-tabs__nav-item-default:hover:not(.o-tabs__nav-item-default--active) {
3355
- background-color: var(--oruga-tabs-link-hover-background-color, hsl(0, 0%, 96%));
3356
- border-bottom-color: var(--oruga-tabs-link-hover-border-bottom-color, hsl(0, 0%, 86%));
3357
- }
3358
- .o-tabs__nav-item-boxed {
3359
- -moz-appearance: none;
3360
- -webkit-appearance: none;
3361
- width: 100%;
3362
- margin: 0;
3363
- padding: 0;
3364
- border: 1px solid transparent;
3365
- background-color: transparent;
3366
- align-items: center;
3367
- line-height: 1.5;
3368
- font-size: var(--oruga-tabs-font-size, 1rem);
3369
- border-bottom-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3370
- border-bottom-style: var(--oruga-tabs-border-bottom-style, solid);
3371
- border-bottom-width: var(--oruga-tabs-border-bottom-width, 1px);
3372
- color: var(--oruga-tabs-link-color, hsl(0, 0%, 29%));
3373
- display: flex;
3374
- justify-content: center;
3375
- margin-bottom: -1px;
3376
- padding: var(--oruga-tabs-link-padding, 0.5em 1em);
3377
- vertical-align: top;
3378
- cursor: pointer;
3379
- text-decoration: none;
3380
- border-radius: var(--oruga-tabs-border-bottom-color, 4px 4px 0 0);
3381
- border-bottom-color: transparent;
3382
- }
3383
- .o-tabs__nav-item-boxed--active {
3384
- border-bottom-color: var(--oruga-tabs-link-active-border-bottom-color, #445e00);
3385
- color: var(--oruga-tabs-link-active-color, #445e00);
3386
- background-color: var(--oruga-tabs-boxed-link-active-background-color, hsl(0, 0%, 100%));
3387
- border-color: var(--oruga-tabs-boxed-link-active-border-color, hsl(0, 0%, 86%));
3388
- border-bottom-color: var(--oruga-tabs-boxed-link-active-border-bottom-color, transparent);
3389
- }
3390
- .o-tabs__nav-item-boxed--disabled {
3391
- pointer-events: none;
3392
- cursor: not-allowed;
3393
- opacity: var(--oruga-tabs-disabled-opacity, 0.5);
3394
- }
3395
- .o-tabs__nav-item-boxed:hover:not(.o-tabs__nav-item-boxed--active) {
3396
- background-color: var(--oruga-tabs-boxed-link-hover-background-color, hsl(0, 0%, 96%));
3397
- }
3398
- .o-tabs__nav-item-toggle {
3399
- -moz-appearance: none;
3400
- -webkit-appearance: none;
3401
- width: 100%;
3402
- margin: 0;
3403
- padding: 0;
3404
- border: 1px solid transparent;
3405
- background-color: transparent;
3406
- align-items: center;
3407
- line-height: 1.5;
3408
- font-size: var(--oruga-tabs-font-size, 1rem);
3409
- border-bottom-color: var(--oruga-tabs-border-bottom-color, #dbdbdb);
3410
- border-bottom-style: var(--oruga-tabs-border-bottom-style, solid);
3411
- border-bottom-width: var(--oruga-tabs-border-bottom-width, 1px);
3412
- color: var(--oruga-tabs-link-color, hsl(0, 0%, 29%));
3413
- display: flex;
3414
- justify-content: center;
3415
- margin-bottom: -1px;
3416
- padding: var(--oruga-tabs-link-padding, 0.5em 1em);
3417
- vertical-align: top;
3418
- cursor: pointer;
3419
- text-decoration: none;
3420
- border-color: var(--oruga-tabs-toggle-link-border-color, hsl(0, 0%, 86%));
3421
- border-style: var(--oruga-tabs-toggle-link-border-style, solid);
3422
- border-width: var(--oruga-tabs-toggle-link-border-width, 1px);
3423
- margin-bottom: 0;
3424
- position: relative;
3425
- }
3426
- .o-tabs__nav-item-toggle--active {
3427
- background-color: var(--oruga-tabs-toggle-link-active-background-color, #445e00);
3428
- border-color: var(--oruga-tabs-toggle-link-active-border-color, #445e00);
3429
- color: var(--oruga-tabs-toggle-link-active-color, #ffffff);
3430
- }
3431
- .o-tabs__nav-item-toggle--disabled {
3432
- pointer-events: none;
3433
- cursor: not-allowed;
3434
- opacity: var(--oruga-tabs-disabled-opacity, 0.5);
3435
- }
3436
- .o-tabs__nav-item-toggle:hover:not(.o-tabs__nav-item-toggle--active) {
3437
- background-color: var(--oruga-tabs-toggle-link-hover-background-color, hsl(0, 0%, 96%));
3438
- border-color: var(--oruga-tabs-toggle-link-hover-border-color, hsl(0, 0%, 71%));
3439
- }
3440
- .o-tabs__content {
3441
- position: relative;
3442
- overflow: visible;
3443
- display: flex;
3444
- flex-direction: column;
3445
- flex-grow: 1;
3446
- padding: var(--oruga-tabs-content-padding, 1rem);
3447
- }
3448
- .o-tabs__content--transitioning {
3449
- overflow: hidden;
3450
- }
3451
- .o-tabs:not(:last-child) {
3452
- margin-bottom: var(--oruga-tabs-margin-bottom, 1.5rem);
3453
- }
3454
-
3455
- /* @docs */
3456
- /* @docs */
3457
- .o-taginput {
3458
- display: block;
3459
- }
3460
- .o-taginput__container {
3461
- display: flex;
3462
- align-items: center;
3463
- justify-content: flex-start;
3464
- position: relative;
3465
- vertical-align: top;
3466
- flex-wrap: wrap;
3467
- max-width: var(--oruga-taginput-max-width, 100%);
3468
- width: var(--oruga-taginput-width, 100%);
3469
- padding: var(--oruga-taginput-padding, calc(0.275em - 1px) 0 0);
3470
- background-color: var(--oruga-taginput-background-color, #ffffff);
3471
- border-color: var(--oruga-taginput-border-color, #dbdbdb);
3472
- border-style: var(--oruga-taginput-border-style, solid);
3473
- border-width: var(--oruga-taginput-border-width, 1px);
3474
- border-radius: var(--oruga-taginput-border-radius, 4px);
3475
- color: var(--oruga-taginput-color, #363636);
3476
- font-size: var(--oruga-base-font-size, 1rem);
3477
- line-height: var(--oruga-taginput-line-height, 1.5);
3478
- box-shadow: var(--oruga-taginput-box-shadow, inset 0 1px 2px hsla(0, 0%, 4%, 0.1));
3479
- }
3480
- .o-taginput__container--small {
3481
- font-size: var(--oruga-taginput-font-size-small, 0.75rem);
3482
- }
3483
- .o-taginput__container--medium {
3484
- font-size: var(--oruga-taginput-font-size-medium, 1.25rem);
3485
- }
3486
- .o-taginput__container--large {
3487
- font-size: var(--oruga-taginput-font-size-large, 1.5rem);
3488
- }
3489
- .o-taginput__autocomplete {
3490
- position: static;
3491
- flex: 1;
3492
- }
3493
- .o-taginput__input {
3494
- border: none;
3495
- box-shadow: none;
3496
- }
3497
- .o-taginput__input:focus {
3498
- box-shadow: none;
3499
- }
3500
- .o-taginput__item {
3501
- display: inline-flex;
3502
- justify-content: center;
3503
- align-items: center;
3504
- position: relative;
3505
- margin-left: -0.1875em;
3506
- margin-right: -0.1875em;
3507
- background-color: var(--oruga-taginput-item-background-color, #445e00);
3508
- color: var(--oruga-taginput-item-color, #ffffff);
3509
- border-radius: var(--oruga-taginput-item-border-radius, 4px);
3510
- margin: var(--oruga-taginput-item-margin, 0 0 0 0.275em);
3511
- padding: var(--oruga-taginput-item-padding, 0 0.75em 0 0.75em);
3512
- }
3513
- .o-taginput__item > * {
3514
- margin-left: 0.1875em;
3515
- margin-right: 0.1875em;
3516
- }
3517
- .o-taginput__item--primary {
3518
- background-color: var(--oruga-variant-primary, #445e00);
3519
- color: var(--oruga-variant-invert-primary, #ffffff);
3520
- }
3521
- .o-taginput__item--secondary {
3522
- background-color: var(--oruga-variant-secondary, #6c757d);
3523
- color: var(--oruga-variant-invert-secondary, #ffffff);
3524
- }
3525
- .o-taginput__item--success {
3526
- background-color: var(--oruga-variant-success, #006724);
3527
- color: var(--oruga-variant-invert-success, #ffffff);
3528
- }
3529
- .o-taginput__item--info {
3530
- background-color: var(--oruga-variant-info, #005c98);
3531
- color: var(--oruga-variant-invert-info, #ffffff);
3532
- }
3533
- .o-taginput__item--warning {
3534
- background-color: var(--oruga-variant-warning, #f4c300);
3535
- color: var(--oruga-variant-invert-warning, #000000);
3536
- }
3537
- .o-taginput__item--danger {
3538
- background-color: var(--oruga-variant-danger, #b60000);
3539
- color: var(--oruga-variant-invert-danger, #ffffff);
3540
- }
3541
- .o-taginput__counter {
3542
- display: block;
3543
- float: right;
3544
- font-size: var(--oruga-taginput-counter-font-size, 0.75rem);
3545
- margin: var(--oruga-taginput-counter-margin, 0.25rem 0 0 0.5rem);
3546
- }
3547
- .o-taginput--expanded {
3548
- width: 100%;
3549
- flex-grow: 1;
3550
- flex-shrink: 1;
3551
- }
3552
-
3553
- /* @docs */
3554
- /* @docs */
3555
- .o-tpck {
3556
- font-size: var(--oruga-timepicker-font-size, 1rem);
3557
- }
3558
- .o-tpck--small {
3559
- font-size: var(--oruga-timepicker-font-size-small, 0.75rem);
3560
- }
3561
- .o-tpck--medium {
3562
- font-size: var(--oruga-timepicker-font-size-medium, 1.25rem);
3563
- }
3564
- .o-tpck--large {
3565
- font-size: var(--oruga-timepicker-font-size-large, 1.5rem);
3566
- }
3567
- .o-tpck__dropdown {
3568
- width: 100%;
3569
- }
3570
- .o-tpck__box {
3571
- display: flex;
3572
- justify-content: center;
3573
- align-items: center;
3574
- line-height: var(--oruga-timepicker-box-line-height, 1.5);
3575
- padding: var(--oruga-timepicker-box-padding, 0.375rem 1rem);
3576
- }
3577
- .o-tpck__select {
3578
- -moz-appearance: none;
3579
- -webkit-appearance: none;
3580
- display: inline-block;
3581
- position: relative;
3582
- vertical-align: top;
3583
- cursor: pointer;
3584
- justify-content: flex-start;
3585
- align-items: center;
3586
- border: 0;
3587
- font-size: inherit;
3588
- font-weight: var(--oruga-timepicker-select-font-weight, 600);
3589
- line-height: var(--oruga-timepicker-select-line-height, 1.5);
3590
- padding: var(--oruga-timepicker-select-padding, calc(0.375em - 1px) calc(0.625em - 1px));
3591
- color: var(--oruga-timepicker-select-color, #363636);
3592
- }
3593
- .o-tpck__select-placeholder {
3594
- opacity: var(--oruga-timepicker-select-placeholder-opacity, 0.5);
3595
- }
3596
- .o-tpck__separator {
3597
- font-weight: var(--oruga-timepicker-separator-font-weight, 600);
3598
- }
3599
- .o-tpck__footer {
3600
- padding: var(--oruga-timepicker-header-padding, 0 0.5rem);
3601
- margin: var(--oruga-timepicker-header-margin, 0.875rem 0 0 0);
3602
- }
3603
-
3604
- /* @docs */
3605
- /* @docs */
3606
- .o-tip {
3607
- position: relative;
3608
- display: inline-flex;
3609
- }
3610
- .o-tip__arrow {
3611
- position: absolute;
3612
- content: "";
3613
- pointer-events: none;
3614
- z-index: var(--oruga-tooltip-content-zindex, 38);
3615
- color: var(--oruga-tooltip-background-color, #445e00);
3616
- }
3617
- .o-tip__arrow--primary {
3618
- color: var(--oruga-variant-primary, #445e00);
3619
- }
3620
- .o-tip__arrow--secondary {
3621
- color: var(--oruga-variant-secondary, #6c757d);
3622
- }
3623
- .o-tip__arrow--success {
3624
- color: var(--oruga-variant-success, #006724);
3625
- }
3626
- .o-tip__arrow--info {
3627
- color: var(--oruga-variant-info, #005c98);
3628
- }
3629
- .o-tip__arrow--warning {
3630
- color: var(--oruga-variant-warning, #f4c300);
3631
- }
3632
- .o-tip__arrow--danger {
3633
- color: var(--oruga-variant-danger, #b60000);
3634
- }
3635
- .o-tip__arrow--bottom {
3636
- top: auto;
3637
- right: auto;
3638
- bottom: 100%;
3639
- left: 50%;
3640
- transform: translateX(-50%);
3641
- border-bottom-style: solid;
3642
- border-right-style: solid;
3643
- border-right-color: transparent;
3644
- border-left-style: solid;
3645
- border-left-color: transparent;
3646
- border-bottom-width: var(--oruga-tooltip-arrow-size, 5px);
3647
- border-right-width: var(--oruga-tooltip-arrow-size, 5px);
3648
- border-left-width: var(--oruga-tooltip-arrow-size, 5px);
3649
- }
3650
- .o-tip__arrow--top {
3651
- top: 100%;
3652
- right: auto;
3653
- bottom: auto;
3654
- left: 50%;
3655
- transform: translateX(-50%);
3656
- border-top-style: solid;
3657
- border-right-style: solid;
3658
- border-right-color: transparent;
3659
- border-left-style: solid;
3660
- border-left-color: transparent;
3661
- border-top-width: var(--oruga-tooltip-arrow-size, 5px);
3662
- border-right-width: var(--oruga-tooltip-arrow-size, 5px);
3663
- border-left-width: var(--oruga-tooltip-arrow-size, 5px);
3664
- }
3665
- .o-tip__arrow--left {
3666
- top: 50%;
3667
- right: auto;
3668
- bottom: auto;
3669
- left: 100%;
3670
- transform: translateY(-50%);
3671
- border-left-style: solid;
3672
- border-top-style: solid;
3673
- border-top-color: transparent;
3674
- border-bottom-style: solid;
3675
- border-bottom-color: transparent;
3676
- border-left-width: var(--oruga-tooltip-arrow-size, 5px);
3677
- border-top-width: var(--oruga-tooltip-arrow-size, 5px);
3678
- border-bottom-width: var(--oruga-tooltip-arrow-size, 5px);
3679
- }
3680
- .o-tip__arrow--right {
3681
- top: 50%;
3682
- right: 100%;
3683
- bottom: auto;
3684
- left: auto;
3685
- transform: translateY(-50%);
3686
- border-right-style: solid;
3687
- border-top-style: solid;
3688
- border-top-color: transparent;
3689
- border-bottom-style: solid;
3690
- border-bottom-color: transparent;
3691
- border-right-width: var(--oruga-tooltip-arrow-size, 5px);
3692
- border-top-width: var(--oruga-tooltip-arrow-size, 5px);
3693
- border-bottom-width: var(--oruga-tooltip-arrow-size, 5px);
3694
- }
3695
- .o-tip__arrow--top-right {
3696
- top: 100%;
3697
- right: auto;
3698
- bottom: auto;
3699
- left: 50%;
3700
- transform: translateX(-50%);
3701
- border-top-style: solid;
3702
- border-right-style: solid;
3703
- border-right-color: transparent;
3704
- border-left-style: solid;
3705
- border-left-color: transparent;
3706
- border-top-width: var(--oruga-tooltip-arrow-size, 5px);
3707
- border-right-width: calc(var(--oruga-tooltip-arrow-size, 5px) *2);
3708
- border-left-width: 0;
3709
- }
3710
- .o-tip__arrow--top-left {
3711
- top: 100%;
3712
- right: auto;
3713
- bottom: auto;
3714
- left: 50%;
3715
- transform: translateX(-50%);
3716
- border-top-style: solid;
3717
- border-right-style: solid;
3718
- border-right-color: transparent;
3719
- border-left-style: solid;
3720
- border-left-color: transparent;
3721
- border-top-width: var(--oruga-tooltip-arrow-size, 5px);
3722
- border-left-width: calc(var(--oruga-tooltip-arrow-size, 5px) *2);
3723
- border-right-width: 0;
3724
- }
3725
- .o-tip__arrow--bottom-left {
3726
- top: auto;
3727
- right: auto;
3728
- bottom: 100%;
3729
- left: 50%;
3730
- transform: translateX(-50%);
3731
- border-bottom-style: solid;
3732
- border-right-style: solid;
3733
- border-right-color: transparent;
3734
- border-left-style: solid;
3735
- border-left-color: transparent;
3736
- border-bottom-width: var(--oruga-tooltip-arrow-size, 5px);
3737
- border-left-width: calc(var(--oruga-tooltip-arrow-size, 5px) *2);
3738
- border-right-width: 0;
3739
- }
3740
- .o-tip__arrow--bottom-right {
3741
- top: auto;
3742
- right: auto;
3743
- bottom: 100%;
3744
- left: 50%;
3745
- transform: translateX(-50%);
3746
- border-bottom-style: solid;
3747
- border-right-style: solid;
3748
- border-right-color: transparent;
3749
- border-left-style: solid;
3750
- border-left-color: transparent;
3751
- border-bottom-width: var(--oruga-tooltip-arrow-size, 5px);
3752
- border-right-width: calc(var(--oruga-tooltip-arrow-size, 5px) *2);
3753
- border-left-width: 0;
3754
- }
3755
- .o-tip__content {
3756
- position: absolute;
3757
- white-space: nowrap;
3758
- max-width: var(--oruga-tooltip-content-max-width, 300px);
3759
- padding: var(--oruga-tooltip-content-padding, 0.35rem 0.75rem);
3760
- border-radius: var(--oruga-tooltip-content-radius-large, 6px);
3761
- font-size: var(--oruga-tooltip-content-font-size, 0.85rem);
3762
- font-weight: var(--oruga-tooltip-content-weight-normal, 400);
3763
- box-shadow: var(--oruga-tooltip-content-box-shadow, 0px 1px 2px 1px rgba(0, 1, 0, 0.2));
3764
- z-index: var(--oruga-tooltip-content-zindex, 38);
3765
- background-color: var(--oruga-tooltip-background-color, #445e00);
3766
- color: var(--oruga-tooltip-color, #ffffff);
3767
- }
3768
- .o-tip__content--primary {
3769
- background: var(--oruga-variant-primary, #445e00);
3770
- color: var(--oruga-variant-invert-primary, #ffffff);
3771
- }
3772
- .o-tip__content--secondary {
3773
- background: var(--oruga-variant-secondary, #6c757d);
3774
- color: var(--oruga-variant-invert-secondary, #ffffff);
3775
- }
3776
- .o-tip__content--success {
3777
- background: var(--oruga-variant-success, #006724);
3778
- color: var(--oruga-variant-invert-success, #ffffff);
3779
- }
3780
- .o-tip__content--info {
3781
- background: var(--oruga-variant-info, #005c98);
3782
- color: var(--oruga-variant-invert-info, #ffffff);
3783
- }
3784
- .o-tip__content--warning {
3785
- background: var(--oruga-variant-warning, #f4c300);
3786
- color: var(--oruga-variant-invert-warning, #000000);
3787
- }
3788
- .o-tip__content--danger {
3789
- background: var(--oruga-variant-danger, #b60000);
3790
- color: var(--oruga-variant-invert-danger, #ffffff);
3791
- }
3792
- .o-tip__content--top {
3793
- top: auto;
3794
- right: auto;
3795
- bottom: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3796
- left: 50%;
3797
- transform: translateX(-50%);
3798
- }
3799
- .o-tip__content--bottom {
3800
- top: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3801
- right: auto;
3802
- bottom: auto;
3803
- left: 50%;
3804
- transform: translateX(-50%);
3805
- }
3806
- .o-tip__content--right {
3807
- top: 50%;
3808
- right: auto;
3809
- bottom: auto;
3810
- left: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3811
- transform: translateY(-50%);
3812
- }
3813
- .o-tip__content--left {
3814
- top: 50%;
3815
- right: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3816
- bottom: auto;
3817
- left: auto;
3818
- transform: translateY(-50%);
3819
- }
3820
- .o-tip__content--top-right {
3821
- left: auto;
3822
- top: auto;
3823
- bottom: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3824
- transform: translateX(50%);
3825
- }
3826
- .o-tip__content--top-left {
3827
- right: auto;
3828
- top: auto;
3829
- bottom: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3830
- transform: translateX(-50%);
3831
- }
3832
- .o-tip__content--bottom-right {
3833
- left: auto;
3834
- bottom: auto;
3835
- top: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3836
- transform: translateX(50%);
3837
- }
3838
- .o-tip__content--bottom-left {
3839
- left: auto;
3840
- bottom: auto;
3841
- top: calc((var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)) + 100%);
3842
- transform: translateX(-50%);
3843
- }
3844
- .o-tip__content--always {
3845
- opacity: 1;
3846
- visibility: visible;
3847
- }
3848
- .o-tip__content--multiline {
3849
- text-align: center;
3850
- white-space: normal;
3851
- width: var(--oruga-tooltip-content-multiline-width, 300px);
3852
- }
3853
- .o-tip--teleport .o-tip__content--top, .o-tip--teleport .o-tip__content--top-left, .o-tip--teleport .o-tip__content--top-right {
3854
- margin-top: calc(-1 * (var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)));
3855
- }
3856
- .o-tip--teleport .o-tip__content--bottom, .o-tip--teleport .o-tip__content--bottom-left, .o-tip--teleport .o-tip__content--bottom-right {
3857
- margin-top: calc(var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px));
3858
- }
3859
- .o-tip--teleport .o-tip__content--right {
3860
- margin-left: calc(var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px));
3861
- }
3862
- .o-tip--teleport .o-tip__content--left {
3863
- margin-left: calc(-1 * (var(--oruga-tooltip-arrow-size, 5px) + var(--oruga-tooltip-arrow-margin, 2px)));
3864
- }
3865
- .o-tip__trigger {
3866
- width: 100%;
3867
- }
3868
-
3869
- /* @docs */
3870
- /* @docs */
3871
- .o-upl {
3872
- position: relative;
3873
- display: inline-flex;
3874
- }
3875
- .o-upl--disabled {
3876
- opacity: var(--oruga-upload-draggable-disabled-opacity, 0.5);
3877
- cursor: not-allowed;
3878
- }
3879
- .o-upl--expanded {
3880
- width: 100%;
3881
- }
3882
- .o-upl__draggable {
3883
- cursor: pointer;
3884
- width: 100%;
3885
- padding: var(--oruga-upload-draggable-padding, 0.25em);
3886
- border: var(--oruga-upload-draggable-border, 1px dashed #b5b5b5);
3887
- border-radius: var(--oruga-upload-draggable-border-radius, 4px);
3888
- }
3889
- .o-upl__draggable--hovered {
3890
- border-color: var(--oruga-upload-draggable-hover-border-color, #7a7a7a);
3891
- }
3892
- .o-upl__draggable--hovered-primary {
3893
- border-color: var(--oruga-variant-primary, #445e00);
3894
- }
3895
- .o-upl__draggable--hovered-secondary {
3896
- border-color: var(--oruga-variant-secondary, #6c757d);
3897
- }
3898
- .o-upl__draggable--hovered-success {
3899
- border-color: var(--oruga-variant-success, #006724);
3900
- }
3901
- .o-upl__draggable--hovered-info {
3902
- border-color: var(--oruga-variant-info, #005c98);
3903
- }
3904
- .o-upl__draggable--hovered-warning {
3905
- border-color: var(--oruga-variant-warning, #f4c300);
3906
- }
3907
- .o-upl__draggable--hovered-danger {
3908
- border-color: var(--oruga-variant-danger, #b60000);
3909
- }
3910
- .o-upl input[type=file] {
3911
- position: absolute;
3912
- top: 0;
3913
- left: 0;
3914
- width: 100%;
3915
- height: 100%;
3916
- opacity: 0;
3917
- cursor: pointer;
3918
- z-index: -1;
3919
- }