@motifx-community/ui 0.1.0-beta.1 → 0.1.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +64 -0
- package/README.md +16 -10
- package/dist/components/calendar/Calendar.d.ts +12 -0
- package/dist/components/calendar/calendar-props.d.ts +5 -0
- package/dist/components/daterangebox/DateRangeBox.d.ts +121 -0
- package/dist/components/daterangebox/date-range-box-props.d.ts +35 -0
- package/dist/components/daterangebox/date-range-preset.d.ts +6 -0
- package/dist/components/daterangebox/date-range.d.ts +2 -0
- package/dist/components/daterangebox/index.d.ts +4 -0
- package/dist/components/fileuploader/FileUploader.d.ts +133 -0
- package/dist/components/fileuploader/file-uploader-props.d.ts +46 -0
- package/dist/components/fileuploader/files-added-event-args.d.ts +9 -0
- package/dist/components/fileuploader/index.d.ts +7 -0
- package/dist/components/fileuploader/upload-event-args.d.ts +10 -0
- package/dist/components/fileuploader/upload-item.d.ts +12 -0
- package/dist/components/fileuploader/upload-mode.d.ts +2 -0
- package/dist/components/fileuploader/upload-status.d.ts +2 -0
- package/dist/components/loadpanel/LoadPanel.d.ts +70 -0
- package/dist/components/loadpanel/index.d.ts +3 -0
- package/dist/components/loadpanel/load-panel-props.d.ts +29 -0
- package/dist/components/loadpanel/load-panel-target.d.ts +3 -0
- package/dist/components/popover/Popover.d.ts +98 -0
- package/dist/components/popover/index.d.ts +5 -0
- package/dist/components/popover/popover-close-reason.d.ts +2 -0
- package/dist/components/popover/popover-closing-event-args.d.ts +8 -0
- package/dist/components/popover/popover-props.d.ts +39 -0
- package/dist/components/popover/popover-show-on.d.ts +2 -0
- package/dist/components/scrollview/ScrollView.d.ts +109 -0
- package/dist/components/scrollview/index.d.ts +7 -0
- package/dist/components/scrollview/pull-down-event-args.d.ts +9 -0
- package/dist/components/scrollview/reach-bottom-event-args.d.ts +9 -0
- package/dist/components/scrollview/scroll-event-args.d.ts +7 -0
- package/dist/components/scrollview/scroll-view-bars.d.ts +2 -0
- package/dist/components/scrollview/scroll-view-direction.d.ts +2 -0
- package/dist/components/scrollview/scroll-view-props.d.ts +31 -0
- package/dist/components/sortable/Sortable.d.ts +106 -0
- package/dist/components/sortable/index.d.ts +5 -0
- package/dist/components/sortable/sortable-drag-event-args.d.ts +15 -0
- package/dist/components/sortable/sortable-drop-event-args.d.ts +11 -0
- package/dist/components/sortable/sortable-orientation.d.ts +2 -0
- package/dist/components/sortable/sortable-props.d.ts +34 -0
- package/dist/components/stepper/Stepper.d.ts +121 -0
- package/dist/components/stepper/Wizard.d.ts +112 -0
- package/dist/components/stepper/WizardStep.d.ts +44 -0
- package/dist/components/stepper/index.d.ts +13 -0
- package/dist/components/stepper/step-changed-event-args.d.ts +11 -0
- package/dist/components/stepper/step-changing-event-args.d.ts +18 -0
- package/dist/components/stepper/stepper-item.d.ts +20 -0
- package/dist/components/stepper/stepper-label-position.d.ts +2 -0
- package/dist/components/stepper/stepper-orientation.d.ts +1 -0
- package/dist/components/stepper/stepper-props.d.ts +32 -0
- package/dist/components/stepper/stepper-status.d.ts +2 -0
- package/dist/components/stepper/wizard-finishing-event-args.d.ts +7 -0
- package/dist/components/stepper/wizard-props.d.ts +48 -0
- package/dist/components/stepper/wizard-step-props.d.ts +32 -0
- package/dist/core/flow-home.d.ts +6 -0
- package/dist/core/fold-text.d.ts +6 -0
- package/dist/core/ui-locale.d.ts +0 -2
- package/dist/core/ui-strings.d.ts +41 -0
- package/dist/generated/tokens.d.ts +1146 -11
- package/dist/index.d.ts +8 -1
- package/dist/index.js +22564 -20283
- package/dist/index.js.map +1 -1
- package/dist/locales/en.json +38 -1
- package/dist/locales/tr.json +38 -1
- package/dist/styles.css +1825 -5
- package/dist/tokens/index.d.ts +1146 -11
- package/dist/tokens/index.js +1146 -11
- package/dist/tokens/index.js.map +1 -1
- package/dist/tr-B218zMtu.js +1191 -0
- package/dist/tr-B218zMtu.js.map +1 -0
- package/docs/accordion.md +1 -1
- package/docs/actionsheet.md +1 -1
- package/docs/avatar.md +1 -1
- package/docs/badge.md +1 -1
- package/docs/bottomsheet.md +3 -3
- package/docs/breadcrumb.md +2 -2
- package/docs/button.md +3 -3
- package/docs/buttongroup.md +1 -1
- package/docs/calendar.md +1 -1
- package/docs/card.md +1 -1
- package/docs/checkbox.md +3 -3
- package/docs/chip.md +1 -1
- package/docs/colorbox.md +1 -1
- package/docs/combobox.md +1 -1
- package/docs/control.md +1 -1
- package/docs/datagrid-api.md +3 -3
- package/docs/datagrid-bands.md +1 -1
- package/docs/datagrid-drag-select.md +1 -1
- package/docs/datagrid-drag.md +1 -1
- package/docs/datagrid-editing.md +1 -1
- package/docs/datagrid-filtering.md +1 -1
- package/docs/datagrid-forms.md +1 -1
- package/docs/datagrid-grouping.md +1 -1
- package/docs/datagrid-layout.md +1 -1
- package/docs/datagrid-lookups.md +1 -1
- package/docs/datagrid-master-detail.md +1 -1
- package/docs/datagrid-scrolling.md +1 -1
- package/docs/datagrid-selection.md +1 -1
- package/docs/datagrid.md +1 -1
- package/docs/datebox.md +3 -3
- package/docs/daterangebox.md +192 -0
- package/docs/drawer.md +1 -1
- package/docs/dropdown.md +3 -3
- package/docs/fileuploader.md +201 -0
- package/docs/filterbuilder.md +3 -3
- package/docs/formlayout.md +1 -1
- package/docs/home.md +1 -1
- package/docs/keyboard.md +1 -1
- package/docs/language.md +229 -0
- package/docs/layout.md +3 -3
- package/docs/listbox.md +3 -3
- package/docs/loadpanel.md +184 -0
- package/docs/lookup.md +1 -1
- package/docs/menus.md +1 -1
- package/docs/numberbox.md +3 -3
- package/docs/pagination.md +1 -1
- package/docs/popover.md +221 -0
- package/docs/progress.md +3 -3
- package/docs/radiogroup.md +1 -1
- package/docs/rating.md +1 -1
- package/docs/scheduler-agenda.md +1 -1
- package/docs/scheduler-big-data.md +1 -1
- package/docs/scheduler-editing.md +1 -1
- package/docs/scheduler-form.md +1 -1
- package/docs/scheduler-icalendar.md +1 -1
- package/docs/scheduler-mobile.md +1 -1
- package/docs/scheduler-recurrence.md +1 -1
- package/docs/scheduler-resources.md +1 -1
- package/docs/scheduler-timeline.md +1 -1
- package/docs/scheduler.md +1 -1
- package/docs/scrollview.md +185 -0
- package/docs/showcase.md +1 -1
- package/docs/skeleton.md +1 -1
- package/docs/slider.md +3 -3
- package/docs/sortable.md +213 -0
- package/docs/stepper.md +238 -0
- package/docs/switch.md +1 -1
- package/docs/tabdocs-dock.md +1 -1
- package/docs/tabdocs-drag.md +1 -1
- package/docs/tabdocs-menus.md +1 -1
- package/docs/tabdocs-mobile.md +1 -1
- package/docs/tabdocs-tabs.md +1 -1
- package/docs/tabdocs-windows.md +1 -1
- package/docs/tabdocs-workspace.md +1 -1
- package/docs/tabdocs.md +1 -1
- package/docs/tabs.md +3 -3
- package/docs/tagbox.md +3 -3
- package/docs/textarea.md +3 -3
- package/docs/textbox.md +3 -3
- package/docs/toast.md +3 -3
- package/docs/tokens.md +349 -122
- package/docs/toolbar.md +3 -3
- package/docs/tooltip.md +1 -1
- package/docs/treeview.md +3 -3
- package/docs/window.md +3 -3
- package/docs/wizard.md +240 -0
- package/llms-full.txt +2415 -240
- package/llms.txt +10 -1
- package/package.json +9 -3
package/dist/styles.css
CHANGED
|
@@ -376,6 +376,11 @@
|
|
|
376
376
|
--mx-datagrid-filter-text-off-text-decoration: line-through;
|
|
377
377
|
--mx-date-box-times-min-width: 6rem;
|
|
378
378
|
--mx-date-box-times-max-height: 18rem;
|
|
379
|
+
--mx-date-range-box-field-width: 20rem;
|
|
380
|
+
--mx-date-range-box-separator-icon: var(--mx-icon-dash);
|
|
381
|
+
--mx-date-range-box-separator-size: 1rem;
|
|
382
|
+
--mx-date-range-box-presets-min-width: 9rem;
|
|
383
|
+
--mx-date-range-box-presets-max-height: 18rem;
|
|
379
384
|
--mx-drawer-size: 20rem;
|
|
380
385
|
--mx-drawer-inset: 0px;
|
|
381
386
|
--mx-drawer-max-size: 85%;
|
|
@@ -443,6 +448,8 @@
|
|
|
443
448
|
--mx-field-box-underline-readonly-invalid-focus-shadow: initial;
|
|
444
449
|
--mx-field-box-pressed-bg: initial;
|
|
445
450
|
--mx-field-box-pressed-color: initial;
|
|
451
|
+
--mx-field-box-border-style: initial;
|
|
452
|
+
--mx-field-box-border-color: initial;
|
|
446
453
|
--mx-field-frame-focus-border-color: initial;
|
|
447
454
|
--mx-field-frame-focus-border-width: initial;
|
|
448
455
|
--mx-field-frame-readonly-focus-border-width: initial;
|
|
@@ -498,6 +505,13 @@
|
|
|
498
505
|
--mx-field-frame-end-readonly-focus-border-end-width: initial;
|
|
499
506
|
--mx-field-frame-end-readonly-invalid-focus-border-block-width: initial;
|
|
500
507
|
--mx-field-frame-end-readonly-invalid-focus-border-end-width: initial;
|
|
508
|
+
--mx-file-uploader-field-width: 26rem;
|
|
509
|
+
--mx-file-uploader-field-box-border-style: dashed;
|
|
510
|
+
--mx-file-uploader-action-variant: ghost;
|
|
511
|
+
--mx-file-uploader-select-hover-cursor: pointer;
|
|
512
|
+
--mx-file-uploader-upload-hover-cursor: pointer;
|
|
513
|
+
--mx-file-uploader-icon-icon: var(--mx-icon-file);
|
|
514
|
+
--mx-file-uploader-icon-size: 1.25rem;
|
|
501
515
|
--mx-filterbuilder-elbow-length: 0px;
|
|
502
516
|
--mx-filterbuilder-elbow-color: rgb(0 0 0 / 0);
|
|
503
517
|
--mx-filterbuilder-value-width: 12rem;
|
|
@@ -554,6 +568,8 @@
|
|
|
554
568
|
--mx-listbox-check-checked-disabled-border-color: rgb(0 0 0 / 0);
|
|
555
569
|
--mx-listbox-idle-bg: rgb(0 0 0 / 0);
|
|
556
570
|
--mx-listbox-container-margin: initial;
|
|
571
|
+
--mx-load-panel-cancel-variant: outline;
|
|
572
|
+
--mx-load-panel-pane-shown-min-width: 10rem;
|
|
557
573
|
--mx-lookup-popup-width: 28rem;
|
|
558
574
|
--mx-menu-item-white-space: nowrap;
|
|
559
575
|
--mx-menu-item-checked-bg: initial;
|
|
@@ -589,6 +605,11 @@
|
|
|
589
605
|
--mx-pagination-step-overlap: 0.375rem;
|
|
590
606
|
--mx-pagination-number-width: 4rem;
|
|
591
607
|
--mx-pagination-size-width: 5.5rem;
|
|
608
|
+
--mx-popover-enter-offset: 4px;
|
|
609
|
+
--mx-popover-close-variant: ghost;
|
|
610
|
+
--mx-popover-surface-max-width: 24rem;
|
|
611
|
+
--mx-popover-arrow-display: block;
|
|
612
|
+
--mx-popover-arrow-size: 0.75rem;
|
|
592
613
|
--mx-popup-list-box-box-bg: rgb(0 0 0 / 0);
|
|
593
614
|
--mx-popup-list-box-box-hover-bg: rgb(0 0 0 / 0);
|
|
594
615
|
--mx-popup-list-box-box-focus-bg: rgb(0 0 0 / 0);
|
|
@@ -876,6 +897,7 @@
|
|
|
876
897
|
--mx-scheduler-swipe-icon-display: block;
|
|
877
898
|
--mx-scheduler-swipe-icon-icon: var(--mx-icon-chevron-end);
|
|
878
899
|
--mx-scheduler-swipe-icon-previous-icon: var(--mx-icon-chevron-start);
|
|
900
|
+
--mx-scroll-view-panel-height: 3rem;
|
|
879
901
|
--mx-sheet-inset: 0px;
|
|
880
902
|
--mx-sheet-peek-height: 6rem;
|
|
881
903
|
--mx-sheet-close-button-variant: ghost;
|
|
@@ -976,6 +998,10 @@
|
|
|
976
998
|
--mx-slider-stop-radius: initial;
|
|
977
999
|
--mx-slider-stop-bg: initial;
|
|
978
1000
|
--mx-slider-stop-active-bg: initial;
|
|
1001
|
+
--mx-sortable-item-sortable-cursor: grab;
|
|
1002
|
+
--mx-sortable-item-dragging-opacity: 0.4;
|
|
1003
|
+
--mx-sortable-line-height: 2px;
|
|
1004
|
+
--mx-sortable-ghost-opacity: 0.9;
|
|
979
1005
|
--mx-spinner-size-md: 1.5rem;
|
|
980
1006
|
--mx-spinner-size-lg: 2.5rem;
|
|
981
1007
|
--mx-spinner-ring-width-md: 0.1875rem;
|
|
@@ -998,6 +1024,21 @@
|
|
|
998
1024
|
--mx-spinner-shape-display: initial;
|
|
999
1025
|
--mx-spinner-shape-contained-bg: initial;
|
|
1000
1026
|
--mx-spinner-shape-contained-scale: initial;
|
|
1027
|
+
--mx-stepper-font-size-lg: 1rem;
|
|
1028
|
+
--mx-stepper-line-min-length: 1rem;
|
|
1029
|
+
--mx-stepper-size-sm: 1.5rem;
|
|
1030
|
+
--mx-stepper-size-md: 1.75rem;
|
|
1031
|
+
--mx-stepper-size-lg: 2.25rem;
|
|
1032
|
+
--mx-stepper-padding-sm: 0.25rem;
|
|
1033
|
+
--mx-stepper-padding-md: 0.375rem;
|
|
1034
|
+
--mx-stepper-padding-lg: 0.5rem;
|
|
1035
|
+
--mx-stepper-step-hover-cursor: pointer;
|
|
1036
|
+
--mx-stepper-indicator-border-width: 1px;
|
|
1037
|
+
--mx-stepper-indicator-disabled-bg: initial;
|
|
1038
|
+
--mx-stepper-mark-done-icon: var(--mx-icon-check);
|
|
1039
|
+
--mx-stepper-mark-error-icon: var(--mx-icon-danger);
|
|
1040
|
+
--mx-stepper-line-height: 2px;
|
|
1041
|
+
--mx-stepper-line-radius: initial;
|
|
1001
1042
|
--mx-switch-track-width-sm: 2rem;
|
|
1002
1043
|
--mx-switch-track-width-md: 2.5rem;
|
|
1003
1044
|
--mx-switch-track-width-lg: 3rem;
|
|
@@ -1186,6 +1227,11 @@
|
|
|
1186
1227
|
--mx-window-body-bg: initial;
|
|
1187
1228
|
--mx-window-footer-padding: initial;
|
|
1188
1229
|
--mx-window-footer-bg: initial;
|
|
1230
|
+
--mx-wizard-rail-width: 14rem;
|
|
1231
|
+
--mx-wizard-previous-variant: outline;
|
|
1232
|
+
--mx-wizard-next-variant: solid;
|
|
1233
|
+
--mx-wizard-next-tone: accent;
|
|
1234
|
+
--mx-wizard-bar-border-top-width: 1px;
|
|
1189
1235
|
--mx-accordion-font-size-sm: var(--mx-font-size-caption);
|
|
1190
1236
|
--mx-accordion-font-size-md: var(--mx-font-size-body);
|
|
1191
1237
|
--mx-accordion-font-size-lg: var(--mx-font-size-body-large);
|
|
@@ -1363,6 +1409,7 @@
|
|
|
1363
1409
|
--mx-calendar-cell-focus-glow: var(--mx-focus-ring-halo);
|
|
1364
1410
|
--mx-calendar-cell-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
1365
1411
|
--mx-calendar-cell-today-font-weight: var(--mx-font-weight-semibold);
|
|
1412
|
+
--mx-calendar-cell-range-in-radius: var(--mx-radius-none);
|
|
1366
1413
|
--mx-calendar-today-padding-block: var(--mx-space-1);
|
|
1367
1414
|
--mx-calendar-today-padding-inline: var(--mx-space-3);
|
|
1368
1415
|
--mx-calendar-today-radius: var(--mx-radius-md);
|
|
@@ -1663,6 +1710,13 @@
|
|
|
1663
1710
|
--mx-date-box-times-beside-padding-start: var(--mx-space-1);
|
|
1664
1711
|
--mx-date-box-times-beside-border-start-width: var(--mx-border-width-1);
|
|
1665
1712
|
--mx-date-box-times-beside-border-start-color: var(--mx-color-stroke-divider);
|
|
1713
|
+
--mx-date-range-box-popup-gap: var(--mx-space-1);
|
|
1714
|
+
--mx-date-range-box-calendar-container-padding: var(--mx-space-2);
|
|
1715
|
+
--mx-date-range-box-separator-margin-inline: var(--mx-space-1);
|
|
1716
|
+
--mx-date-range-box-presets-focus-glow: var(--mx-focus-ring-halo);
|
|
1717
|
+
--mx-date-range-box-presets-beside-padding-start: var(--mx-space-1);
|
|
1718
|
+
--mx-date-range-box-presets-beside-border-start-width: var(--mx-border-width-1);
|
|
1719
|
+
--mx-date-range-box-presets-beside-border-start-color: var(--mx-color-stroke-divider);
|
|
1666
1720
|
--mx-drawer-font-family: var(--mx-font-family-sans);
|
|
1667
1721
|
--mx-drawer-scrim-bg: var(--mx-color-bg-smoke);
|
|
1668
1722
|
--mx-drawer-panel-border-color: var(--mx-color-stroke-surface);
|
|
@@ -1765,6 +1819,41 @@
|
|
|
1765
1819
|
--mx-field-foot-font-size: var(--mx-font-size-caption);
|
|
1766
1820
|
--mx-field-foot-line-height: var(--mx-font-line-caption);
|
|
1767
1821
|
--mx-field-foot-shown-padding-top: var(--mx-space-1);
|
|
1822
|
+
--mx-file-uploader-box-gap: var(--mx-space-3);
|
|
1823
|
+
--mx-file-uploader-button-gap: var(--mx-space-2);
|
|
1824
|
+
--mx-file-uploader-item-gap: var(--mx-space-2);
|
|
1825
|
+
--mx-file-uploader-field-box-border-color: var(--mx-color-stroke-control-strong);
|
|
1826
|
+
--mx-file-uploader-field-box-radius: var(--mx-radius-lg);
|
|
1827
|
+
--mx-file-uploader-field-box-hover-bg: var(--mx-color-fill-subtle-secondary);
|
|
1828
|
+
--mx-file-uploader-field-border-width: var(--mx-border-width-1);
|
|
1829
|
+
--mx-file-uploader-field-padding-sm: var(--mx-space-2);
|
|
1830
|
+
--mx-file-uploader-field-padding-md: var(--mx-space-3);
|
|
1831
|
+
--mx-file-uploader-field-padding-lg: var(--mx-space-4);
|
|
1832
|
+
--mx-file-uploader-select-padding-block: var(--mx-space-1);
|
|
1833
|
+
--mx-file-uploader-select-padding-inline: var(--mx-space-3);
|
|
1834
|
+
--mx-file-uploader-select-radius: var(--mx-radius-sm);
|
|
1835
|
+
--mx-file-uploader-select-font-weight: var(--mx-font-weight-semibold);
|
|
1836
|
+
--mx-file-uploader-select-border-width: var(--mx-border-width-1);
|
|
1837
|
+
--mx-file-uploader-select-border-color: var(--mx-color-stroke-control-strong);
|
|
1838
|
+
--mx-file-uploader-select-hover-bg: var(--mx-color-fill-subtle-secondary);
|
|
1839
|
+
--mx-file-uploader-select-pressed-bg: var(--mx-color-fill-subtle-tertiary);
|
|
1840
|
+
--mx-file-uploader-select-focus-glow: var(--mx-focus-ring-halo);
|
|
1841
|
+
--mx-file-uploader-select-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
1842
|
+
--mx-file-uploader-select-disabled-border-color: var(--mx-color-stroke-control-default);
|
|
1843
|
+
--mx-file-uploader-upload-padding-block: var(--mx-space-1);
|
|
1844
|
+
--mx-file-uploader-upload-padding-inline: var(--mx-space-3);
|
|
1845
|
+
--mx-file-uploader-upload-radius: var(--mx-radius-sm);
|
|
1846
|
+
--mx-file-uploader-upload-font-weight: var(--mx-font-weight-semibold);
|
|
1847
|
+
--mx-file-uploader-upload-border-width: var(--mx-border-width-1);
|
|
1848
|
+
--mx-file-uploader-upload-focus-glow: var(--mx-focus-ring-halo);
|
|
1849
|
+
--mx-file-uploader-upload-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
1850
|
+
--mx-file-uploader-list-margin-top: var(--mx-space-2);
|
|
1851
|
+
--mx-file-uploader-list-gap: var(--mx-space-1);
|
|
1852
|
+
--mx-file-uploader-item-padding-block: var(--mx-space-1);
|
|
1853
|
+
--mx-file-uploader-item-padding-inline: var(--mx-space-2);
|
|
1854
|
+
--mx-file-uploader-item-radius: var(--mx-radius-sm);
|
|
1855
|
+
--mx-file-uploader-size-font-size: var(--mx-font-size-caption);
|
|
1856
|
+
--mx-file-uploader-state-font-size: var(--mx-font-size-caption);
|
|
1768
1857
|
--mx-filterbuilder-indent: var(--mx-space-6);
|
|
1769
1858
|
--mx-filterbuilder-line-width: var(--mx-border-width-1);
|
|
1770
1859
|
--mx-filterbuilder-line-color: var(--mx-color-stroke-divider);
|
|
@@ -1867,6 +1956,15 @@
|
|
|
1867
1956
|
--mx-listbox-check-border-color: var(--mx-color-stroke-control-strong);
|
|
1868
1957
|
--mx-listbox-check-disabled-border-color: var(--mx-color-stroke-control-default);
|
|
1869
1958
|
--mx-listbox-check-checked-disabled-bg: var(--mx-color-fill-accent-disabled);
|
|
1959
|
+
--mx-load-panel-padding: var(--mx-space-4);
|
|
1960
|
+
--mx-load-panel-gap: var(--mx-space-3);
|
|
1961
|
+
--mx-load-panel-shade-shaded-bg: var(--mx-color-bg-smoke);
|
|
1962
|
+
--mx-load-panel-pane-shown-border-width: var(--mx-border-width-1);
|
|
1963
|
+
--mx-load-panel-pane-shown-border-color: var(--mx-color-stroke-surface);
|
|
1964
|
+
--mx-load-panel-pane-shown-radius: var(--mx-radius-lg);
|
|
1965
|
+
--mx-load-panel-pane-shown-padding-block: var(--mx-space-4);
|
|
1966
|
+
--mx-load-panel-pane-shown-padding-inline: var(--mx-space-5);
|
|
1967
|
+
--mx-load-panel-message-font-size: var(--mx-font-size-body);
|
|
1870
1968
|
--mx-lookup-column-gap: var(--mx-space-3);
|
|
1871
1969
|
--mx-lookup-header-padding-block: var(--mx-space-1);
|
|
1872
1970
|
--mx-lookup-header-padding-inline: var(--mx-control-padding-md);
|
|
@@ -1917,6 +2015,24 @@
|
|
|
1917
2015
|
--mx-pagination-gap: var(--mx-space-1);
|
|
1918
2016
|
--mx-pagination-info-font-size: var(--mx-font-size-body);
|
|
1919
2017
|
--mx-pagination-info-padding-inline: var(--mx-space-2);
|
|
2018
|
+
--mx-popover-offset: var(--mx-space-2);
|
|
2019
|
+
--mx-popover-header-gap: var(--mx-space-2);
|
|
2020
|
+
--mx-popover-surface-border-width: var(--mx-border-width-1);
|
|
2021
|
+
--mx-popover-surface-border-color: var(--mx-color-stroke-surface);
|
|
2022
|
+
--mx-popover-surface-radius: var(--mx-radius-lg);
|
|
2023
|
+
--mx-popover-surface-font-size: var(--mx-font-size-body);
|
|
2024
|
+
--mx-popover-surface-line-height: var(--mx-font-line-body);
|
|
2025
|
+
--mx-popover-surface-focus-glow: var(--mx-focus-ring-halo);
|
|
2026
|
+
--mx-popover-surface-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
2027
|
+
--mx-popover-arrow-border-width: var(--mx-border-width-1);
|
|
2028
|
+
--mx-popover-arrow-border-color: var(--mx-color-stroke-surface);
|
|
2029
|
+
--mx-popover-header-padding-block: var(--mx-space-2);
|
|
2030
|
+
--mx-popover-header-padding-start: var(--mx-space-3);
|
|
2031
|
+
--mx-popover-header-padding-end: var(--mx-space-2);
|
|
2032
|
+
--mx-popover-header-border-bottom-width: var(--mx-border-width-1);
|
|
2033
|
+
--mx-popover-header-border-bottom-color: var(--mx-color-stroke-divider);
|
|
2034
|
+
--mx-popover-title-font-weight: var(--mx-font-weight-semibold);
|
|
2035
|
+
--mx-popover-body-padding: var(--mx-space-3);
|
|
1920
2036
|
--mx-popup-offset: var(--mx-space-1);
|
|
1921
2037
|
--mx-popup-with-list-surface-padding-block: var(--mx-space-1);
|
|
1922
2038
|
--mx-popup-list-item-height: var(--mx-control-height-md);
|
|
@@ -2179,6 +2295,11 @@
|
|
|
2179
2295
|
--mx-scheduler-swipe-edge-border-color: var(--mx-color-stroke-card);
|
|
2180
2296
|
--mx-scheduler-swipe-icon-width: var(--mx-icon-size-md);
|
|
2181
2297
|
--mx-scheduler-swipe-icon-height: var(--mx-icon-size-md);
|
|
2298
|
+
--mx-scroll-view-panel-gap: var(--mx-space-2);
|
|
2299
|
+
--mx-scroll-view-box-focus-glow: var(--mx-focus-ring-halo);
|
|
2300
|
+
--mx-scroll-view-box-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
2301
|
+
--mx-scroll-view-pull-font-size: var(--mx-font-size-caption);
|
|
2302
|
+
--mx-scroll-view-bottom-font-size: var(--mx-font-size-caption);
|
|
2182
2303
|
--mx-sheet-font-family: var(--mx-font-family-sans);
|
|
2183
2304
|
--mx-sheet-top-gap: var(--mx-space-10);
|
|
2184
2305
|
--mx-sheet-handle-area: var(--mx-space-6);
|
|
@@ -2241,6 +2362,11 @@
|
|
|
2241
2362
|
--mx-slider-bubble-shadow: var(--mx-shadow-4);
|
|
2242
2363
|
--mx-slider-tick-bg: var(--mx-color-stroke-control-strong);
|
|
2243
2364
|
--mx-slider-tick-label-font-size: var(--mx-font-size-caption);
|
|
2365
|
+
--mx-sortable-gap: var(--mx-space-1);
|
|
2366
|
+
--mx-sortable-item-focus-glow: var(--mx-focus-ring-halo);
|
|
2367
|
+
--mx-sortable-item-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
2368
|
+
--mx-sortable-line-radius: var(--mx-radius-full);
|
|
2369
|
+
--mx-sortable-ghost-radius: var(--mx-radius-md);
|
|
2244
2370
|
--mx-spinner-gap: var(--mx-space-2);
|
|
2245
2371
|
--mx-spinner-cover-padding: var(--mx-space-4);
|
|
2246
2372
|
--mx-spinner-cover-background: var(--mx-color-bg-glass);
|
|
@@ -2253,6 +2379,23 @@
|
|
|
2253
2379
|
--mx-spinner-shape-size-sm: var(--mx-icon-size-md);
|
|
2254
2380
|
--mx-spinner-morph-duration: calc(var(--mx-motion-duration-slow) * 15);
|
|
2255
2381
|
--mx-spinner-spin-duration: calc(var(--mx-motion-duration-slow) * 9);
|
|
2382
|
+
--mx-stepper-font-size-sm: var(--mx-font-size-caption);
|
|
2383
|
+
--mx-stepper-font-size-md: var(--mx-font-size-body);
|
|
2384
|
+
--mx-stepper-description-font-size: var(--mx-font-size-caption);
|
|
2385
|
+
--mx-stepper-gap: var(--mx-space-2);
|
|
2386
|
+
--mx-stepper-line-gap: var(--mx-space-2);
|
|
2387
|
+
--mx-stepper-step-radius: var(--mx-radius-sm);
|
|
2388
|
+
--mx-stepper-step-hover-bg: var(--mx-color-fill-subtle-secondary);
|
|
2389
|
+
--mx-stepper-step-pressed-bg: var(--mx-color-fill-subtle-tertiary);
|
|
2390
|
+
--mx-stepper-step-focus-glow: var(--mx-focus-ring-halo);
|
|
2391
|
+
--mx-stepper-step-focus-outline-offset: var(--mx-focus-ring-offset);
|
|
2392
|
+
--mx-stepper-indicator-radius: var(--mx-radius-full);
|
|
2393
|
+
--mx-stepper-indicator-border-color: var(--mx-color-stroke-control-strong);
|
|
2394
|
+
--mx-stepper-indicator-font-size: var(--mx-font-size-caption);
|
|
2395
|
+
--mx-stepper-indicator-font-weight: var(--mx-font-weight-semibold);
|
|
2396
|
+
--mx-stepper-indicator-disabled-border-color: var(--mx-color-stroke-control-default);
|
|
2397
|
+
--mx-stepper-label-current-font-weight: var(--mx-font-weight-semibold);
|
|
2398
|
+
--mx-stepper-line-bg: var(--mx-color-stroke-control-secondary);
|
|
2256
2399
|
--mx-switch-thumb-inset: var(--mx-space-1);
|
|
2257
2400
|
--mx-switch-gap: var(--mx-space-2);
|
|
2258
2401
|
--mx-switch-text-padding: var(--mx-space-2);
|
|
@@ -2667,6 +2810,10 @@
|
|
|
2667
2810
|
--mx-window-footer-border-top-color: var(--mx-color-stroke-divider);
|
|
2668
2811
|
--mx-window-message-gap: var(--mx-space-3);
|
|
2669
2812
|
--mx-window-message-icon-size: var(--mx-icon-size-lg);
|
|
2813
|
+
--mx-wizard-gap: var(--mx-space-4);
|
|
2814
|
+
--mx-wizard-bar-gap: var(--mx-space-2);
|
|
2815
|
+
--mx-wizard-bar-padding-top: var(--mx-space-3);
|
|
2816
|
+
--mx-wizard-bar-border-top-color: var(--mx-color-stroke-divider);
|
|
2670
2817
|
--mx-accordion-container-color: var(--mx-color-fg-primary);
|
|
2671
2818
|
--mx-accordion-container-list-bg: var(--mx-color-bg-card);
|
|
2672
2819
|
--mx-accordion-item-separated-bg: var(--mx-color-bg-card);
|
|
@@ -2820,6 +2967,13 @@
|
|
|
2820
2967
|
--mx-calendar-cell-selected-bg: var(--mx-color-accent-solid);
|
|
2821
2968
|
--mx-calendar-cell-selected-color: var(--mx-color-accent-on-solid);
|
|
2822
2969
|
--mx-calendar-cell-selected-hover-bg: var(--mx-color-accent-solid);
|
|
2970
|
+
--mx-calendar-cell-range-start-bg: var(--mx-color-accent-solid);
|
|
2971
|
+
--mx-calendar-cell-range-start-color: var(--mx-color-accent-on-solid);
|
|
2972
|
+
--mx-calendar-cell-range-end-bg: var(--mx-color-accent-solid);
|
|
2973
|
+
--mx-calendar-cell-range-end-color: var(--mx-color-accent-on-solid);
|
|
2974
|
+
--mx-calendar-cell-range-single-bg: var(--mx-color-accent-solid);
|
|
2975
|
+
--mx-calendar-cell-range-single-color: var(--mx-color-accent-on-solid);
|
|
2976
|
+
--mx-calendar-cell-range-in-bg: var(--mx-color-accent-subtle);
|
|
2823
2977
|
--mx-calendar-cell-disabled-color: var(--mx-color-fg-disabled);
|
|
2824
2978
|
--mx-calendar-today-color: var(--mx-color-accent-fg);
|
|
2825
2979
|
--mx-calendar-today-focus-outline-width: var(--mx-focus-ring-width);
|
|
@@ -3005,6 +3159,10 @@
|
|
|
3005
3159
|
--mx-date-box-times-focus-outline-width: var(--mx-focus-ring-width);
|
|
3006
3160
|
--mx-date-box-times-focus-outline-color: var(--mx-focus-ring-color);
|
|
3007
3161
|
--mx-date-box-times-focus-outline-offset: calc(-1 * var(--mx-focus-ring-width));
|
|
3162
|
+
--mx-date-range-box-separator-bg: var(--mx-color-fg-tertiary);
|
|
3163
|
+
--mx-date-range-box-presets-focus-outline-width: var(--mx-focus-ring-width);
|
|
3164
|
+
--mx-date-range-box-presets-focus-outline-color: var(--mx-focus-ring-color);
|
|
3165
|
+
--mx-date-range-box-presets-focus-outline-offset: calc(-1 * var(--mx-focus-ring-width));
|
|
3008
3166
|
--mx-disabled-element-color: var(--mx-color-fg-disabled);
|
|
3009
3167
|
--mx-drawer-panel-bg: var(--mx-color-bg-surface);
|
|
3010
3168
|
--mx-drawer-panel-shadow: var(--mx-elevation-dialog);
|
|
@@ -3067,6 +3225,29 @@
|
|
|
3067
3225
|
--mx-field-button-disabled-color: var(--mx-color-fg-disabled);
|
|
3068
3226
|
--mx-field-foot-color: var(--mx-color-fg-secondary);
|
|
3069
3227
|
--mx-field-message-invalid-color: var(--mx-color-danger-fg);
|
|
3228
|
+
--mx-file-uploader-over-bg: var(--mx-color-accent-subtle);
|
|
3229
|
+
--mx-file-uploader-over-border-color: var(--mx-color-accent-solid);
|
|
3230
|
+
--mx-file-uploader-select-color: var(--mx-color-fg-primary);
|
|
3231
|
+
--mx-file-uploader-select-bg: var(--mx-color-fill-control-default);
|
|
3232
|
+
--mx-file-uploader-select-focus-outline-width: var(--mx-focus-ring-width);
|
|
3233
|
+
--mx-file-uploader-select-focus-outline-color: var(--mx-focus-ring-color);
|
|
3234
|
+
--mx-file-uploader-select-disabled-color: var(--mx-color-fg-disabled);
|
|
3235
|
+
--mx-file-uploader-upload-color: var(--mx-color-accent-on-solid);
|
|
3236
|
+
--mx-file-uploader-upload-bg: var(--mx-color-accent-solid);
|
|
3237
|
+
--mx-file-uploader-upload-border-color: var(--mx-color-accent-solid);
|
|
3238
|
+
--mx-file-uploader-upload-hover-bg: var(--mx-color-accent-solid-hover);
|
|
3239
|
+
--mx-file-uploader-upload-pressed-bg: var(--mx-color-accent-solid-hover);
|
|
3240
|
+
--mx-file-uploader-upload-focus-outline-width: var(--mx-focus-ring-width);
|
|
3241
|
+
--mx-file-uploader-upload-focus-outline-color: var(--mx-focus-ring-color);
|
|
3242
|
+
--mx-file-uploader-hint-color: var(--mx-color-fg-secondary);
|
|
3243
|
+
--mx-file-uploader-item-error-bg: var(--mx-color-danger-subtle);
|
|
3244
|
+
--mx-file-uploader-item-invalid-bg: var(--mx-color-danger-subtle);
|
|
3245
|
+
--mx-file-uploader-icon-bg: var(--mx-color-fg-secondary);
|
|
3246
|
+
--mx-file-uploader-name-color: var(--mx-color-fg-primary);
|
|
3247
|
+
--mx-file-uploader-size-color: var(--mx-color-fg-secondary);
|
|
3248
|
+
--mx-file-uploader-state-color: var(--mx-color-fg-secondary);
|
|
3249
|
+
--mx-file-uploader-state-done-color: var(--mx-color-success-fg);
|
|
3250
|
+
--mx-file-uploader-state-error-color: var(--mx-color-danger-fg);
|
|
3070
3251
|
--mx-filterbuilder-container-color: var(--mx-color-fg-primary);
|
|
3071
3252
|
--mx-layout-panel-card-bg: var(--mx-color-bg-card);
|
|
3072
3253
|
--mx-layout-panel-card-shadow: var(--mx-elevation-card);
|
|
@@ -3102,6 +3283,9 @@
|
|
|
3102
3283
|
--mx-listbox-keys-outline-width: var(--mx-focus-ring-width);
|
|
3103
3284
|
--mx-listbox-keys-outline-color: var(--mx-focus-ring-color);
|
|
3104
3285
|
--mx-listbox-keys-outline-offset: calc(-1 * var(--mx-focus-ring-width));
|
|
3286
|
+
--mx-load-panel-pane-shown-bg: var(--mx-color-bg-surface);
|
|
3287
|
+
--mx-load-panel-pane-shown-shadow: var(--mx-elevation-popup);
|
|
3288
|
+
--mx-load-panel-message-color: var(--mx-color-fg-primary);
|
|
3105
3289
|
--mx-lookup-header-color: var(--mx-color-fg-secondary);
|
|
3106
3290
|
--mx-menu-item-color: var(--mx-color-fg-primary);
|
|
3107
3291
|
--mx-menu-item-focus-outline-width: var(--mx-focus-ring-width);
|
|
@@ -3123,6 +3307,13 @@
|
|
|
3123
3307
|
--mx-menubar-item-focus-outline-width: var(--mx-focus-ring-width);
|
|
3124
3308
|
--mx-menubar-item-focus-outline-color: var(--mx-focus-ring-color);
|
|
3125
3309
|
--mx-pagination-info-color: var(--mx-color-fg-secondary);
|
|
3310
|
+
--mx-popover-surface-bg: var(--mx-color-bg-surface);
|
|
3311
|
+
--mx-popover-surface-shadow: var(--mx-elevation-popup);
|
|
3312
|
+
--mx-popover-surface-color: var(--mx-color-fg-primary);
|
|
3313
|
+
--mx-popover-surface-focus-outline-width: var(--mx-focus-ring-width);
|
|
3314
|
+
--mx-popover-surface-focus-outline-color: var(--mx-focus-ring-color);
|
|
3315
|
+
--mx-popover-arrow-bg: var(--mx-color-bg-surface);
|
|
3316
|
+
--mx-popover-title-color: var(--mx-color-fg-primary);
|
|
3126
3317
|
--mx-popup-list-item-radius: var(--mx-item-radius);
|
|
3127
3318
|
--mx-popup-surface-bg: var(--mx-color-bg-surface);
|
|
3128
3319
|
--mx-popup-surface-shadow: var(--mx-elevation-popup);
|
|
@@ -3252,6 +3443,11 @@
|
|
|
3252
3443
|
--mx-scheduler-swipe-edge-shadow: var(--mx-elevation-card);
|
|
3253
3444
|
--mx-scheduler-swipe-edge-ready-bg: var(--mx-color-accent-solid);
|
|
3254
3445
|
--mx-scheduler-swipe-edge-ready-color: var(--mx-color-accent-on-solid);
|
|
3446
|
+
--mx-scroll-view-box-focus-outline-width: var(--mx-focus-ring-width);
|
|
3447
|
+
--mx-scroll-view-box-focus-outline-color: var(--mx-focus-ring-color);
|
|
3448
|
+
--mx-scroll-view-pull-color: var(--mx-color-fg-secondary);
|
|
3449
|
+
--mx-scroll-view-pull-refreshing-color: var(--mx-color-fg-primary);
|
|
3450
|
+
--mx-scroll-view-bottom-color: var(--mx-color-fg-secondary);
|
|
3255
3451
|
--mx-sheet-panel-bg: var(--mx-color-bg-surface);
|
|
3256
3452
|
--mx-sheet-panel-shadow: var(--mx-elevation-dialog);
|
|
3257
3453
|
--mx-sheet-panel-color: var(--mx-color-fg-primary);
|
|
@@ -3275,6 +3471,11 @@
|
|
|
3275
3471
|
--mx-slider-bubble-bg: var(--mx-color-accent-solid);
|
|
3276
3472
|
--mx-slider-tick-label-color: var(--mx-color-fg-secondary);
|
|
3277
3473
|
--mx-slider-tick-label-disabled-color: var(--mx-color-fg-disabled);
|
|
3474
|
+
--mx-sortable-container-target-bg: var(--mx-color-accent-subtle);
|
|
3475
|
+
--mx-sortable-item-focus-outline-width: var(--mx-focus-ring-width);
|
|
3476
|
+
--mx-sortable-item-focus-outline-color: var(--mx-focus-ring-color);
|
|
3477
|
+
--mx-sortable-line-bg: var(--mx-color-accent-solid);
|
|
3478
|
+
--mx-sortable-ghost-shadow: var(--mx-elevation-popup);
|
|
3278
3479
|
--mx-spinner-fg: var(--mx-color-fg-secondary);
|
|
3279
3480
|
--mx-spinner-accent: var(--mx-color-accent-solid);
|
|
3280
3481
|
--mx-spinner-neutral: var(--mx-color-fg-secondary);
|
|
@@ -3285,6 +3486,31 @@
|
|
|
3285
3486
|
--mx-spinner-focus-width: var(--mx-focus-ring-width);
|
|
3286
3487
|
--mx-spinner-focus-offset: calc(var(--mx-focus-ring-width) * -1);
|
|
3287
3488
|
--mx-spinner-focus-color: var(--mx-focus-ring-color);
|
|
3489
|
+
--mx-stepper-step-color: var(--mx-color-fg-secondary);
|
|
3490
|
+
--mx-stepper-step-focus-outline-width: var(--mx-focus-ring-width);
|
|
3491
|
+
--mx-stepper-step-focus-outline-color: var(--mx-focus-ring-color);
|
|
3492
|
+
--mx-stepper-step-disabled-color: var(--mx-color-fg-disabled);
|
|
3493
|
+
--mx-stepper-step-current-color: var(--mx-color-fg-primary);
|
|
3494
|
+
--mx-stepper-step-done-color: var(--mx-color-fg-primary);
|
|
3495
|
+
--mx-stepper-indicator-bg: var(--mx-color-fill-control-default);
|
|
3496
|
+
--mx-stepper-indicator-color: var(--mx-color-fg-secondary);
|
|
3497
|
+
--mx-stepper-indicator-current-bg: var(--mx-color-accent-solid);
|
|
3498
|
+
--mx-stepper-indicator-current-border-color: var(--mx-color-accent-solid);
|
|
3499
|
+
--mx-stepper-indicator-current-color: var(--mx-color-accent-on-solid);
|
|
3500
|
+
--mx-stepper-indicator-done-bg: var(--mx-color-accent-solid);
|
|
3501
|
+
--mx-stepper-indicator-done-border-color: var(--mx-color-accent-solid);
|
|
3502
|
+
--mx-stepper-indicator-done-color: var(--mx-color-accent-on-solid);
|
|
3503
|
+
--mx-stepper-indicator-error-bg: var(--mx-color-danger-solid);
|
|
3504
|
+
--mx-stepper-indicator-error-border-color: var(--mx-color-danger-solid);
|
|
3505
|
+
--mx-stepper-indicator-error-color: var(--mx-color-danger-on-solid);
|
|
3506
|
+
--mx-stepper-indicator-disabled-color: var(--mx-color-fg-disabled);
|
|
3507
|
+
--mx-stepper-mark-done-bg: var(--mx-color-accent-on-solid);
|
|
3508
|
+
--mx-stepper-mark-error-bg: var(--mx-color-danger-on-solid);
|
|
3509
|
+
--mx-stepper-label-error-color: var(--mx-color-danger-fg);
|
|
3510
|
+
--mx-stepper-description-color: var(--mx-color-fg-secondary);
|
|
3511
|
+
--mx-stepper-description-disabled-color: var(--mx-color-fg-disabled);
|
|
3512
|
+
--mx-stepper-note-color: var(--mx-color-fg-secondary);
|
|
3513
|
+
--mx-stepper-line-done-bg: var(--mx-color-accent-solid);
|
|
3288
3514
|
--mx-switch-track-bg: var(--mx-color-fill-control-default);
|
|
3289
3515
|
--mx-switch-track-checked-bg: var(--mx-color-accent-solid);
|
|
3290
3516
|
--mx-switch-track-checked-border-color: var(--mx-color-accent-solid);
|
|
@@ -3516,6 +3742,7 @@
|
|
|
3516
3742
|
--mx-button-group-item-face-toggled-color: var(--mx-color-accent-on-subtle);
|
|
3517
3743
|
--mx-button-group-item-face-outline-toggled-color: var(--mx-color-accent-on-subtle);
|
|
3518
3744
|
--mx-button-group-item-face-ghost-toggled-color: var(--mx-color-accent-on-subtle);
|
|
3745
|
+
--mx-calendar-cell-range-in-color: var(--mx-color-accent-on-subtle);
|
|
3519
3746
|
--mx-card-card-filled-bg: var(--mx-color-fill-neutral);
|
|
3520
3747
|
--mx-chip-chip-bg: var(--mx-color-fill-neutral);
|
|
3521
3748
|
--mx-chip-chip-accent-color: var(--mx-color-accent-on-subtle);
|
|
@@ -3637,6 +3864,9 @@
|
|
|
3637
3864
|
--mx-number-box-spin-layout: inline;
|
|
3638
3865
|
--mx-number-box-glyph-inline-up-icon: initial;
|
|
3639
3866
|
--mx-number-box-glyph-inline-down-icon: initial;
|
|
3867
|
+
--mx-popover-enter-offset: 10px;
|
|
3868
|
+
--mx-popover-header-border-bottom-width: initial;
|
|
3869
|
+
--mx-popover-header-border-bottom-color: initial;
|
|
3640
3870
|
--mx-popup-list-box-box-disabled-shadow: 0px 0px 0px 0px rgb(0 0 0 / 0);
|
|
3641
3871
|
--mx-popup-list-item-height: 2.25rem;
|
|
3642
3872
|
--mx-popup-list-box-space-box-padding-block: 0px;
|
|
@@ -3721,6 +3951,9 @@
|
|
|
3721
3951
|
--mx-spinner-ring-width-md: 0.25rem;
|
|
3722
3952
|
--mx-spinner-track-color: rgb(0 0 0 / 0);
|
|
3723
3953
|
--mx-spinner-shape-size-md: 2rem;
|
|
3954
|
+
--mx-stepper-size-sm: 1.25rem;
|
|
3955
|
+
--mx-stepper-size-md: 1.5rem;
|
|
3956
|
+
--mx-stepper-size-lg: 2rem;
|
|
3724
3957
|
--mx-switch-gap: 0.625rem;
|
|
3725
3958
|
--mx-switch-track-disabled-bg: rgb(0 0 0 / 0);
|
|
3726
3959
|
--mx-tabdocs-tab-title-bg: rgb(0 0 0 / 0);
|
|
@@ -3891,6 +4124,7 @@
|
|
|
3891
4124
|
--mx-slider-core-disabled-bg: var(--mx-color-fill-accent-disabled);
|
|
3892
4125
|
--mx-slider-bubble-border-width: var(--mx-border-width-1);
|
|
3893
4126
|
--mx-slider-bubble-border-color: var(--mx-color-stroke-card);
|
|
4127
|
+
--mx-sortable-ghost-radius: var(--mx-radius-sm);
|
|
3894
4128
|
--mx-switch-track-bg: var(--mx-color-fill-subtle-tertiary);
|
|
3895
4129
|
--mx-switch-track-hover-bg: var(--mx-color-fill-subtle-secondary);
|
|
3896
4130
|
--mx-switch-track-pressed-bg: var(--mx-color-stroke-control-default);
|
|
@@ -4136,6 +4370,7 @@
|
|
|
4136
4370
|
--mx-field-indicator-readonly-invalid-focus-shadow: initial;
|
|
4137
4371
|
--mx-field-indicator-filled-readonly-invalid-focus-shadow: initial;
|
|
4138
4372
|
--mx-field-indicator-underline-readonly-invalid-focus-shadow: initial;
|
|
4373
|
+
--mx-file-uploader-select-bg: initial;
|
|
4139
4374
|
--mx-list-item-active-color: initial;
|
|
4140
4375
|
--mx-listbox-field-box-shadow: 0px 0px 0px 0px rgb(0 0 0 / 0);
|
|
4141
4376
|
--mx-listbox-field-frame-border-color: rgb(0 0 0 / 0);
|
|
@@ -4146,6 +4381,15 @@
|
|
|
4146
4381
|
--mx-listbox-field-indicator-invalid-focus-shadow: none;
|
|
4147
4382
|
--mx-listbox-field-indicator-readonly-focus-shadow: none;
|
|
4148
4383
|
--mx-listbox-field-indicator-readonly-invalid-focus-shadow: none;
|
|
4384
|
+
--mx-load-panel-pane-shown-border-width: initial;
|
|
4385
|
+
--mx-load-panel-pane-shown-border-color: initial;
|
|
4386
|
+
--mx-popover-enter-offset: 6px;
|
|
4387
|
+
--mx-popover-surface-border-width: initial;
|
|
4388
|
+
--mx-popover-surface-border-color: initial;
|
|
4389
|
+
--mx-popover-arrow-border-width: initial;
|
|
4390
|
+
--mx-popover-arrow-border-color: initial;
|
|
4391
|
+
--mx-popover-header-border-bottom-width: initial;
|
|
4392
|
+
--mx-popover-header-border-bottom-color: initial;
|
|
4149
4393
|
--mx-popup-list-box-box-disabled-shadow: 0px 0px 0px 0px rgb(0 0 0 / 0);
|
|
4150
4394
|
--mx-radiogroup-size-sm: 1rem;
|
|
4151
4395
|
--mx-radiogroup-size-md: 1.125rem;
|
|
@@ -4175,6 +4419,15 @@
|
|
|
4175
4419
|
--mx-scheduler-swipe-edge-border-color: initial;
|
|
4176
4420
|
--mx-sheet-list-box-box-disabled-shadow: 0px 0px 0px 0px rgb(0 0 0 / 0);
|
|
4177
4421
|
--mx-skeleton-animation: pulse;
|
|
4422
|
+
--mx-stepper-padding-sm: 0.375rem;
|
|
4423
|
+
--mx-stepper-padding-md: 0.5rem;
|
|
4424
|
+
--mx-stepper-padding-lg: 0.625rem;
|
|
4425
|
+
--mx-stepper-indicator-current-border-color: initial;
|
|
4426
|
+
--mx-stepper-indicator-done-border-color: initial;
|
|
4427
|
+
--mx-stepper-indicator-error-border-color: initial;
|
|
4428
|
+
--mx-stepper-indicator-disabled-border-color: initial;
|
|
4429
|
+
--mx-stepper-indicator-border-width: initial;
|
|
4430
|
+
--mx-stepper-indicator-border-color: initial;
|
|
4178
4431
|
--mx-switch-track-height-md: 1.375rem;
|
|
4179
4432
|
--mx-tabdocs-indicator-height: 3px;
|
|
4180
4433
|
--mx-tabdocs-autohide-indicator-height: 3px;
|
|
@@ -4185,6 +4438,8 @@
|
|
|
4185
4438
|
--mx-treeview-spinner-duration: 1080ms;
|
|
4186
4439
|
--mx-treeview-search-variant: filled;
|
|
4187
4440
|
--mx-window-bar-dialog-color: initial;
|
|
4441
|
+
--mx-wizard-bar-border-top-width: initial;
|
|
4442
|
+
--mx-wizard-bar-border-top-color: initial;
|
|
4188
4443
|
--mx-accordion-content-padding: var(--mx-space-5);
|
|
4189
4444
|
--mx-accordion-container-separated-gap: var(--mx-space-3);
|
|
4190
4445
|
--mx-avatar-square-radius-xs: var(--mx-radius-sm);
|
|
@@ -4207,6 +4462,7 @@
|
|
|
4207
4462
|
--mx-combo-box-field-frame-focus-border-width: var(--mx-border-width-2);
|
|
4208
4463
|
--mx-combo-box-field-frame-border-bottom-color: var(--mx-color-stroke-control-strong);
|
|
4209
4464
|
--mx-date-box-calendar-container-padding: var(--mx-space-3);
|
|
4465
|
+
--mx-date-range-box-calendar-container-padding: var(--mx-space-3);
|
|
4210
4466
|
--mx-drawer-panel-start-radius-end: var(--mx-radius-xl);
|
|
4211
4467
|
--mx-drawer-panel-end-radius-start: var(--mx-radius-xl);
|
|
4212
4468
|
--mx-drawer-panel-top-radius-bottom: var(--mx-radius-xl);
|
|
@@ -4250,6 +4506,9 @@
|
|
|
4250
4506
|
--mx-field-frame-readonly-invalid-focus-border-width: var(--mx-border-width-2);
|
|
4251
4507
|
--mx-field-frame-filled-readonly-invalid-focus-border-width: var(--mx-border-width-2);
|
|
4252
4508
|
--mx-field-frame-underline-readonly-invalid-focus-border-width: var(--mx-border-width-2);
|
|
4509
|
+
--mx-file-uploader-select-radius: var(--mx-radius-md);
|
|
4510
|
+
--mx-file-uploader-upload-radius: var(--mx-radius-md);
|
|
4511
|
+
--mx-file-uploader-item-radius: var(--mx-radius-md);
|
|
4253
4512
|
--mx-form-layout-row-gap: var(--mx-space-5);
|
|
4254
4513
|
--mx-form-layout-column-gap: var(--mx-space-6);
|
|
4255
4514
|
--mx-form-layout-group-padding: var(--mx-space-5);
|
|
@@ -4297,6 +4556,10 @@
|
|
|
4297
4556
|
--mx-skeleton-duration: calc(var(--mx-motion-duration-slow) * 4);
|
|
4298
4557
|
--mx-skeleton-bone-text-radius: var(--mx-radius-sm);
|
|
4299
4558
|
--mx-skeleton-bone-rect-radius: var(--mx-radius-lg);
|
|
4559
|
+
--mx-sortable-ghost-radius: var(--mx-radius-lg);
|
|
4560
|
+
--mx-stepper-step-radius: var(--mx-radius-md);
|
|
4561
|
+
--mx-stepper-line-radius: var(--mx-radius-full);
|
|
4562
|
+
--mx-stepper-line-bg: var(--mx-color-stroke-divider);
|
|
4300
4563
|
--mx-switch-gap: var(--mx-space-3);
|
|
4301
4564
|
--mx-tabs-pill-gap: var(--mx-space-2);
|
|
4302
4565
|
--mx-tabs-panel-padding: var(--mx-space-5);
|
|
@@ -4324,6 +4587,10 @@
|
|
|
4324
4587
|
--mx-scheduler-appointment-lifted-shadow: var(--mx-elevation-popup);
|
|
4325
4588
|
--mx-scheduler-swipe-edge-bg: var(--mx-color-accent-subtle);
|
|
4326
4589
|
--mx-scheduler-swipe-edge-shadow: var(--mx-elevation-popup);
|
|
4590
|
+
--mx-stepper-indicator-done-bg: var(--mx-color-accent-subtle);
|
|
4591
|
+
--mx-stepper-indicator-error-bg: var(--mx-color-danger-subtle);
|
|
4592
|
+
--mx-stepper-indicator-error-color: var(--mx-color-danger-fg);
|
|
4593
|
+
--mx-stepper-mark-error-bg: var(--mx-color-danger-fg);
|
|
4327
4594
|
--mx-recurrence-editor-day-button-face-toggled-bg: var(--mx-color-selection-bg);
|
|
4328
4595
|
--mx-recurrence-editor-day-button-face-toggled-color: var(--mx-color-selection-fg);
|
|
4329
4596
|
--mx-recurrence-editor-day-button-face-toggled-hover-bg: var(--mx-color-selection-bg);
|
|
@@ -4332,6 +4599,9 @@
|
|
|
4332
4599
|
--mx-recurrence-editor-day-button-face-outline-toggled-border-color: var(--mx-color-selection-bg);
|
|
4333
4600
|
--mx-recurrence-editor-day-button-face-outline-toggled-hover-bg: var(--mx-color-selection-bg);
|
|
4334
4601
|
--mx-scheduler-swipe-edge-color: var(--mx-color-accent-on-subtle);
|
|
4602
|
+
--mx-stepper-indicator-bg: var(--mx-color-fill-neutral);
|
|
4603
|
+
--mx-stepper-indicator-done-color: var(--mx-color-accent-on-subtle);
|
|
4604
|
+
--mx-stepper-mark-done-bg: var(--mx-color-accent-on-subtle);
|
|
4335
4605
|
}
|
|
4336
4606
|
}
|
|
4337
4607
|
|
|
@@ -4361,6 +4631,12 @@
|
|
|
4361
4631
|
--mx-listbox-field-indicator-invalid-focus-shadow: none;
|
|
4362
4632
|
--mx-listbox-field-indicator-readonly-focus-shadow: none;
|
|
4363
4633
|
--mx-listbox-field-indicator-readonly-invalid-focus-shadow: none;
|
|
4634
|
+
--mx-popover-enter-offset: 6px;
|
|
4635
|
+
--mx-popover-arrow-display: initial;
|
|
4636
|
+
--mx-popover-arrow-size: initial;
|
|
4637
|
+
--mx-popover-arrow-bg: initial;
|
|
4638
|
+
--mx-popover-arrow-border-width: initial;
|
|
4639
|
+
--mx-popover-arrow-border-color: initial;
|
|
4364
4640
|
--mx-recurrence-editor-day-button-variant: outline;
|
|
4365
4641
|
--mx-scheduler-timeline-cell-width: 4.5rem;
|
|
4366
4642
|
--mx-scheduler-timeline-lane-size: 2rem;
|
|
@@ -4377,6 +4653,16 @@
|
|
|
4377
4653
|
--mx-scheduler-swipe-edge-border-color: initial;
|
|
4378
4654
|
--mx-scheduler-unavailable-display: initial;
|
|
4379
4655
|
--mx-scheduler-unavailable-image: initial;
|
|
4656
|
+
--mx-sortable-line-height: 1px;
|
|
4657
|
+
--mx-stepper-size-md: 1.875rem;
|
|
4658
|
+
--mx-stepper-size-lg: 2.375rem;
|
|
4659
|
+
--mx-stepper-padding-sm: 0.375rem;
|
|
4660
|
+
--mx-stepper-padding-md: 0.5rem;
|
|
4661
|
+
--mx-stepper-padding-lg: 0.625rem;
|
|
4662
|
+
--mx-stepper-indicator-done-bg: initial;
|
|
4663
|
+
--mx-stepper-indicator-error-bg: initial;
|
|
4664
|
+
--mx-stepper-indicator-disabled-border-color: initial;
|
|
4665
|
+
--mx-stepper-line-height: 1px;
|
|
4380
4666
|
--mx-treeview-spinner-duration: 960ms;
|
|
4381
4667
|
--mx-window-bar-dialog-color: initial;
|
|
4382
4668
|
--mx-avatar-square-radius-sm: var(--mx-radius-xs);
|
|
@@ -4384,6 +4670,12 @@
|
|
|
4384
4670
|
--mx-avatar-square-radius-lg: var(--mx-radius-sm);
|
|
4385
4671
|
--mx-avatar-square-radius-xl: var(--mx-radius-md);
|
|
4386
4672
|
--mx-breadcrumb-link-radius: var(--mx-radius-full);
|
|
4673
|
+
--mx-file-uploader-select-radius: var(--mx-radius-md);
|
|
4674
|
+
--mx-file-uploader-select-font-weight: var(--mx-font-weight-medium);
|
|
4675
|
+
--mx-file-uploader-upload-radius: var(--mx-radius-md);
|
|
4676
|
+
--mx-file-uploader-upload-font-weight: var(--mx-font-weight-medium);
|
|
4677
|
+
--mx-file-uploader-item-radius: var(--mx-radius-md);
|
|
4678
|
+
--mx-popover-title-font-weight: var(--mx-font-weight-medium);
|
|
4387
4679
|
--mx-recurrence-editor-day-button-face-radius: var(--mx-radius-full);
|
|
4388
4680
|
--mx-recurrence-editor-day-button-face-padding-inline: var(--mx-space-2);
|
|
4389
4681
|
--mx-recurrence-editor-days-gap: var(--mx-space-2);
|
|
@@ -4408,6 +4700,12 @@
|
|
|
4408
4700
|
--mx-scheduler-agenda-row-radius: var(--mx-radius-md);
|
|
4409
4701
|
--mx-scheduler-agenda-content-gap: var(--mx-space-3);
|
|
4410
4702
|
--mx-scheduler-agenda-text-font-weight: var(--mx-font-weight-regular);
|
|
4703
|
+
--mx-sortable-ghost-radius: var(--mx-radius-lg);
|
|
4704
|
+
--mx-stepper-step-radius: var(--mx-radius-md);
|
|
4705
|
+
--mx-stepper-indicator-border-color: var(--mx-color-stroke-control-default);
|
|
4706
|
+
--mx-stepper-indicator-font-weight: var(--mx-font-weight-medium);
|
|
4707
|
+
--mx-stepper-label-current-font-weight: var(--mx-font-weight-medium);
|
|
4708
|
+
--mx-stepper-line-bg: var(--mx-color-stroke-divider);
|
|
4411
4709
|
--mx-combo-box-field-box-bg: var(--mx-color-fill-control-tertiary);
|
|
4412
4710
|
--mx-combo-box-field-box-hover-bg: var(--mx-color-fill-control-default);
|
|
4413
4711
|
--mx-combo-box-field-box-focus-bg: var(--mx-color-fill-control-tertiary);
|
|
@@ -4438,6 +4736,10 @@
|
|
|
4438
4736
|
--mx-scheduler-resize-grip-shadow: var(--mx-elevation-card);
|
|
4439
4737
|
--mx-scheduler-swipe-edge-shadow: var(--mx-elevation-window);
|
|
4440
4738
|
--mx-scheduler-swipe-edge-ready-bg: var(--mx-color-accent-subtle);
|
|
4739
|
+
--mx-stepper-indicator-done-color: var(--mx-color-accent-fg);
|
|
4740
|
+
--mx-stepper-indicator-error-color: var(--mx-color-danger-fg);
|
|
4741
|
+
--mx-stepper-mark-done-bg: var(--mx-color-accent-fg);
|
|
4742
|
+
--mx-stepper-mark-error-bg: var(--mx-color-danger-fg);
|
|
4441
4743
|
--mx-tabdocs-menu-search-box-bg: var(--mx-color-fill-control-tertiary);
|
|
4442
4744
|
--mx-recurrence-editor-day-button-face-toggled-bg: var(--mx-color-selection-bg);
|
|
4443
4745
|
--mx-recurrence-editor-day-button-face-toggled-color: var(--mx-color-selection-fg);
|
|
@@ -4630,6 +4932,7 @@
|
|
|
4630
4932
|
--mx-field-label-floating-color: initial;
|
|
4631
4933
|
--mx-field-button-hover-color: initial;
|
|
4632
4934
|
--mx-field-button-pressed-color: initial;
|
|
4935
|
+
--mx-file-uploader-select-bg: initial;
|
|
4633
4936
|
--mx-form-layout-caption-float: inline-start;
|
|
4634
4937
|
--mx-form-layout-group-border-width: initial;
|
|
4635
4938
|
--mx-form-layout-group-border-color: initial;
|
|
@@ -4654,11 +4957,24 @@
|
|
|
4654
4957
|
--mx-listbox-check-radius: 2px;
|
|
4655
4958
|
--mx-listbox-check-disabled-bg: rgb(0 0 0 / 0);
|
|
4656
4959
|
--mx-listbox-check-bg: initial;
|
|
4960
|
+
--mx-load-panel-cancel-variant: ghost;
|
|
4961
|
+
--mx-load-panel-pane-shown-border-width: initial;
|
|
4962
|
+
--mx-load-panel-pane-shown-border-color: initial;
|
|
4657
4963
|
--mx-menu-item-height: 2.75rem;
|
|
4658
4964
|
--mx-menu-panel-gap: 2px;
|
|
4659
4965
|
--mx-menu-check-disabled-color: currentcolor;
|
|
4660
4966
|
--mx-menu-icon-disabled-color: currentcolor;
|
|
4661
4967
|
--mx-menubar-bar-radius: initial;
|
|
4968
|
+
--mx-popover-enter-offset: 0px;
|
|
4969
|
+
--mx-popover-surface-border-width: initial;
|
|
4970
|
+
--mx-popover-surface-border-color: initial;
|
|
4971
|
+
--mx-popover-header-border-bottom-width: initial;
|
|
4972
|
+
--mx-popover-header-border-bottom-color: initial;
|
|
4973
|
+
--mx-popover-arrow-display: initial;
|
|
4974
|
+
--mx-popover-arrow-size: initial;
|
|
4975
|
+
--mx-popover-arrow-bg: initial;
|
|
4976
|
+
--mx-popover-arrow-border-width: initial;
|
|
4977
|
+
--mx-popover-arrow-border-color: initial;
|
|
4662
4978
|
--mx-popup-list-box-box-disabled-shadow: 0px 0px 0px 0px rgb(0 0 0 / 0);
|
|
4663
4979
|
--mx-popup-list-container-padding-block: 0px;
|
|
4664
4980
|
--mx-popup-list-box-space-box-padding-block: 0px;
|
|
@@ -4835,6 +5151,23 @@
|
|
|
4835
5151
|
--mx-spinner-ring-display: none;
|
|
4836
5152
|
--mx-spinner-shape-display: block;
|
|
4837
5153
|
--mx-spinner-shape-contained-scale: 0.8;
|
|
5154
|
+
--mx-stepper-size-sm: 1.25rem;
|
|
5155
|
+
--mx-stepper-size-md: 1.5rem;
|
|
5156
|
+
--mx-stepper-size-lg: 2rem;
|
|
5157
|
+
--mx-stepper-padding-sm: 0.375rem;
|
|
5158
|
+
--mx-stepper-padding-md: 0.5rem;
|
|
5159
|
+
--mx-stepper-padding-lg: 0.75rem;
|
|
5160
|
+
--mx-stepper-step-radius: initial;
|
|
5161
|
+
--mx-stepper-indicator-current-border-color: initial;
|
|
5162
|
+
--mx-stepper-indicator-done-border-color: initial;
|
|
5163
|
+
--mx-stepper-indicator-error-border-color: initial;
|
|
5164
|
+
--mx-stepper-indicator-disabled-border-color: initial;
|
|
5165
|
+
--mx-stepper-indicator-border-width: initial;
|
|
5166
|
+
--mx-stepper-indicator-border-color: initial;
|
|
5167
|
+
--mx-stepper-mark-error-icon: var(--mx-icon-caution);
|
|
5168
|
+
--mx-stepper-label-current-font-weight: initial;
|
|
5169
|
+
--mx-stepper-line-height: 1px;
|
|
5170
|
+
--mx-stepper-line-done-bg: initial;
|
|
4838
5171
|
--mx-switch-track-width-sm: 2.75rem;
|
|
4839
5172
|
--mx-switch-track-width-md: 3.25rem;
|
|
4840
5173
|
--mx-switch-track-width-lg: 3.75rem;
|
|
@@ -4909,6 +5242,9 @@
|
|
|
4909
5242
|
--mx-window-footer-padding-block: initial;
|
|
4910
5243
|
--mx-window-footer-padding-inline: initial;
|
|
4911
5244
|
--mx-window-message-icon-size: 1.5rem;
|
|
5245
|
+
--mx-wizard-previous-variant: ghost;
|
|
5246
|
+
--mx-wizard-bar-border-top-width: initial;
|
|
5247
|
+
--mx-wizard-bar-border-top-color: initial;
|
|
4912
5248
|
--mx-accordion-height-sm: var(--mx-control-height-md);
|
|
4913
5249
|
--mx-accordion-height-md: var(--mx-control-height-lg);
|
|
4914
5250
|
--mx-accordion-padding-sm: var(--mx-space-3);
|
|
@@ -5041,6 +5377,11 @@
|
|
|
5041
5377
|
--mx-field-frame-underline-readonly-border-bottom-color: var(--mx-color-stroke-control-default);
|
|
5042
5378
|
--mx-field-indicator-radius: calc(0.25rem - var(--mx-border-width-1));
|
|
5043
5379
|
--mx-field-button-radius: var(--mx-radius-full);
|
|
5380
|
+
--mx-file-uploader-select-radius: var(--mx-radius-full);
|
|
5381
|
+
--mx-file-uploader-select-font-weight: var(--mx-font-weight-medium);
|
|
5382
|
+
--mx-file-uploader-upload-radius: var(--mx-radius-full);
|
|
5383
|
+
--mx-file-uploader-upload-font-weight: var(--mx-font-weight-medium);
|
|
5384
|
+
--mx-file-uploader-item-radius: var(--mx-radius-full);
|
|
5044
5385
|
--mx-form-layout-group-radius: var(--mx-radius-md);
|
|
5045
5386
|
--mx-form-layout-caption-font-weight: var(--mx-font-weight-medium);
|
|
5046
5387
|
--mx-layout-panel-outline-radius: var(--mx-radius-md);
|
|
@@ -5074,6 +5415,8 @@
|
|
|
5074
5415
|
--mx-menubar-item-padding-inline: var(--mx-space-3);
|
|
5075
5416
|
--mx-menubar-item-radius: var(--mx-radius-full);
|
|
5076
5417
|
--mx-menubar-item-pressed-bg: var(--mx-color-fill-subtle-tertiary);
|
|
5418
|
+
--mx-popover-surface-radius: var(--mx-radius-md);
|
|
5419
|
+
--mx-popover-title-font-weight: var(--mx-font-weight-medium);
|
|
5077
5420
|
--mx-popup-with-list-surface-padding-block: var(--mx-space-2);
|
|
5078
5421
|
--mx-popup-list-item-height: var(--mx-space-12);
|
|
5079
5422
|
--mx-popup-list-container-padding-inline: var(--mx-space-1);
|
|
@@ -5138,6 +5481,8 @@
|
|
|
5138
5481
|
--mx-slider-tick-radius: var(--mx-radius-full);
|
|
5139
5482
|
--mx-slider-stop-radius: var(--mx-radius-full);
|
|
5140
5483
|
--mx-spinner-box-contained-radius: var(--mx-radius-full);
|
|
5484
|
+
--mx-stepper-indicator-font-weight: var(--mx-font-weight-medium);
|
|
5485
|
+
--mx-stepper-line-bg: var(--mx-color-stroke-divider);
|
|
5141
5486
|
--mx-switch-gap: var(--mx-space-3);
|
|
5142
5487
|
--mx-switch-track-border-width: var(--mx-border-width-2);
|
|
5143
5488
|
--mx-switch-thumb-bg: var(--mx-color-stroke-control-strong);
|
|
@@ -5347,6 +5692,11 @@
|
|
|
5347
5692
|
--mx-slider-tick-label-disabled-color: var(--mx-color-fg-on-accent-disabled);
|
|
5348
5693
|
--mx-slider-stop-active-bg: var(--mx-color-accent-on-solid);
|
|
5349
5694
|
--mx-spinner-box-contained-bg: var(--mx-color-accent-subtle);
|
|
5695
|
+
--mx-stepper-indicator-bg: var(--mx-color-fg-secondary);
|
|
5696
|
+
--mx-stepper-indicator-color: var(--mx-color-bg-canvas);
|
|
5697
|
+
--mx-stepper-indicator-error-bg: var(--mx-color-danger-subtle);
|
|
5698
|
+
--mx-stepper-indicator-error-color: var(--mx-color-danger-fg);
|
|
5699
|
+
--mx-stepper-mark-error-bg: var(--mx-color-danger-fg);
|
|
5350
5700
|
--mx-switch-track-pressed-bg: var(--mx-color-fill-control-default);
|
|
5351
5701
|
--mx-switch-track-checked-pressed-bg: var(--mx-color-accent-solid);
|
|
5352
5702
|
--mx-switch-track-disabled-border-color: var(--mx-color-fill-control-disabled);
|
|
@@ -5430,6 +5780,7 @@
|
|
|
5430
5780
|
--mx-slider-stop-bg: var(--mx-color-selection-fg);
|
|
5431
5781
|
--mx-spinner-track-color: var(--mx-color-selection-bg);
|
|
5432
5782
|
--mx-spinner-shape-contained-bg: var(--mx-color-accent-on-subtle);
|
|
5783
|
+
--mx-stepper-indicator-disabled-bg: var(--mx-color-fill-neutral);
|
|
5433
5784
|
--mx-tabs-tab-pill-selected-bg: var(--mx-color-selection-bg);
|
|
5434
5785
|
--mx-toast-action-face-bg: var(--mx-color-selection-bg);
|
|
5435
5786
|
--mx-toast-action-face-hover-bg: var(--mx-color-selection-bg);
|
|
@@ -5930,6 +6281,15 @@
|
|
|
5930
6281
|
--_calendar-cell-selected-shadow: var(--mx-calendar-cell-selected-shadow);
|
|
5931
6282
|
--_calendar-cell-selected-color: var(--mx-calendar-cell-selected-color);
|
|
5932
6283
|
--_calendar-cell-selected-hover-bg: var(--mx-calendar-cell-selected-hover-bg);
|
|
6284
|
+
--_calendar-cell-range-start-bg: var(--mx-calendar-cell-range-start-bg);
|
|
6285
|
+
--_calendar-cell-range-start-color: var(--mx-calendar-cell-range-start-color);
|
|
6286
|
+
--_calendar-cell-range-end-bg: var(--mx-calendar-cell-range-end-bg);
|
|
6287
|
+
--_calendar-cell-range-end-color: var(--mx-calendar-cell-range-end-color);
|
|
6288
|
+
--_calendar-cell-range-single-bg: var(--mx-calendar-cell-range-single-bg);
|
|
6289
|
+
--_calendar-cell-range-single-color: var(--mx-calendar-cell-range-single-color);
|
|
6290
|
+
--_calendar-cell-range-in-bg: var(--mx-calendar-cell-range-in-bg);
|
|
6291
|
+
--_calendar-cell-range-in-color: var(--mx-calendar-cell-range-in-color);
|
|
6292
|
+
--_calendar-cell-range-in-radius: var(--mx-calendar-cell-range-in-radius);
|
|
5933
6293
|
--_calendar-cell-disabled-color: var(--mx-calendar-cell-disabled-color);
|
|
5934
6294
|
--_calendar-today-padding-block: var(--mx-calendar-today-padding-block);
|
|
5935
6295
|
--_calendar-today-padding-inline: var(--mx-calendar-today-padding-inline);
|
|
@@ -6552,6 +6912,23 @@
|
|
|
6552
6912
|
--_date-box-times-beside-border-start-color: var(--mx-date-box-times-beside-border-start-color);
|
|
6553
6913
|
}
|
|
6554
6914
|
|
|
6915
|
+
.mx-date-range-box, .mx-date-range-box__popup {
|
|
6916
|
+
--_date-range-box-popup-gap: var(--mx-date-range-box-popup-gap);
|
|
6917
|
+
--_date-range-box-separator-icon: var(--mx-date-range-box-separator-icon);
|
|
6918
|
+
--_date-range-box-separator-bg: var(--mx-date-range-box-separator-bg);
|
|
6919
|
+
--_date-range-box-separator-size: var(--mx-date-range-box-separator-size);
|
|
6920
|
+
--_date-range-box-separator-margin-inline: var(--mx-date-range-box-separator-margin-inline);
|
|
6921
|
+
--_date-range-box-presets-min-width: var(--mx-date-range-box-presets-min-width);
|
|
6922
|
+
--_date-range-box-presets-max-height: var(--mx-date-range-box-presets-max-height);
|
|
6923
|
+
--_date-range-box-presets-focus-outline-width: var(--mx-date-range-box-presets-focus-outline-width);
|
|
6924
|
+
--_date-range-box-presets-focus-outline-color: var(--mx-date-range-box-presets-focus-outline-color);
|
|
6925
|
+
--_date-range-box-presets-focus-outline-offset: var(--mx-date-range-box-presets-focus-outline-offset);
|
|
6926
|
+
--_date-range-box-presets-focus-glow: var(--mx-date-range-box-presets-focus-glow);
|
|
6927
|
+
--_date-range-box-presets-beside-padding-start: var(--mx-date-range-box-presets-beside-padding-start);
|
|
6928
|
+
--_date-range-box-presets-beside-border-start-width: var(--mx-date-range-box-presets-beside-border-start-width);
|
|
6929
|
+
--_date-range-box-presets-beside-border-start-color: var(--mx-date-range-box-presets-beside-border-start-color);
|
|
6930
|
+
}
|
|
6931
|
+
|
|
6555
6932
|
[data-disabled] [aria-disabled='true'], [data-disabled][aria-disabled='true'] {
|
|
6556
6933
|
--_disabled-element-color: var(--mx-disabled-element-color);
|
|
6557
6934
|
}
|
|
@@ -6812,6 +7189,66 @@
|
|
|
6812
7189
|
--_field-box-pressed-bg: var(--mx-field-box-pressed-bg);
|
|
6813
7190
|
--_field-box-underline-disabled-shadow: var(--mx-field-box-underline-disabled-shadow);
|
|
6814
7191
|
--_field-box-pressed-color: var(--mx-field-box-pressed-color);
|
|
7192
|
+
--_field-box-border-style: var(--mx-field-box-border-style);
|
|
7193
|
+
--_field-box-border-color: var(--mx-field-box-border-color);
|
|
7194
|
+
}
|
|
7195
|
+
|
|
7196
|
+
.mx-file-uploader {
|
|
7197
|
+
--_file-uploader-box-gap: var(--mx-file-uploader-box-gap);
|
|
7198
|
+
--_file-uploader-button-gap: var(--mx-file-uploader-button-gap);
|
|
7199
|
+
--_file-uploader-item-gap: var(--mx-file-uploader-item-gap);
|
|
7200
|
+
--_file-uploader-over-bg: var(--mx-file-uploader-over-bg);
|
|
7201
|
+
--_file-uploader-over-border-color: var(--mx-file-uploader-over-border-color);
|
|
7202
|
+
--_file-uploader-select-padding-block: var(--mx-file-uploader-select-padding-block);
|
|
7203
|
+
--_file-uploader-select-padding-inline: var(--mx-file-uploader-select-padding-inline);
|
|
7204
|
+
--_file-uploader-select-radius: var(--mx-file-uploader-select-radius);
|
|
7205
|
+
--_file-uploader-select-color: var(--mx-file-uploader-select-color);
|
|
7206
|
+
--_file-uploader-select-font-weight: var(--mx-file-uploader-select-font-weight);
|
|
7207
|
+
--_file-uploader-select-bg: var(--mx-file-uploader-select-bg);
|
|
7208
|
+
--_file-uploader-select-border-width: var(--mx-file-uploader-select-border-width);
|
|
7209
|
+
--_file-uploader-select-border-color: var(--mx-file-uploader-select-border-color);
|
|
7210
|
+
--_file-uploader-select-hover-bg: var(--mx-file-uploader-select-hover-bg);
|
|
7211
|
+
--_file-uploader-select-hover-cursor: var(--mx-file-uploader-select-hover-cursor);
|
|
7212
|
+
--_file-uploader-select-pressed-bg: var(--mx-file-uploader-select-pressed-bg);
|
|
7213
|
+
--_file-uploader-select-focus-glow: var(--mx-file-uploader-select-focus-glow);
|
|
7214
|
+
--_file-uploader-select-focus-outline-width: var(--mx-file-uploader-select-focus-outline-width);
|
|
7215
|
+
--_file-uploader-select-focus-outline-color: var(--mx-file-uploader-select-focus-outline-color);
|
|
7216
|
+
--_file-uploader-select-focus-outline-offset: var(--mx-file-uploader-select-focus-outline-offset);
|
|
7217
|
+
--_file-uploader-select-disabled-color: var(--mx-file-uploader-select-disabled-color);
|
|
7218
|
+
--_file-uploader-select-disabled-border-color: var(--mx-file-uploader-select-disabled-border-color);
|
|
7219
|
+
--_file-uploader-upload-padding-block: var(--mx-file-uploader-upload-padding-block);
|
|
7220
|
+
--_file-uploader-upload-padding-inline: var(--mx-file-uploader-upload-padding-inline);
|
|
7221
|
+
--_file-uploader-upload-radius: var(--mx-file-uploader-upload-radius);
|
|
7222
|
+
--_file-uploader-upload-color: var(--mx-file-uploader-upload-color);
|
|
7223
|
+
--_file-uploader-upload-font-weight: var(--mx-file-uploader-upload-font-weight);
|
|
7224
|
+
--_file-uploader-upload-bg: var(--mx-file-uploader-upload-bg);
|
|
7225
|
+
--_file-uploader-upload-border-width: var(--mx-file-uploader-upload-border-width);
|
|
7226
|
+
--_file-uploader-upload-border-color: var(--mx-file-uploader-upload-border-color);
|
|
7227
|
+
--_file-uploader-upload-hover-bg: var(--mx-file-uploader-upload-hover-bg);
|
|
7228
|
+
--_file-uploader-upload-hover-cursor: var(--mx-file-uploader-upload-hover-cursor);
|
|
7229
|
+
--_file-uploader-upload-pressed-bg: var(--mx-file-uploader-upload-pressed-bg);
|
|
7230
|
+
--_file-uploader-upload-focus-glow: var(--mx-file-uploader-upload-focus-glow);
|
|
7231
|
+
--_file-uploader-upload-focus-outline-width: var(--mx-file-uploader-upload-focus-outline-width);
|
|
7232
|
+
--_file-uploader-upload-focus-outline-color: var(--mx-file-uploader-upload-focus-outline-color);
|
|
7233
|
+
--_file-uploader-upload-focus-outline-offset: var(--mx-file-uploader-upload-focus-outline-offset);
|
|
7234
|
+
--_file-uploader-hint-color: var(--mx-file-uploader-hint-color);
|
|
7235
|
+
--_file-uploader-list-margin-top: var(--mx-file-uploader-list-margin-top);
|
|
7236
|
+
--_file-uploader-list-gap: var(--mx-file-uploader-list-gap);
|
|
7237
|
+
--_file-uploader-item-padding-block: var(--mx-file-uploader-item-padding-block);
|
|
7238
|
+
--_file-uploader-item-padding-inline: var(--mx-file-uploader-item-padding-inline);
|
|
7239
|
+
--_file-uploader-item-radius: var(--mx-file-uploader-item-radius);
|
|
7240
|
+
--_file-uploader-item-error-bg: var(--mx-file-uploader-item-error-bg);
|
|
7241
|
+
--_file-uploader-item-invalid-bg: var(--mx-file-uploader-item-invalid-bg);
|
|
7242
|
+
--_file-uploader-icon-icon: var(--mx-file-uploader-icon-icon);
|
|
7243
|
+
--_file-uploader-icon-bg: var(--mx-file-uploader-icon-bg);
|
|
7244
|
+
--_file-uploader-icon-size: var(--mx-file-uploader-icon-size);
|
|
7245
|
+
--_file-uploader-name-color: var(--mx-file-uploader-name-color);
|
|
7246
|
+
--_file-uploader-size-color: var(--mx-file-uploader-size-color);
|
|
7247
|
+
--_file-uploader-size-font-size: var(--mx-file-uploader-size-font-size);
|
|
7248
|
+
--_file-uploader-state-color: var(--mx-file-uploader-state-color);
|
|
7249
|
+
--_file-uploader-state-font-size: var(--mx-file-uploader-state-font-size);
|
|
7250
|
+
--_file-uploader-state-done-color: var(--mx-file-uploader-state-done-color);
|
|
7251
|
+
--_file-uploader-state-error-color: var(--mx-file-uploader-state-error-color);
|
|
6815
7252
|
}
|
|
6816
7253
|
|
|
6817
7254
|
.mx-filter-builder {
|
|
@@ -6981,6 +7418,22 @@
|
|
|
6981
7418
|
--_listbox-box-padding-inline: var(--mx-listbox-box-padding-inline);
|
|
6982
7419
|
}
|
|
6983
7420
|
|
|
7421
|
+
.mx-load-panel {
|
|
7422
|
+
--_load-panel-padding: var(--mx-load-panel-padding);
|
|
7423
|
+
--_load-panel-gap: var(--mx-load-panel-gap);
|
|
7424
|
+
--_load-panel-shade-shaded-bg: var(--mx-load-panel-shade-shaded-bg);
|
|
7425
|
+
--_load-panel-pane-shown-bg: var(--mx-load-panel-pane-shown-bg);
|
|
7426
|
+
--_load-panel-pane-shown-border-width: var(--mx-load-panel-pane-shown-border-width);
|
|
7427
|
+
--_load-panel-pane-shown-border-color: var(--mx-load-panel-pane-shown-border-color);
|
|
7428
|
+
--_load-panel-pane-shown-radius: var(--mx-load-panel-pane-shown-radius);
|
|
7429
|
+
--_load-panel-pane-shown-shadow: var(--mx-load-panel-pane-shown-shadow);
|
|
7430
|
+
--_load-panel-pane-shown-padding-block: var(--mx-load-panel-pane-shown-padding-block);
|
|
7431
|
+
--_load-panel-pane-shown-padding-inline: var(--mx-load-panel-pane-shown-padding-inline);
|
|
7432
|
+
--_load-panel-pane-shown-min-width: var(--mx-load-panel-pane-shown-min-width);
|
|
7433
|
+
--_load-panel-message-color: var(--mx-load-panel-message-color);
|
|
7434
|
+
--_load-panel-message-font-size: var(--mx-load-panel-message-font-size);
|
|
7435
|
+
}
|
|
7436
|
+
|
|
6984
7437
|
.mx-lookup, .mx-lookup__popup {
|
|
6985
7438
|
--_lookup-popup-width: var(--mx-lookup-popup-width);
|
|
6986
7439
|
--_lookup-column-gap: var(--mx-lookup-column-gap);
|
|
@@ -7102,6 +7555,38 @@
|
|
|
7102
7555
|
--_pagination-info-padding-inline: var(--mx-pagination-info-padding-inline);
|
|
7103
7556
|
}
|
|
7104
7557
|
|
|
7558
|
+
.mx-popover {
|
|
7559
|
+
--_popover-offset: var(--mx-popover-offset);
|
|
7560
|
+
--_popover-enter-offset: var(--mx-popover-enter-offset);
|
|
7561
|
+
--_popover-header-gap: var(--mx-popover-header-gap);
|
|
7562
|
+
--_popover-surface-bg: var(--mx-popover-surface-bg);
|
|
7563
|
+
--_popover-surface-border-width: var(--mx-popover-surface-border-width);
|
|
7564
|
+
--_popover-surface-border-color: var(--mx-popover-surface-border-color);
|
|
7565
|
+
--_popover-surface-radius: var(--mx-popover-surface-radius);
|
|
7566
|
+
--_popover-surface-shadow: var(--mx-popover-surface-shadow);
|
|
7567
|
+
--_popover-surface-color: var(--mx-popover-surface-color);
|
|
7568
|
+
--_popover-surface-font-size: var(--mx-popover-surface-font-size);
|
|
7569
|
+
--_popover-surface-line-height: var(--mx-popover-surface-line-height);
|
|
7570
|
+
--_popover-surface-max-width: var(--mx-popover-surface-max-width);
|
|
7571
|
+
--_popover-surface-focus-glow: var(--mx-popover-surface-focus-glow);
|
|
7572
|
+
--_popover-surface-focus-outline-width: var(--mx-popover-surface-focus-outline-width);
|
|
7573
|
+
--_popover-surface-focus-outline-color: var(--mx-popover-surface-focus-outline-color);
|
|
7574
|
+
--_popover-surface-focus-outline-offset: var(--mx-popover-surface-focus-outline-offset);
|
|
7575
|
+
--_popover-arrow-display: var(--mx-popover-arrow-display);
|
|
7576
|
+
--_popover-arrow-size: var(--mx-popover-arrow-size);
|
|
7577
|
+
--_popover-arrow-bg: var(--mx-popover-arrow-bg);
|
|
7578
|
+
--_popover-arrow-border-width: var(--mx-popover-arrow-border-width);
|
|
7579
|
+
--_popover-arrow-border-color: var(--mx-popover-arrow-border-color);
|
|
7580
|
+
--_popover-header-padding-block: var(--mx-popover-header-padding-block);
|
|
7581
|
+
--_popover-header-padding-start: var(--mx-popover-header-padding-start);
|
|
7582
|
+
--_popover-header-padding-end: var(--mx-popover-header-padding-end);
|
|
7583
|
+
--_popover-title-font-weight: var(--mx-popover-title-font-weight);
|
|
7584
|
+
--_popover-title-color: var(--mx-popover-title-color);
|
|
7585
|
+
--_popover-body-padding: var(--mx-popover-body-padding);
|
|
7586
|
+
--_popover-header-border-bottom-width: var(--mx-popover-header-border-bottom-width);
|
|
7587
|
+
--_popover-header-border-bottom-color: var(--mx-popover-header-border-bottom-color);
|
|
7588
|
+
}
|
|
7589
|
+
|
|
7105
7590
|
.mx-popup {
|
|
7106
7591
|
--_popup-offset: var(--mx-popup-offset);
|
|
7107
7592
|
--_popup-surface-padding-block: var(--mx-popup-surface-padding-block);
|
|
@@ -7690,6 +8175,20 @@
|
|
|
7690
8175
|
--_scheduler-agenda-weekday-text-transform: var(--mx-scheduler-agenda-weekday-text-transform);
|
|
7691
8176
|
}
|
|
7692
8177
|
|
|
8178
|
+
.mx-scroll-view {
|
|
8179
|
+
--_scroll-view-panel-height: var(--mx-scroll-view-panel-height);
|
|
8180
|
+
--_scroll-view-panel-gap: var(--mx-scroll-view-panel-gap);
|
|
8181
|
+
--_scroll-view-box-focus-glow: var(--mx-scroll-view-box-focus-glow);
|
|
8182
|
+
--_scroll-view-box-focus-outline-width: var(--mx-scroll-view-box-focus-outline-width);
|
|
8183
|
+
--_scroll-view-box-focus-outline-color: var(--mx-scroll-view-box-focus-outline-color);
|
|
8184
|
+
--_scroll-view-box-focus-outline-offset: var(--mx-scroll-view-box-focus-outline-offset);
|
|
8185
|
+
--_scroll-view-pull-color: var(--mx-scroll-view-pull-color);
|
|
8186
|
+
--_scroll-view-pull-font-size: var(--mx-scroll-view-pull-font-size);
|
|
8187
|
+
--_scroll-view-pull-refreshing-color: var(--mx-scroll-view-pull-refreshing-color);
|
|
8188
|
+
--_scroll-view-bottom-color: var(--mx-scroll-view-bottom-color);
|
|
8189
|
+
--_scroll-view-bottom-font-size: var(--mx-scroll-view-bottom-font-size);
|
|
8190
|
+
}
|
|
8191
|
+
|
|
7693
8192
|
.mx-bottom-sheet {
|
|
7694
8193
|
--_sheet-font-family: var(--mx-sheet-font-family);
|
|
7695
8194
|
--_sheet-inset: var(--mx-sheet-inset);
|
|
@@ -7841,6 +8340,23 @@
|
|
|
7841
8340
|
--_slider-stop-active-bg: var(--mx-slider-stop-active-bg);
|
|
7842
8341
|
}
|
|
7843
8342
|
|
|
8343
|
+
.mx-sortable {
|
|
8344
|
+
--_sortable-gap: var(--mx-sortable-gap);
|
|
8345
|
+
--_sortable-container-target-bg: var(--mx-sortable-container-target-bg);
|
|
8346
|
+
--_sortable-item-sortable-cursor: var(--mx-sortable-item-sortable-cursor);
|
|
8347
|
+
--_sortable-item-dragging-opacity: var(--mx-sortable-item-dragging-opacity);
|
|
8348
|
+
--_sortable-item-focus-glow: var(--mx-sortable-item-focus-glow);
|
|
8349
|
+
--_sortable-item-focus-outline-width: var(--mx-sortable-item-focus-outline-width);
|
|
8350
|
+
--_sortable-item-focus-outline-color: var(--mx-sortable-item-focus-outline-color);
|
|
8351
|
+
--_sortable-item-focus-outline-offset: var(--mx-sortable-item-focus-outline-offset);
|
|
8352
|
+
--_sortable-line-height: var(--mx-sortable-line-height);
|
|
8353
|
+
--_sortable-line-radius: var(--mx-sortable-line-radius);
|
|
8354
|
+
--_sortable-line-bg: var(--mx-sortable-line-bg);
|
|
8355
|
+
--_sortable-ghost-radius: var(--mx-sortable-ghost-radius);
|
|
8356
|
+
--_sortable-ghost-shadow: var(--mx-sortable-ghost-shadow);
|
|
8357
|
+
--_sortable-ghost-opacity: var(--mx-sortable-ghost-opacity);
|
|
8358
|
+
}
|
|
8359
|
+
|
|
7844
8360
|
.mx-spinner, .mx-button__spinner, .mx-drop-down__spinner {
|
|
7845
8361
|
--_spinner-gap: var(--mx-spinner-gap);
|
|
7846
8362
|
--_spinner-cover-padding: var(--mx-spinner-cover-padding);
|
|
@@ -7888,6 +8404,66 @@
|
|
|
7888
8404
|
--_spinner-shape-contained-scale: var(--mx-spinner-shape-contained-scale);
|
|
7889
8405
|
}
|
|
7890
8406
|
|
|
8407
|
+
.mx-stepper {
|
|
8408
|
+
--_stepper-size-sm: var(--mx-stepper-size-sm);
|
|
8409
|
+
--_stepper-size-md: var(--mx-stepper-size-md);
|
|
8410
|
+
--_stepper-size-lg: var(--mx-stepper-size-lg);
|
|
8411
|
+
--_stepper-font-size-sm: var(--mx-stepper-font-size-sm);
|
|
8412
|
+
--_stepper-font-size-md: var(--mx-stepper-font-size-md);
|
|
8413
|
+
--_stepper-font-size-lg: var(--mx-stepper-font-size-lg);
|
|
8414
|
+
--_stepper-description-font-size: var(--mx-stepper-description-font-size);
|
|
8415
|
+
--_stepper-padding-sm: var(--mx-stepper-padding-sm);
|
|
8416
|
+
--_stepper-padding-md: var(--mx-stepper-padding-md);
|
|
8417
|
+
--_stepper-padding-lg: var(--mx-stepper-padding-lg);
|
|
8418
|
+
--_stepper-gap: var(--mx-stepper-gap);
|
|
8419
|
+
--_stepper-line-gap: var(--mx-stepper-line-gap);
|
|
8420
|
+
--_stepper-line-min-length: var(--mx-stepper-line-min-length);
|
|
8421
|
+
--_stepper-step-radius: var(--mx-stepper-step-radius);
|
|
8422
|
+
--_stepper-step-color: var(--mx-stepper-step-color);
|
|
8423
|
+
--_stepper-step-hover-bg: var(--mx-stepper-step-hover-bg);
|
|
8424
|
+
--_stepper-step-hover-cursor: var(--mx-stepper-step-hover-cursor);
|
|
8425
|
+
--_stepper-step-pressed-bg: var(--mx-stepper-step-pressed-bg);
|
|
8426
|
+
--_stepper-step-focus-glow: var(--mx-stepper-step-focus-glow);
|
|
8427
|
+
--_stepper-step-focus-outline-width: var(--mx-stepper-step-focus-outline-width);
|
|
8428
|
+
--_stepper-step-focus-outline-color: var(--mx-stepper-step-focus-outline-color);
|
|
8429
|
+
--_stepper-step-focus-outline-offset: var(--mx-stepper-step-focus-outline-offset);
|
|
8430
|
+
--_stepper-step-disabled-color: var(--mx-stepper-step-disabled-color);
|
|
8431
|
+
--_stepper-step-current-color: var(--mx-stepper-step-current-color);
|
|
8432
|
+
--_stepper-step-done-color: var(--mx-stepper-step-done-color);
|
|
8433
|
+
--_stepper-indicator-radius: var(--mx-stepper-indicator-radius);
|
|
8434
|
+
--_stepper-indicator-bg: var(--mx-stepper-indicator-bg);
|
|
8435
|
+
--_stepper-indicator-border-width: var(--mx-stepper-indicator-border-width);
|
|
8436
|
+
--_stepper-indicator-border-color: var(--mx-stepper-indicator-border-color);
|
|
8437
|
+
--_stepper-indicator-color: var(--mx-stepper-indicator-color);
|
|
8438
|
+
--_stepper-indicator-font-size: var(--mx-stepper-indicator-font-size);
|
|
8439
|
+
--_stepper-indicator-font-weight: var(--mx-stepper-indicator-font-weight);
|
|
8440
|
+
--_stepper-indicator-current-bg: var(--mx-stepper-indicator-current-bg);
|
|
8441
|
+
--_stepper-indicator-current-border-color: var(--mx-stepper-indicator-current-border-color);
|
|
8442
|
+
--_stepper-indicator-current-color: var(--mx-stepper-indicator-current-color);
|
|
8443
|
+
--_stepper-indicator-done-bg: var(--mx-stepper-indicator-done-bg);
|
|
8444
|
+
--_stepper-indicator-done-border-color: var(--mx-stepper-indicator-done-border-color);
|
|
8445
|
+
--_stepper-indicator-done-color: var(--mx-stepper-indicator-done-color);
|
|
8446
|
+
--_stepper-indicator-error-bg: var(--mx-stepper-indicator-error-bg);
|
|
8447
|
+
--_stepper-indicator-error-border-color: var(--mx-stepper-indicator-error-border-color);
|
|
8448
|
+
--_stepper-indicator-error-color: var(--mx-stepper-indicator-error-color);
|
|
8449
|
+
--_stepper-indicator-disabled-border-color: var(--mx-stepper-indicator-disabled-border-color);
|
|
8450
|
+
--_stepper-indicator-disabled-color: var(--mx-stepper-indicator-disabled-color);
|
|
8451
|
+
--_stepper-mark-done-icon: var(--mx-stepper-mark-done-icon);
|
|
8452
|
+
--_stepper-mark-done-bg: var(--mx-stepper-mark-done-bg);
|
|
8453
|
+
--_stepper-mark-error-icon: var(--mx-stepper-mark-error-icon);
|
|
8454
|
+
--_stepper-mark-error-bg: var(--mx-stepper-mark-error-bg);
|
|
8455
|
+
--_stepper-label-current-font-weight: var(--mx-stepper-label-current-font-weight);
|
|
8456
|
+
--_stepper-label-error-color: var(--mx-stepper-label-error-color);
|
|
8457
|
+
--_stepper-description-color: var(--mx-stepper-description-color);
|
|
8458
|
+
--_stepper-description-disabled-color: var(--mx-stepper-description-disabled-color);
|
|
8459
|
+
--_stepper-note-color: var(--mx-stepper-note-color);
|
|
8460
|
+
--_stepper-line-height: var(--mx-stepper-line-height);
|
|
8461
|
+
--_stepper-line-bg: var(--mx-stepper-line-bg);
|
|
8462
|
+
--_stepper-line-done-bg: var(--mx-stepper-line-done-bg);
|
|
8463
|
+
--_stepper-line-radius: var(--mx-stepper-line-radius);
|
|
8464
|
+
--_stepper-indicator-disabled-bg: var(--mx-stepper-indicator-disabled-bg);
|
|
8465
|
+
}
|
|
8466
|
+
|
|
7891
8467
|
.mx-switch {
|
|
7892
8468
|
--_switch-thumb-inset: var(--mx-switch-thumb-inset);
|
|
7893
8469
|
--_switch-gap: var(--mx-switch-gap);
|
|
@@ -8637,6 +9213,15 @@
|
|
|
8637
9213
|
--_window-footer-padding-inline: var(--mx-window-footer-padding-inline);
|
|
8638
9214
|
--_window-bar-dialog-color: var(--mx-window-bar-dialog-color);
|
|
8639
9215
|
}
|
|
9216
|
+
|
|
9217
|
+
.mx-wizard {
|
|
9218
|
+
--_wizard-gap: var(--mx-wizard-gap);
|
|
9219
|
+
--_wizard-bar-gap: var(--mx-wizard-bar-gap);
|
|
9220
|
+
--_wizard-rail-width: var(--mx-wizard-rail-width);
|
|
9221
|
+
--_wizard-bar-padding-top: var(--mx-wizard-bar-padding-top);
|
|
9222
|
+
--_wizard-bar-border-top-width: var(--mx-wizard-bar-border-top-width);
|
|
9223
|
+
--_wizard-bar-border-top-color: var(--mx-wizard-bar-border-top-color);
|
|
9224
|
+
}
|
|
8640
9225
|
}
|
|
8641
9226
|
|
|
8642
9227
|
/* Generated by scripts/build-icons.mjs from tokens/icons/: do not edit. */
|
|
@@ -8691,6 +9276,8 @@
|
|
|
8691
9276
|
--mx-icon-dock-guide-up: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cpath%20d%3D%27M2.5%202.5h11v11h-11zM2.5%206.5h11%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E");
|
|
8692
9277
|
--mx-icon-dock-guide-down: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cpath%20d%3D%27M2.5%202.5h11v11h-11zM2.5%209.5h11%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E");
|
|
8693
9278
|
--mx-icon-drag-dots: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cpath%20d%3D%27M4.4%204a1.1%201.1%200%201%200%202.2%200a1.1%201.1%200%201%200-2.2%200zM4.4%208a1.1%201.1%200%201%200%202.2%200a1.1%201.1%200%201%200-2.2%200zM4.4%2012a1.1%201.1%200%201%200%202.2%200a1.1%201.1%200%201%200-2.2%200zM9.4%204a1.1%201.1%200%201%200%202.2%200a1.1%201.1%200%201%200-2.2%200zM9.4%208a1.1%201.1%200%201%200%202.2%200a1.1%201.1%200%201%200-2.2%200zM9.4%2012a1.1%201.1%200%201%200%202.2%200a1.1%201.1%200%201%200-2.2%200z%27%20fill%3D%27black%27%2F%3E%3C%2Fsvg%3E");
|
|
9279
|
+
--mx-icon-upload: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cpath%20d%3D%27M8%2010V2.5M4.75%205.75L8%202.5l3.25%203.25M3%2012.5v1h10v-1%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E");
|
|
9280
|
+
--mx-icon-file: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cpath%20d%3D%27M4%201.75h5.5L13%205.25v9H4zM9.25%201.75v3.75H13%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E");
|
|
8694
9281
|
}
|
|
8695
9282
|
|
|
8696
9283
|
.mx-glyph[data-icon='blocked'] {
|
|
@@ -8789,6 +9376,10 @@
|
|
|
8789
9376
|
--_icon: var(--mx-icon-eyedropper);
|
|
8790
9377
|
}
|
|
8791
9378
|
|
|
9379
|
+
.mx-glyph[data-icon='file'] {
|
|
9380
|
+
--_icon: var(--mx-icon-file);
|
|
9381
|
+
}
|
|
9382
|
+
|
|
8792
9383
|
.mx-glyph[data-icon='filter'] {
|
|
8793
9384
|
--_icon: var(--mx-icon-filter);
|
|
8794
9385
|
}
|
|
@@ -8884,6 +9475,10 @@
|
|
|
8884
9475
|
.mx-glyph[data-icon='undo'] {
|
|
8885
9476
|
--_icon: var(--mx-icon-undo);
|
|
8886
9477
|
}
|
|
9478
|
+
|
|
9479
|
+
.mx-glyph[data-icon='upload'] {
|
|
9480
|
+
--_icon: var(--mx-icon-upload);
|
|
9481
|
+
}
|
|
8887
9482
|
}
|
|
8888
9483
|
|
|
8889
9484
|
/* Generated by scripts/build-shapes.mjs from tokens/shapes. Do not edit; edit the source and run `npm run tokens`. */
|
|
@@ -12496,6 +13091,603 @@
|
|
|
12496
13091
|
}
|
|
12497
13092
|
}
|
|
12498
13093
|
|
|
13094
|
+
/* Stepper: a row (or a column) of steps with a line between them. Only the layout is here: a step, its indicator,
|
|
13095
|
+
the mark and the number in it, the texts and the line are units of the schema (`$units`). Horizontal, the texts
|
|
13096
|
+
sit under the indicator (`data-labels="bottom"`: the steps share the width and the line runs from one indicator
|
|
13097
|
+
to the next) or after it (`end`: the line grows between the steps). Vertical, the line stands under the
|
|
13098
|
+
indicator. The space around a step is the plain `padding` token, which the line's place is measured from. */
|
|
13099
|
+
@layer mx.components {
|
|
13100
|
+
.mx-stepper {
|
|
13101
|
+
display: block;
|
|
13102
|
+
box-sizing: border-box;
|
|
13103
|
+
inline-size: 100%;
|
|
13104
|
+
min-inline-size: 0;
|
|
13105
|
+
}
|
|
13106
|
+
|
|
13107
|
+
.mx-stepper[data-size='sm'] {
|
|
13108
|
+
--_size: var(--_stepper-size-sm);
|
|
13109
|
+
--_font-size: var(--_stepper-font-size-sm);
|
|
13110
|
+
--_padding: var(--_stepper-padding-sm);
|
|
13111
|
+
}
|
|
13112
|
+
|
|
13113
|
+
.mx-stepper[data-size='md'] {
|
|
13114
|
+
--_size: var(--_stepper-size-md);
|
|
13115
|
+
--_font-size: var(--_stepper-font-size-md);
|
|
13116
|
+
--_padding: var(--_stepper-padding-md);
|
|
13117
|
+
}
|
|
13118
|
+
|
|
13119
|
+
.mx-stepper[data-size='lg'] {
|
|
13120
|
+
--_size: var(--_stepper-size-lg);
|
|
13121
|
+
--_font-size: var(--_stepper-font-size-lg);
|
|
13122
|
+
--_padding: var(--_stepper-padding-lg);
|
|
13123
|
+
}
|
|
13124
|
+
|
|
13125
|
+
.mx-stepper__list {
|
|
13126
|
+
display: flex;
|
|
13127
|
+
align-items: flex-start;
|
|
13128
|
+
margin: 0;
|
|
13129
|
+
padding: 0;
|
|
13130
|
+
list-style: none;
|
|
13131
|
+
}
|
|
13132
|
+
|
|
13133
|
+
.mx-stepper__item {
|
|
13134
|
+
display: flex;
|
|
13135
|
+
position: relative;
|
|
13136
|
+
min-inline-size: 0;
|
|
13137
|
+
}
|
|
13138
|
+
|
|
13139
|
+
.mx-stepper__step {
|
|
13140
|
+
display: flex;
|
|
13141
|
+
box-sizing: border-box;
|
|
13142
|
+
align-items: center;
|
|
13143
|
+
min-inline-size: 0;
|
|
13144
|
+
margin: 0;
|
|
13145
|
+
border: 0;
|
|
13146
|
+
background: none;
|
|
13147
|
+
color: inherit;
|
|
13148
|
+
font: inherit;
|
|
13149
|
+
text-align: start;
|
|
13150
|
+
appearance: none;
|
|
13151
|
+
}
|
|
13152
|
+
|
|
13153
|
+
.mx-stepper__indicator {
|
|
13154
|
+
display: inline-flex;
|
|
13155
|
+
flex: none;
|
|
13156
|
+
box-sizing: border-box;
|
|
13157
|
+
align-items: center;
|
|
13158
|
+
justify-content: center;
|
|
13159
|
+
}
|
|
13160
|
+
|
|
13161
|
+
.mx-stepper__number {
|
|
13162
|
+
line-height: 1;
|
|
13163
|
+
}
|
|
13164
|
+
|
|
13165
|
+
.mx-stepper__icon,
|
|
13166
|
+
.mx-stepper__indicator > :is(img, svg) {
|
|
13167
|
+
inline-size: calc(var(--_size) * 0.6);
|
|
13168
|
+
block-size: calc(var(--_size) * 0.6);
|
|
13169
|
+
}
|
|
13170
|
+
|
|
13171
|
+
.mx-stepper__texts {
|
|
13172
|
+
display: flex;
|
|
13173
|
+
flex-direction: column;
|
|
13174
|
+
min-inline-size: 0;
|
|
13175
|
+
}
|
|
13176
|
+
|
|
13177
|
+
.mx-stepper__label {
|
|
13178
|
+
overflow-wrap: anywhere;
|
|
13179
|
+
}
|
|
13180
|
+
|
|
13181
|
+
/* Texts after the indicator: the line grows between the steps. */
|
|
13182
|
+
.mx-stepper:not([data-orientation='vertical'])[data-labels='end'] .mx-stepper__item {
|
|
13183
|
+
align-items: center;
|
|
13184
|
+
}
|
|
13185
|
+
|
|
13186
|
+
/* The steps keep their size; the room left goes to the lines, equally. */
|
|
13187
|
+
.mx-stepper:not([data-orientation='vertical'])[data-labels='end'] .mx-stepper__item:not(:last-child) {
|
|
13188
|
+
flex: 1 1 auto;
|
|
13189
|
+
}
|
|
13190
|
+
|
|
13191
|
+
.mx-stepper:not([data-orientation='vertical'])[data-labels='end'] .mx-stepper__step {
|
|
13192
|
+
flex: 0 1 auto;
|
|
13193
|
+
}
|
|
13194
|
+
|
|
13195
|
+
.mx-stepper:not([data-orientation='vertical'])[data-labels='end'] .mx-stepper__line {
|
|
13196
|
+
flex: 1 0 var(--_stepper-line-min-length);
|
|
13197
|
+
margin-inline: var(--_stepper-line-gap);
|
|
13198
|
+
}
|
|
13199
|
+
|
|
13200
|
+
/* Beside the indicator the texts stay on one line and end in an ellipsis when the row is short of room. */
|
|
13201
|
+
.mx-stepper:not([data-orientation='vertical'])[data-labels='end'] .mx-stepper__label,
|
|
13202
|
+
.mx-stepper:not([data-orientation='vertical'])[data-labels='end'] .mx-stepper__description {
|
|
13203
|
+
overflow: hidden;
|
|
13204
|
+
text-overflow: ellipsis;
|
|
13205
|
+
white-space: nowrap;
|
|
13206
|
+
}
|
|
13207
|
+
|
|
13208
|
+
/* Texts under the indicator: equal steps, the line from one indicator to the next. */
|
|
13209
|
+
.mx-stepper:not([data-orientation='vertical']):not([data-labels='end']) .mx-stepper__item {
|
|
13210
|
+
flex: 1 1 0;
|
|
13211
|
+
flex-direction: column;
|
|
13212
|
+
align-items: center;
|
|
13213
|
+
}
|
|
13214
|
+
|
|
13215
|
+
.mx-stepper:not([data-orientation='vertical']):not([data-labels='end']) .mx-stepper__step {
|
|
13216
|
+
flex-direction: column;
|
|
13217
|
+
inline-size: 100%;
|
|
13218
|
+
text-align: center;
|
|
13219
|
+
}
|
|
13220
|
+
|
|
13221
|
+
.mx-stepper:not([data-orientation='vertical']):not([data-labels='end']) .mx-stepper__texts {
|
|
13222
|
+
align-items: center;
|
|
13223
|
+
}
|
|
13224
|
+
|
|
13225
|
+
.mx-stepper:not([data-orientation='vertical']):not([data-labels='end']) .mx-stepper__line {
|
|
13226
|
+
position: absolute;
|
|
13227
|
+
inset-block-start: calc(var(--_padding) + var(--_size) / 2);
|
|
13228
|
+
inset-inline-start: calc(50% + var(--_size) / 2 + var(--_stepper-line-gap));
|
|
13229
|
+
inset-inline-end: calc(-50% + var(--_size) / 2 + var(--_stepper-line-gap));
|
|
13230
|
+
translate: 0 -50%;
|
|
13231
|
+
}
|
|
13232
|
+
|
|
13233
|
+
/* Vertical: the line stands under the indicator, the texts beside it. */
|
|
13234
|
+
.mx-stepper[data-orientation='vertical'] > .mx-stepper__list {
|
|
13235
|
+
flex-direction: column;
|
|
13236
|
+
align-items: stretch;
|
|
13237
|
+
}
|
|
13238
|
+
|
|
13239
|
+
.mx-stepper[data-orientation='vertical'] .mx-stepper__item {
|
|
13240
|
+
flex-direction: column;
|
|
13241
|
+
}
|
|
13242
|
+
|
|
13243
|
+
.mx-stepper[data-orientation='vertical'] .mx-stepper__line {
|
|
13244
|
+
flex: 1 1 auto;
|
|
13245
|
+
min-block-size: var(--_stepper-line-min-length);
|
|
13246
|
+
margin-block: var(--_stepper-line-gap);
|
|
13247
|
+
margin-inline-start: calc(var(--_padding) + var(--_size) / 2);
|
|
13248
|
+
translate: -50% 0;
|
|
13249
|
+
}
|
|
13250
|
+
|
|
13251
|
+
.mx-stepper[data-orientation='vertical'] .mx-stepper__line:dir(rtl) {
|
|
13252
|
+
translate: 50% 0;
|
|
13253
|
+
}
|
|
13254
|
+
}
|
|
13255
|
+
|
|
13256
|
+
/* Wizard: the stepper, the pages and the bar with the buttons. Only the layout is here: the frame, a page and the
|
|
13257
|
+
bar are units of the schema; the buttons are the kit's, their look in the bar from the wizard's places. Standing
|
|
13258
|
+
(`data-orientation="vertical"`), the stepper takes a column at the start and the pages and the bar the rest. */
|
|
13259
|
+
@layer mx.components {
|
|
13260
|
+
.mx-wizard {
|
|
13261
|
+
display: flex;
|
|
13262
|
+
box-sizing: border-box;
|
|
13263
|
+
flex-direction: column;
|
|
13264
|
+
gap: var(--_wizard-gap);
|
|
13265
|
+
inline-size: 100%;
|
|
13266
|
+
min-inline-size: 0;
|
|
13267
|
+
}
|
|
13268
|
+
|
|
13269
|
+
.mx-wizard[data-orientation='vertical'] {
|
|
13270
|
+
display: grid;
|
|
13271
|
+
grid-template-rows: minmax(0, 1fr) auto;
|
|
13272
|
+
grid-template-columns: auto minmax(0, 1fr);
|
|
13273
|
+
column-gap: var(--_wizard-gap);
|
|
13274
|
+
}
|
|
13275
|
+
|
|
13276
|
+
.mx-wizard[data-orientation='vertical'] > .mx-wizard__stepper {
|
|
13277
|
+
grid-row: 1 / span 2;
|
|
13278
|
+
inline-size: var(--_wizard-rail-width);
|
|
13279
|
+
}
|
|
13280
|
+
|
|
13281
|
+
.mx-wizard__pages {
|
|
13282
|
+
flex: 1 1 auto;
|
|
13283
|
+
min-inline-size: 0;
|
|
13284
|
+
min-block-size: 0;
|
|
13285
|
+
}
|
|
13286
|
+
|
|
13287
|
+
.mx-wizard__bar {
|
|
13288
|
+
display: flex;
|
|
13289
|
+
justify-content: flex-end;
|
|
13290
|
+
gap: var(--_wizard-bar-gap);
|
|
13291
|
+
}
|
|
13292
|
+
|
|
13293
|
+
.mx-wizard[data-orientation='vertical'] > .mx-wizard__bar {
|
|
13294
|
+
grid-column: 2;
|
|
13295
|
+
}
|
|
13296
|
+
}
|
|
13297
|
+
|
|
13298
|
+
/* Popover: a surface in the top layer next to its target. placePopup writes its position; the gap to the target is the
|
|
13299
|
+
margin of the side it opens on, and it comes in from the target by `enter-offset`. Only the layout is here: the
|
|
13300
|
+
surface, the arrow, the header, the title and the body are units of the schema. The arrow is a square turned on its
|
|
13301
|
+
corner, its inner half clipped away, set along the edge towards the target where the component puts it. */
|
|
13302
|
+
@layer mx.components {
|
|
13303
|
+
.mx-popover {
|
|
13304
|
+
position: fixed;
|
|
13305
|
+
inset: auto;
|
|
13306
|
+
z-index: var(--mx-z-dropdown);
|
|
13307
|
+
box-sizing: border-box;
|
|
13308
|
+
margin: 0;
|
|
13309
|
+
overflow: visible;
|
|
13310
|
+
animation: mx-popover-in var(--mx-motion-duration-fast) var(--mx-motion-easing-out);
|
|
13311
|
+
|
|
13312
|
+
--_enter: 0 0;
|
|
13313
|
+
}
|
|
13314
|
+
|
|
13315
|
+
.mx-popover:is([popover]:not(:popover-open), [hidden]) {
|
|
13316
|
+
display: none;
|
|
13317
|
+
}
|
|
13318
|
+
|
|
13319
|
+
.mx-popover[data-side='bottom'] {
|
|
13320
|
+
margin-block-start: var(--_popover-offset);
|
|
13321
|
+
|
|
13322
|
+
--_enter: 0 calc(-1 * var(--_popover-enter-offset));
|
|
13323
|
+
}
|
|
13324
|
+
|
|
13325
|
+
.mx-popover[data-side='top'] {
|
|
13326
|
+
margin-block-end: var(--_popover-offset);
|
|
13327
|
+
|
|
13328
|
+
--_enter: 0 var(--_popover-enter-offset);
|
|
13329
|
+
}
|
|
13330
|
+
|
|
13331
|
+
.mx-popover[data-side='end'] {
|
|
13332
|
+
margin-inline-start: var(--_popover-offset);
|
|
13333
|
+
|
|
13334
|
+
--_enter: calc(-1 * var(--_popover-enter-offset)) 0;
|
|
13335
|
+
}
|
|
13336
|
+
|
|
13337
|
+
.mx-popover[data-side='start'] {
|
|
13338
|
+
margin-inline-end: var(--_popover-offset);
|
|
13339
|
+
|
|
13340
|
+
--_enter: var(--_popover-enter-offset) 0;
|
|
13341
|
+
}
|
|
13342
|
+
|
|
13343
|
+
.mx-popover[data-side='end']:dir(rtl) {
|
|
13344
|
+
--_enter: var(--_popover-enter-offset) 0;
|
|
13345
|
+
}
|
|
13346
|
+
|
|
13347
|
+
.mx-popover[data-side='start']:dir(rtl) {
|
|
13348
|
+
--_enter: calc(-1 * var(--_popover-enter-offset)) 0;
|
|
13349
|
+
}
|
|
13350
|
+
|
|
13351
|
+
.mx-popover__arrow {
|
|
13352
|
+
position: absolute;
|
|
13353
|
+
box-sizing: border-box;
|
|
13354
|
+
clip-path: polygon(0 0, 100% 0, 0 100%);
|
|
13355
|
+
pointer-events: none;
|
|
13356
|
+
}
|
|
13357
|
+
|
|
13358
|
+
.mx-popover:not([data-arrow]) > .mx-popover__arrow {
|
|
13359
|
+
display: none;
|
|
13360
|
+
}
|
|
13361
|
+
|
|
13362
|
+
.mx-popover[data-side='bottom'] > .mx-popover__arrow {
|
|
13363
|
+
top: 0;
|
|
13364
|
+
translate: -50% -50%;
|
|
13365
|
+
rotate: 45deg;
|
|
13366
|
+
}
|
|
13367
|
+
|
|
13368
|
+
.mx-popover[data-side='top'] > .mx-popover__arrow {
|
|
13369
|
+
bottom: 0;
|
|
13370
|
+
translate: -50% 50%;
|
|
13371
|
+
rotate: 225deg;
|
|
13372
|
+
}
|
|
13373
|
+
|
|
13374
|
+
.mx-popover:is([data-side='end']:dir(ltr), [data-side='start']:dir(rtl)) > .mx-popover__arrow {
|
|
13375
|
+
left: 0;
|
|
13376
|
+
translate: -50% -50%;
|
|
13377
|
+
rotate: -45deg;
|
|
13378
|
+
}
|
|
13379
|
+
|
|
13380
|
+
.mx-popover:is([data-side='start']:dir(ltr), [data-side='end']:dir(rtl)) > .mx-popover__arrow {
|
|
13381
|
+
right: 0;
|
|
13382
|
+
translate: 50% -50%;
|
|
13383
|
+
rotate: 135deg;
|
|
13384
|
+
}
|
|
13385
|
+
|
|
13386
|
+
.mx-popover__header {
|
|
13387
|
+
display: flex;
|
|
13388
|
+
align-items: center;
|
|
13389
|
+
justify-content: space-between;
|
|
13390
|
+
gap: var(--_popover-header-gap);
|
|
13391
|
+
}
|
|
13392
|
+
|
|
13393
|
+
.mx-popover__title {
|
|
13394
|
+
flex: 1 1 auto;
|
|
13395
|
+
min-inline-size: 0;
|
|
13396
|
+
}
|
|
13397
|
+
|
|
13398
|
+
.mx-popover__close {
|
|
13399
|
+
flex: none;
|
|
13400
|
+
margin-inline-start: auto;
|
|
13401
|
+
}
|
|
13402
|
+
|
|
13403
|
+
.mx-popover__body {
|
|
13404
|
+
min-inline-size: 0;
|
|
13405
|
+
}
|
|
13406
|
+
|
|
13407
|
+
@keyframes mx-popover-in {
|
|
13408
|
+
from {
|
|
13409
|
+
opacity: 0;
|
|
13410
|
+
translate: var(--_enter);
|
|
13411
|
+
}
|
|
13412
|
+
}
|
|
13413
|
+
}
|
|
13414
|
+
|
|
13415
|
+
/* LoadPanel: a layer over a container (absolute, inside it) or over the page (fixed), a pane in the middle with the
|
|
13416
|
+
indicator, the message and a Cancel button. Only the layout is here: the shade, the pane and the message are units
|
|
13417
|
+
of the schema; the indicator is the kit's spinner and the button the kit's, their look in the pane from the
|
|
13418
|
+
panel's places. A container it covers carries `data-mx-covered` (`position: relative`, as for the spinner's cover). */
|
|
13419
|
+
@layer mx.components {
|
|
13420
|
+
.mx-load-panel {
|
|
13421
|
+
position: absolute;
|
|
13422
|
+
inset: 0;
|
|
13423
|
+
z-index: var(--mx-z-overlay);
|
|
13424
|
+
display: flex;
|
|
13425
|
+
box-sizing: border-box;
|
|
13426
|
+
align-items: center;
|
|
13427
|
+
justify-content: center;
|
|
13428
|
+
padding: var(--_load-panel-padding);
|
|
13429
|
+
border-radius: inherit;
|
|
13430
|
+
outline: none;
|
|
13431
|
+
}
|
|
13432
|
+
|
|
13433
|
+
.mx-load-panel[data-page] {
|
|
13434
|
+
position: fixed;
|
|
13435
|
+
border-radius: 0;
|
|
13436
|
+
}
|
|
13437
|
+
|
|
13438
|
+
.mx-load-panel[hidden] {
|
|
13439
|
+
display: none;
|
|
13440
|
+
}
|
|
13441
|
+
|
|
13442
|
+
.mx-load-panel__pane {
|
|
13443
|
+
display: flex;
|
|
13444
|
+
flex-direction: column;
|
|
13445
|
+
box-sizing: border-box;
|
|
13446
|
+
align-items: center;
|
|
13447
|
+
gap: var(--_load-panel-gap);
|
|
13448
|
+
max-inline-size: 100%;
|
|
13449
|
+
text-align: center;
|
|
13450
|
+
}
|
|
13451
|
+
|
|
13452
|
+
.mx-load-panel__message:empty {
|
|
13453
|
+
display: none;
|
|
13454
|
+
}
|
|
13455
|
+
}
|
|
13456
|
+
|
|
13457
|
+
/* DateRangeBox: a field with two masked inputs, a separator between them, the calendars and the presets on a popup.
|
|
13458
|
+
Only the layout is here: the separator and the list of presets are units of the schema, the calendars a place. */
|
|
13459
|
+
@layer mx.components {
|
|
13460
|
+
.mx-date-range-box .mx-field__input {
|
|
13461
|
+
flex: 1 1 0;
|
|
13462
|
+
min-inline-size: 0;
|
|
13463
|
+
}
|
|
13464
|
+
|
|
13465
|
+
.mx-date-range-box__tools {
|
|
13466
|
+
display: flex;
|
|
13467
|
+
flex: 1 1 0;
|
|
13468
|
+
align-items: center;
|
|
13469
|
+
min-inline-size: 0;
|
|
13470
|
+
}
|
|
13471
|
+
|
|
13472
|
+
.mx-date-range-box__separator {
|
|
13473
|
+
flex: none;
|
|
13474
|
+
}
|
|
13475
|
+
|
|
13476
|
+
.mx-date-range-box__popup {
|
|
13477
|
+
display: flex;
|
|
13478
|
+
align-items: stretch;
|
|
13479
|
+
gap: var(--_date-range-box-popup-gap);
|
|
13480
|
+
}
|
|
13481
|
+
|
|
13482
|
+
.mx-date-range-box__presets {
|
|
13483
|
+
overflow: auto;
|
|
13484
|
+
}
|
|
13485
|
+
}
|
|
13486
|
+
|
|
13487
|
+
/* FileUploader: the field's box holds the select button, the drop hint and the Upload button; the files are listed
|
|
13488
|
+
under it. Only the layout is here: the box when a file is dragged over it, the select button, the hint, a row of
|
|
13489
|
+
the list, its texts and the state are units of the schema; the row's buttons and progress bar are the kit's,
|
|
13490
|
+
their look in a row from the uploader's places. */
|
|
13491
|
+
@layer mx.components {
|
|
13492
|
+
.mx-file-uploader .mx-field__box {
|
|
13493
|
+
flex-wrap: wrap;
|
|
13494
|
+
align-items: center;
|
|
13495
|
+
gap: var(--_file-uploader-box-gap);
|
|
13496
|
+
}
|
|
13497
|
+
|
|
13498
|
+
.mx-file-uploader__select,
|
|
13499
|
+
.mx-file-uploader__upload {
|
|
13500
|
+
display: inline-flex;
|
|
13501
|
+
align-items: center;
|
|
13502
|
+
gap: var(--_file-uploader-button-gap);
|
|
13503
|
+
margin: 0;
|
|
13504
|
+
border: 0;
|
|
13505
|
+
background: none;
|
|
13506
|
+
color: inherit;
|
|
13507
|
+
font: inherit;
|
|
13508
|
+
appearance: none;
|
|
13509
|
+
}
|
|
13510
|
+
|
|
13511
|
+
.mx-file-uploader__upload {
|
|
13512
|
+
margin-inline-start: auto;
|
|
13513
|
+
}
|
|
13514
|
+
|
|
13515
|
+
.mx-file-uploader__drop {
|
|
13516
|
+
flex: 1 1 auto;
|
|
13517
|
+
min-inline-size: 0;
|
|
13518
|
+
}
|
|
13519
|
+
|
|
13520
|
+
.mx-file-uploader__list {
|
|
13521
|
+
display: flex;
|
|
13522
|
+
flex-direction: column;
|
|
13523
|
+
margin: 0;
|
|
13524
|
+
padding: 0;
|
|
13525
|
+
list-style: none;
|
|
13526
|
+
}
|
|
13527
|
+
|
|
13528
|
+
.mx-file-uploader__item {
|
|
13529
|
+
display: flex;
|
|
13530
|
+
align-items: center;
|
|
13531
|
+
gap: var(--_file-uploader-item-gap);
|
|
13532
|
+
min-inline-size: 0;
|
|
13533
|
+
}
|
|
13534
|
+
|
|
13535
|
+
.mx-file-uploader__icon {
|
|
13536
|
+
flex: none;
|
|
13537
|
+
}
|
|
13538
|
+
|
|
13539
|
+
.mx-file-uploader__texts {
|
|
13540
|
+
display: flex;
|
|
13541
|
+
flex: 1 1 auto;
|
|
13542
|
+
flex-wrap: wrap;
|
|
13543
|
+
align-items: baseline;
|
|
13544
|
+
column-gap: var(--_file-uploader-item-gap);
|
|
13545
|
+
min-inline-size: 0;
|
|
13546
|
+
}
|
|
13547
|
+
|
|
13548
|
+
.mx-file-uploader__name {
|
|
13549
|
+
overflow: hidden;
|
|
13550
|
+
text-overflow: ellipsis;
|
|
13551
|
+
white-space: nowrap;
|
|
13552
|
+
}
|
|
13553
|
+
|
|
13554
|
+
.mx-file-uploader__progress {
|
|
13555
|
+
flex-basis: 100%;
|
|
13556
|
+
}
|
|
13557
|
+
|
|
13558
|
+
/* The bar's own label is the file's name, already on the row: kept for readers, not shown. */
|
|
13559
|
+
.mx-file-uploader__progress .mx-progress__head {
|
|
13560
|
+
position: absolute;
|
|
13561
|
+
inline-size: 1px;
|
|
13562
|
+
block-size: 1px;
|
|
13563
|
+
overflow: hidden;
|
|
13564
|
+
clip-path: inset(50%);
|
|
13565
|
+
white-space: nowrap;
|
|
13566
|
+
}
|
|
13567
|
+
|
|
13568
|
+
.mx-file-uploader__actions {
|
|
13569
|
+
display: inline-flex;
|
|
13570
|
+
flex: none;
|
|
13571
|
+
align-items: center;
|
|
13572
|
+
}
|
|
13573
|
+
}
|
|
13574
|
+
|
|
13575
|
+
/* Sortable: the items as they are, one under the other or side by side, a line where a drop would land, a copy of
|
|
13576
|
+
the item after the pointer. Only the layout is here: the container, an item (dragged or not), the line and the copy
|
|
13577
|
+
are units of the schema. */
|
|
13578
|
+
@layer mx.components {
|
|
13579
|
+
.mx-sortable {
|
|
13580
|
+
position: relative;
|
|
13581
|
+
display: flex;
|
|
13582
|
+
flex-direction: column;
|
|
13583
|
+
min-inline-size: 0;
|
|
13584
|
+
}
|
|
13585
|
+
|
|
13586
|
+
.mx-sortable[data-orientation='horizontal'] {
|
|
13587
|
+
flex-direction: row;
|
|
13588
|
+
flex-wrap: wrap;
|
|
13589
|
+
align-items: center;
|
|
13590
|
+
}
|
|
13591
|
+
|
|
13592
|
+
.mx-sortable__item {
|
|
13593
|
+
touch-action: pan-y;
|
|
13594
|
+
}
|
|
13595
|
+
|
|
13596
|
+
.mx-sortable[data-orientation='horizontal'] > .mx-sortable__item {
|
|
13597
|
+
touch-action: pan-x;
|
|
13598
|
+
}
|
|
13599
|
+
|
|
13600
|
+
.mx-sortable__item[data-dragging] {
|
|
13601
|
+
pointer-events: none;
|
|
13602
|
+
}
|
|
13603
|
+
|
|
13604
|
+
.mx-sortable__line {
|
|
13605
|
+
position: absolute;
|
|
13606
|
+
z-index: var(--mx-z-sticky);
|
|
13607
|
+
pointer-events: none;
|
|
13608
|
+
}
|
|
13609
|
+
|
|
13610
|
+
.mx-sortable:not([data-orientation='horizontal']) > .mx-sortable__line {
|
|
13611
|
+
inset-inline: 0;
|
|
13612
|
+
translate: 0 -50%;
|
|
13613
|
+
}
|
|
13614
|
+
|
|
13615
|
+
.mx-sortable[data-orientation='horizontal'] > .mx-sortable__line {
|
|
13616
|
+
inset-block: 0;
|
|
13617
|
+
translate: -50% 0;
|
|
13618
|
+
}
|
|
13619
|
+
|
|
13620
|
+
.mx-sortable[data-orientation='horizontal'] > .mx-sortable__line:dir(rtl) {
|
|
13621
|
+
translate: 50% 0;
|
|
13622
|
+
}
|
|
13623
|
+
|
|
13624
|
+
.mx-sortable__ghost {
|
|
13625
|
+
position: fixed;
|
|
13626
|
+
z-index: var(--mx-z-toast);
|
|
13627
|
+
pointer-events: none;
|
|
13628
|
+
}
|
|
13629
|
+
}
|
|
13630
|
+
|
|
13631
|
+
/* ScrollView: the box that scrolls, its content, a pull-down panel kept above the content and shown by moving the
|
|
13632
|
+
content down, a panel under the content while more loads. Only the layout is here: the box, the two panels and
|
|
13633
|
+
their texts are units of the schema. The scrollbars are the design system's; `data-bars` says when they show:
|
|
13634
|
+
`always` as they are, `onScroll` and `onHover` with the thumb clear until scrolling or the pointer, `never` none. */
|
|
13635
|
+
@layer mx.components {
|
|
13636
|
+
.mx-scroll-view {
|
|
13637
|
+
position: relative;
|
|
13638
|
+
box-sizing: border-box;
|
|
13639
|
+
min-inline-size: 0;
|
|
13640
|
+
min-block-size: 0;
|
|
13641
|
+
overflow: auto;
|
|
13642
|
+
overscroll-behavior: contain;
|
|
13643
|
+
}
|
|
13644
|
+
|
|
13645
|
+
.mx-scroll-view[data-direction='vertical'] {
|
|
13646
|
+
overflow-x: hidden;
|
|
13647
|
+
}
|
|
13648
|
+
|
|
13649
|
+
.mx-scroll-view[data-direction='horizontal'] {
|
|
13650
|
+
overflow-y: hidden;
|
|
13651
|
+
}
|
|
13652
|
+
|
|
13653
|
+
.mx-scroll-view[data-bars='never'] {
|
|
13654
|
+
scrollbar-width: none;
|
|
13655
|
+
}
|
|
13656
|
+
|
|
13657
|
+
.mx-scroll-view[data-bars='never']::-webkit-scrollbar {
|
|
13658
|
+
display: none;
|
|
13659
|
+
}
|
|
13660
|
+
|
|
13661
|
+
.mx-scroll-view[data-bars='onScroll']:not([data-scrolling])::-webkit-scrollbar-thumb,
|
|
13662
|
+
.mx-scroll-view[data-bars='onHover']:not(:hover, :focus-within)::-webkit-scrollbar-thumb {
|
|
13663
|
+
background-color: transparent;
|
|
13664
|
+
}
|
|
13665
|
+
|
|
13666
|
+
.mx-scroll-view__content {
|
|
13667
|
+
min-inline-size: 100%;
|
|
13668
|
+
transition: translate var(--mx-motion-duration-normal) var(--mx-motion-easing-out);
|
|
13669
|
+
}
|
|
13670
|
+
|
|
13671
|
+
.mx-scroll-view[data-pulling] > .mx-scroll-view__content {
|
|
13672
|
+
transition: none;
|
|
13673
|
+
}
|
|
13674
|
+
|
|
13675
|
+
.mx-scroll-view__pull,
|
|
13676
|
+
.mx-scroll-view__bottom {
|
|
13677
|
+
display: flex;
|
|
13678
|
+
box-sizing: border-box;
|
|
13679
|
+
align-items: center;
|
|
13680
|
+
justify-content: center;
|
|
13681
|
+
gap: var(--_scroll-view-panel-gap);
|
|
13682
|
+
block-size: var(--_scroll-view-panel-height);
|
|
13683
|
+
}
|
|
13684
|
+
|
|
13685
|
+
/* Above the content, out of sight until the content is pulled down. */
|
|
13686
|
+
.mx-scroll-view__pull {
|
|
13687
|
+
margin-block-start: calc(-1 * var(--_scroll-view-panel-height));
|
|
13688
|
+
}
|
|
13689
|
+
}
|
|
13690
|
+
|
|
12499
13691
|
/* Toast and Toaster. A toaster is a region with a fixed stack at each edge position in use; a toast
|
|
12500
13692
|
is a surface whose tone shows in its glyph and wherever a design language draws it (the units in
|
|
12501
13693
|
units.css: the surface, a stripe along its start edge, a timer line along its bottom, the glyph on
|
|
@@ -19676,6 +20868,30 @@
|
|
|
19676
20868
|
background-color: var(--_calendar-cell-selected-hover-bg, var(--_calendar-cell-selected-bg, transparent));
|
|
19677
20869
|
}
|
|
19678
20870
|
|
|
20871
|
+
.mx-calendar__cell[data-range='start'] {
|
|
20872
|
+
background-color: var(--_calendar-cell-range-start-bg, transparent);
|
|
20873
|
+
color: var(--_calendar-cell-range-start-color, inherit);
|
|
20874
|
+
}
|
|
20875
|
+
|
|
20876
|
+
.mx-calendar__cell[data-range='end'] {
|
|
20877
|
+
background-color: var(--_calendar-cell-range-end-bg, var(--_calendar-cell-range-start-bg, transparent));
|
|
20878
|
+
color: var(--_calendar-cell-range-end-color, var(--_calendar-cell-range-start-color, inherit));
|
|
20879
|
+
}
|
|
20880
|
+
|
|
20881
|
+
.mx-calendar__cell[data-range='single'] {
|
|
20882
|
+
background-color: var(--_calendar-cell-range-single-bg, var(--_calendar-cell-range-start-bg, transparent));
|
|
20883
|
+
color: var(--_calendar-cell-range-single-color, var(--_calendar-cell-range-start-color, inherit));
|
|
20884
|
+
}
|
|
20885
|
+
|
|
20886
|
+
.mx-calendar__cell[data-range='in'] {
|
|
20887
|
+
background-color: var(--_calendar-cell-range-in-bg, transparent);
|
|
20888
|
+
border-start-start-radius: var(--_calendar-cell-range-in-radius, var(--_calendar-cell-radius, 0px));
|
|
20889
|
+
border-start-end-radius: var(--_calendar-cell-range-in-radius, var(--_calendar-cell-radius, 0px));
|
|
20890
|
+
border-end-start-radius: var(--_calendar-cell-range-in-radius, var(--_calendar-cell-radius, 0px));
|
|
20891
|
+
border-end-end-radius: var(--_calendar-cell-range-in-radius, var(--_calendar-cell-radius, 0px));
|
|
20892
|
+
color: var(--_calendar-cell-range-in-color, inherit);
|
|
20893
|
+
}
|
|
20894
|
+
|
|
19679
20895
|
.mx-calendar__cell[aria-disabled='true'] {
|
|
19680
20896
|
color: var(--_calendar-cell-disabled-color, inherit);
|
|
19681
20897
|
}
|
|
@@ -21357,6 +22573,40 @@
|
|
|
21357
22573
|
border-inline-start-color: var(--_date-box-times-beside-border-start-color, currentcolor);
|
|
21358
22574
|
}
|
|
21359
22575
|
|
|
22576
|
+
.mx-date-range-box__separator {
|
|
22577
|
+
inline-size: var(--_date-range-box-separator-size, auto);
|
|
22578
|
+
block-size: var(--_date-range-box-separator-size, auto);
|
|
22579
|
+
margin-inline-end: var(--_date-range-box-separator-margin-inline, 0px);
|
|
22580
|
+
margin-inline-start: var(--_date-range-box-separator-margin-inline, 0px);
|
|
22581
|
+
background-color: var(--_date-range-box-separator-bg, transparent);
|
|
22582
|
+
--_icon: var(--_date-range-box-separator-icon, none);
|
|
22583
|
+
}
|
|
22584
|
+
|
|
22585
|
+
.mx-date-range-box__popup > .mx-date-range-box__presets {
|
|
22586
|
+
min-inline-size: var(--_date-range-box-presets-min-width, auto);
|
|
22587
|
+
max-block-size: var(--_date-range-box-presets-max-height, none);
|
|
22588
|
+
border-style: solid;
|
|
22589
|
+
border-block-start-width: 0px;
|
|
22590
|
+
border-inline-end-width: 0px;
|
|
22591
|
+
border-block-end-width: 0px;
|
|
22592
|
+
border-inline-start-width: 0px;
|
|
22593
|
+
outline-style: solid;
|
|
22594
|
+
outline-width: 0px;
|
|
22595
|
+
}
|
|
22596
|
+
|
|
22597
|
+
.mx-date-range-box__popup > .mx-date-range-box__presets:focus-visible {
|
|
22598
|
+
box-shadow: var(--_date-range-box-presets-focus-glow, 0 0 #0000), 0 0 #0000;
|
|
22599
|
+
outline-width: var(--_date-range-box-presets-focus-outline-width, 0px);
|
|
22600
|
+
outline-color: var(--_date-range-box-presets-focus-outline-color, currentcolor);
|
|
22601
|
+
outline-offset: var(--_date-range-box-presets-focus-outline-offset, 0px);
|
|
22602
|
+
}
|
|
22603
|
+
|
|
22604
|
+
.mx-date-range-box__popup > .mx-calendar + .mx-date-range-box__presets {
|
|
22605
|
+
padding-inline-start: var(--_date-range-box-presets-beside-padding-start, 0px);
|
|
22606
|
+
border-inline-start-width: var(--_date-range-box-presets-beside-border-start-width, 0px);
|
|
22607
|
+
border-inline-start-color: var(--_date-range-box-presets-beside-border-start-color, currentcolor);
|
|
22608
|
+
}
|
|
22609
|
+
|
|
21360
22610
|
:where([data-disabled] [aria-disabled='true'], [data-disabled][aria-disabled='true']) {
|
|
21361
22611
|
color: var(--_disabled-element-color, inherit);
|
|
21362
22612
|
cursor: default;
|
|
@@ -21517,15 +22767,15 @@
|
|
|
21517
22767
|
padding-inline-start: var(--_padding-start);
|
|
21518
22768
|
gap: var(--_field-gap);
|
|
21519
22769
|
background-color: var(--_field-box-bg, transparent);
|
|
21520
|
-
border-style: solid;
|
|
22770
|
+
border-style: var(--_field-box-border-style, solid);
|
|
21521
22771
|
border-block-start-width: var(--_field-border-width);
|
|
21522
22772
|
border-inline-end-width: var(--_field-border-width);
|
|
21523
22773
|
border-block-end-width: var(--_field-border-width);
|
|
21524
22774
|
border-inline-start-width: var(--_field-border-width);
|
|
21525
|
-
border-block-start-color: transparent;
|
|
21526
|
-
border-inline-end-color: transparent;
|
|
21527
|
-
border-block-end-color: transparent;
|
|
21528
|
-
border-inline-start-color: transparent;
|
|
22775
|
+
border-block-start-color: var(--_field-box-border-color, transparent);
|
|
22776
|
+
border-inline-end-color: var(--_field-box-border-color, transparent);
|
|
22777
|
+
border-block-end-color: var(--_field-box-border-color, transparent);
|
|
22778
|
+
border-inline-start-color: var(--_field-box-border-color, transparent);
|
|
21529
22779
|
border-start-start-radius: var(--_field-box-radius, 0px);
|
|
21530
22780
|
border-start-end-radius: var(--_field-box-radius, 0px);
|
|
21531
22781
|
border-end-start-radius: var(--_field-box-radius, 0px);
|
|
@@ -22187,6 +23437,163 @@
|
|
|
22187
23437
|
margin-inline-start: auto;
|
|
22188
23438
|
}
|
|
22189
23439
|
|
|
23440
|
+
.mx-file-uploader[data-dragover] .mx-field__box {
|
|
23441
|
+
background-color: var(--_file-uploader-over-bg, transparent);
|
|
23442
|
+
border-block-start-color: var(--_file-uploader-over-border-color, currentcolor);
|
|
23443
|
+
border-inline-end-color: var(--_file-uploader-over-border-color, currentcolor);
|
|
23444
|
+
border-block-end-color: var(--_file-uploader-over-border-color, currentcolor);
|
|
23445
|
+
border-inline-start-color: var(--_file-uploader-over-border-color, currentcolor);
|
|
23446
|
+
}
|
|
23447
|
+
|
|
23448
|
+
.mx-file-uploader__select {
|
|
23449
|
+
padding-block-start: var(--_file-uploader-select-padding-block, 0px);
|
|
23450
|
+
padding-inline-end: var(--_file-uploader-select-padding-inline, 0px);
|
|
23451
|
+
padding-block-end: var(--_file-uploader-select-padding-block, 0px);
|
|
23452
|
+
padding-inline-start: var(--_file-uploader-select-padding-inline, 0px);
|
|
23453
|
+
background-color: var(--_file-uploader-select-bg, transparent);
|
|
23454
|
+
border-style: solid;
|
|
23455
|
+
border-block-start-width: var(--_file-uploader-select-border-width, 0px);
|
|
23456
|
+
border-inline-end-width: var(--_file-uploader-select-border-width, 0px);
|
|
23457
|
+
border-block-end-width: var(--_file-uploader-select-border-width, 0px);
|
|
23458
|
+
border-inline-start-width: var(--_file-uploader-select-border-width, 0px);
|
|
23459
|
+
border-block-start-color: var(--_file-uploader-select-border-color, currentcolor);
|
|
23460
|
+
border-inline-end-color: var(--_file-uploader-select-border-color, currentcolor);
|
|
23461
|
+
border-block-end-color: var(--_file-uploader-select-border-color, currentcolor);
|
|
23462
|
+
border-inline-start-color: var(--_file-uploader-select-border-color, currentcolor);
|
|
23463
|
+
border-start-start-radius: var(--_file-uploader-select-radius, 0px);
|
|
23464
|
+
border-start-end-radius: var(--_file-uploader-select-radius, 0px);
|
|
23465
|
+
border-end-start-radius: var(--_file-uploader-select-radius, 0px);
|
|
23466
|
+
border-end-end-radius: var(--_file-uploader-select-radius, 0px);
|
|
23467
|
+
color: var(--_file-uploader-select-color, inherit);
|
|
23468
|
+
font-weight: var(--_file-uploader-select-font-weight, inherit);
|
|
23469
|
+
outline-style: solid;
|
|
23470
|
+
outline-width: 0px;
|
|
23471
|
+
cursor: default;
|
|
23472
|
+
}
|
|
23473
|
+
|
|
23474
|
+
.mx-file-uploader__select:not(:disabled):hover {
|
|
23475
|
+
background-color: var(--_file-uploader-select-hover-bg, var(--_file-uploader-select-bg, transparent));
|
|
23476
|
+
cursor: var(--_file-uploader-select-hover-cursor, default);
|
|
23477
|
+
}
|
|
23478
|
+
|
|
23479
|
+
.mx-file-uploader__select:not(:disabled):active {
|
|
23480
|
+
background-color: var(--_file-uploader-select-pressed-bg, var(--_file-uploader-select-hover-bg, var(--_file-uploader-select-bg, transparent)));
|
|
23481
|
+
}
|
|
23482
|
+
|
|
23483
|
+
.mx-file-uploader__select:focus-visible {
|
|
23484
|
+
box-shadow: var(--_file-uploader-select-focus-glow, 0 0 #0000), 0 0 #0000;
|
|
23485
|
+
outline-width: var(--_file-uploader-select-focus-outline-width, 0px);
|
|
23486
|
+
outline-color: var(--_file-uploader-select-focus-outline-color, currentcolor);
|
|
23487
|
+
outline-offset: var(--_file-uploader-select-focus-outline-offset, 0px);
|
|
23488
|
+
}
|
|
23489
|
+
|
|
23490
|
+
.mx-file-uploader__select:disabled {
|
|
23491
|
+
border-block-start-color: var(--_file-uploader-select-disabled-border-color, var(--_file-uploader-select-border-color, currentcolor));
|
|
23492
|
+
border-inline-end-color: var(--_file-uploader-select-disabled-border-color, var(--_file-uploader-select-border-color, currentcolor));
|
|
23493
|
+
border-block-end-color: var(--_file-uploader-select-disabled-border-color, var(--_file-uploader-select-border-color, currentcolor));
|
|
23494
|
+
border-inline-start-color: var(--_file-uploader-select-disabled-border-color, var(--_file-uploader-select-border-color, currentcolor));
|
|
23495
|
+
color: var(--_file-uploader-select-disabled-color, var(--_file-uploader-select-color, inherit));
|
|
23496
|
+
}
|
|
23497
|
+
|
|
23498
|
+
.mx-file-uploader__upload {
|
|
23499
|
+
padding-block-start: var(--_file-uploader-upload-padding-block, 0px);
|
|
23500
|
+
padding-inline-end: var(--_file-uploader-upload-padding-inline, 0px);
|
|
23501
|
+
padding-block-end: var(--_file-uploader-upload-padding-block, 0px);
|
|
23502
|
+
padding-inline-start: var(--_file-uploader-upload-padding-inline, 0px);
|
|
23503
|
+
background-color: var(--_file-uploader-upload-bg, transparent);
|
|
23504
|
+
border-style: solid;
|
|
23505
|
+
border-block-start-width: var(--_file-uploader-upload-border-width, 0px);
|
|
23506
|
+
border-inline-end-width: var(--_file-uploader-upload-border-width, 0px);
|
|
23507
|
+
border-block-end-width: var(--_file-uploader-upload-border-width, 0px);
|
|
23508
|
+
border-inline-start-width: var(--_file-uploader-upload-border-width, 0px);
|
|
23509
|
+
border-block-start-color: var(--_file-uploader-upload-border-color, currentcolor);
|
|
23510
|
+
border-inline-end-color: var(--_file-uploader-upload-border-color, currentcolor);
|
|
23511
|
+
border-block-end-color: var(--_file-uploader-upload-border-color, currentcolor);
|
|
23512
|
+
border-inline-start-color: var(--_file-uploader-upload-border-color, currentcolor);
|
|
23513
|
+
border-start-start-radius: var(--_file-uploader-upload-radius, 0px);
|
|
23514
|
+
border-start-end-radius: var(--_file-uploader-upload-radius, 0px);
|
|
23515
|
+
border-end-start-radius: var(--_file-uploader-upload-radius, 0px);
|
|
23516
|
+
border-end-end-radius: var(--_file-uploader-upload-radius, 0px);
|
|
23517
|
+
color: var(--_file-uploader-upload-color, inherit);
|
|
23518
|
+
font-weight: var(--_file-uploader-upload-font-weight, inherit);
|
|
23519
|
+
outline-style: solid;
|
|
23520
|
+
outline-width: 0px;
|
|
23521
|
+
cursor: default;
|
|
23522
|
+
}
|
|
23523
|
+
|
|
23524
|
+
.mx-file-uploader__upload:not(:disabled):hover {
|
|
23525
|
+
background-color: var(--_file-uploader-upload-hover-bg, var(--_file-uploader-upload-bg, transparent));
|
|
23526
|
+
cursor: var(--_file-uploader-upload-hover-cursor, default);
|
|
23527
|
+
}
|
|
23528
|
+
|
|
23529
|
+
.mx-file-uploader__upload:not(:disabled):active {
|
|
23530
|
+
background-color: var(--_file-uploader-upload-pressed-bg, var(--_file-uploader-upload-hover-bg, var(--_file-uploader-upload-bg, transparent)));
|
|
23531
|
+
}
|
|
23532
|
+
|
|
23533
|
+
.mx-file-uploader__upload:focus-visible {
|
|
23534
|
+
box-shadow: var(--_file-uploader-upload-focus-glow, 0 0 #0000), 0 0 #0000;
|
|
23535
|
+
outline-width: var(--_file-uploader-upload-focus-outline-width, 0px);
|
|
23536
|
+
outline-color: var(--_file-uploader-upload-focus-outline-color, currentcolor);
|
|
23537
|
+
outline-offset: var(--_file-uploader-upload-focus-outline-offset, 0px);
|
|
23538
|
+
}
|
|
23539
|
+
|
|
23540
|
+
.mx-file-uploader__drop {
|
|
23541
|
+
color: var(--_file-uploader-hint-color, inherit);
|
|
23542
|
+
}
|
|
23543
|
+
|
|
23544
|
+
.mx-file-uploader__list {
|
|
23545
|
+
margin-block-start: var(--_file-uploader-list-margin-top, 0px);
|
|
23546
|
+
gap: var(--_file-uploader-list-gap, normal);
|
|
23547
|
+
}
|
|
23548
|
+
|
|
23549
|
+
.mx-file-uploader__item {
|
|
23550
|
+
padding-block-start: var(--_file-uploader-item-padding-block, 0px);
|
|
23551
|
+
padding-inline-end: var(--_file-uploader-item-padding-inline, 0px);
|
|
23552
|
+
padding-block-end: var(--_file-uploader-item-padding-block, 0px);
|
|
23553
|
+
padding-inline-start: var(--_file-uploader-item-padding-inline, 0px);
|
|
23554
|
+
border-start-start-radius: var(--_file-uploader-item-radius, 0px);
|
|
23555
|
+
border-start-end-radius: var(--_file-uploader-item-radius, 0px);
|
|
23556
|
+
border-end-start-radius: var(--_file-uploader-item-radius, 0px);
|
|
23557
|
+
border-end-end-radius: var(--_file-uploader-item-radius, 0px);
|
|
23558
|
+
}
|
|
23559
|
+
|
|
23560
|
+
.mx-file-uploader__item[data-status='error'] {
|
|
23561
|
+
background-color: var(--_file-uploader-item-error-bg, transparent);
|
|
23562
|
+
}
|
|
23563
|
+
|
|
23564
|
+
.mx-file-uploader__item[data-status='invalid'] {
|
|
23565
|
+
background-color: var(--_file-uploader-item-invalid-bg, transparent);
|
|
23566
|
+
}
|
|
23567
|
+
|
|
23568
|
+
.mx-file-uploader__icon {
|
|
23569
|
+
inline-size: var(--_file-uploader-icon-size, auto);
|
|
23570
|
+
block-size: var(--_file-uploader-icon-size, auto);
|
|
23571
|
+
background-color: var(--_file-uploader-icon-bg, transparent);
|
|
23572
|
+
--_icon: var(--_file-uploader-icon-icon, none);
|
|
23573
|
+
}
|
|
23574
|
+
|
|
23575
|
+
.mx-file-uploader__name {
|
|
23576
|
+
color: var(--_file-uploader-name-color, inherit);
|
|
23577
|
+
}
|
|
23578
|
+
|
|
23579
|
+
.mx-file-uploader__size {
|
|
23580
|
+
color: var(--_file-uploader-size-color, inherit);
|
|
23581
|
+
font-size: var(--_file-uploader-size-font-size, inherit);
|
|
23582
|
+
}
|
|
23583
|
+
|
|
23584
|
+
.mx-file-uploader__state {
|
|
23585
|
+
color: var(--_file-uploader-state-color, inherit);
|
|
23586
|
+
font-size: var(--_file-uploader-state-font-size, inherit);
|
|
23587
|
+
}
|
|
23588
|
+
|
|
23589
|
+
.mx-file-uploader__item[data-status='done'] .mx-file-uploader__state {
|
|
23590
|
+
color: var(--_file-uploader-state-done-color, var(--_file-uploader-state-color, inherit));
|
|
23591
|
+
}
|
|
23592
|
+
|
|
23593
|
+
.mx-file-uploader__item:is([data-status='error'], [data-status='invalid']) .mx-file-uploader__state {
|
|
23594
|
+
color: var(--_file-uploader-state-error-color, var(--_file-uploader-state-color, inherit));
|
|
23595
|
+
}
|
|
23596
|
+
|
|
22190
23597
|
.mx-filter-builder {
|
|
22191
23598
|
color: var(--_filterbuilder-container-color, inherit);
|
|
22192
23599
|
font-size: var(--_filterbuilder-container-font-size, inherit);
|
|
@@ -22624,6 +24031,45 @@
|
|
|
22624
24031
|
background-color: var(--_listbox-idle-bg, transparent);
|
|
22625
24032
|
}
|
|
22626
24033
|
|
|
24034
|
+
.mx-load-panel[data-shade] {
|
|
24035
|
+
background-color: var(--_load-panel-shade-shaded-bg, transparent);
|
|
24036
|
+
}
|
|
24037
|
+
|
|
24038
|
+
.mx-load-panel__pane {
|
|
24039
|
+
border-style: solid;
|
|
24040
|
+
border-block-start-width: 0px;
|
|
24041
|
+
border-inline-end-width: 0px;
|
|
24042
|
+
border-block-end-width: 0px;
|
|
24043
|
+
border-inline-start-width: 0px;
|
|
24044
|
+
}
|
|
24045
|
+
|
|
24046
|
+
.mx-load-panel[data-pane] > .mx-load-panel__pane {
|
|
24047
|
+
min-inline-size: var(--_load-panel-pane-shown-min-width, auto);
|
|
24048
|
+
padding-block-start: var(--_load-panel-pane-shown-padding-block, 0px);
|
|
24049
|
+
padding-inline-end: var(--_load-panel-pane-shown-padding-inline, 0px);
|
|
24050
|
+
padding-block-end: var(--_load-panel-pane-shown-padding-block, 0px);
|
|
24051
|
+
padding-inline-start: var(--_load-panel-pane-shown-padding-inline, 0px);
|
|
24052
|
+
background-color: var(--_load-panel-pane-shown-bg, transparent);
|
|
24053
|
+
border-block-start-width: var(--_load-panel-pane-shown-border-width, 0px);
|
|
24054
|
+
border-inline-end-width: var(--_load-panel-pane-shown-border-width, 0px);
|
|
24055
|
+
border-block-end-width: var(--_load-panel-pane-shown-border-width, 0px);
|
|
24056
|
+
border-inline-start-width: var(--_load-panel-pane-shown-border-width, 0px);
|
|
24057
|
+
border-block-start-color: var(--_load-panel-pane-shown-border-color, currentcolor);
|
|
24058
|
+
border-inline-end-color: var(--_load-panel-pane-shown-border-color, currentcolor);
|
|
24059
|
+
border-block-end-color: var(--_load-panel-pane-shown-border-color, currentcolor);
|
|
24060
|
+
border-inline-start-color: var(--_load-panel-pane-shown-border-color, currentcolor);
|
|
24061
|
+
border-start-start-radius: var(--_load-panel-pane-shown-radius, 0px);
|
|
24062
|
+
border-start-end-radius: var(--_load-panel-pane-shown-radius, 0px);
|
|
24063
|
+
border-end-start-radius: var(--_load-panel-pane-shown-radius, 0px);
|
|
24064
|
+
border-end-end-radius: var(--_load-panel-pane-shown-radius, 0px);
|
|
24065
|
+
box-shadow: var(--_load-panel-pane-shown-shadow, none);
|
|
24066
|
+
}
|
|
24067
|
+
|
|
24068
|
+
.mx-load-panel__message {
|
|
24069
|
+
color: var(--_load-panel-message-color, inherit);
|
|
24070
|
+
font-size: var(--_load-panel-message-font-size, inherit);
|
|
24071
|
+
}
|
|
24072
|
+
|
|
22627
24073
|
.mx-lookup__header {
|
|
22628
24074
|
padding-block-start: var(--_lookup-header-padding-block, 0px);
|
|
22629
24075
|
padding-inline-end: var(--_lookup-header-padding-inline, 0px);
|
|
@@ -22910,6 +24356,78 @@
|
|
|
22910
24356
|
font-size: var(--_pagination-info-font-size, inherit);
|
|
22911
24357
|
}
|
|
22912
24358
|
|
|
24359
|
+
.mx-popover {
|
|
24360
|
+
max-inline-size: var(--_popover-surface-max-width, none);
|
|
24361
|
+
background-color: var(--_popover-surface-bg, transparent);
|
|
24362
|
+
border-style: solid;
|
|
24363
|
+
border-block-start-width: var(--_popover-surface-border-width, 0px);
|
|
24364
|
+
border-inline-end-width: var(--_popover-surface-border-width, 0px);
|
|
24365
|
+
border-block-end-width: var(--_popover-surface-border-width, 0px);
|
|
24366
|
+
border-inline-start-width: var(--_popover-surface-border-width, 0px);
|
|
24367
|
+
border-block-start-color: var(--_popover-surface-border-color, currentcolor);
|
|
24368
|
+
border-inline-end-color: var(--_popover-surface-border-color, currentcolor);
|
|
24369
|
+
border-block-end-color: var(--_popover-surface-border-color, currentcolor);
|
|
24370
|
+
border-inline-start-color: var(--_popover-surface-border-color, currentcolor);
|
|
24371
|
+
border-start-start-radius: var(--_popover-surface-radius, 0px);
|
|
24372
|
+
border-start-end-radius: var(--_popover-surface-radius, 0px);
|
|
24373
|
+
border-end-start-radius: var(--_popover-surface-radius, 0px);
|
|
24374
|
+
border-end-end-radius: var(--_popover-surface-radius, 0px);
|
|
24375
|
+
box-shadow: 0 0 #0000, var(--_popover-surface-shadow, 0 0 #0000);
|
|
24376
|
+
color: var(--_popover-surface-color, inherit);
|
|
24377
|
+
font-size: var(--_popover-surface-font-size, inherit);
|
|
24378
|
+
line-height: var(--_popover-surface-line-height, inherit);
|
|
24379
|
+
outline-style: solid;
|
|
24380
|
+
outline-width: 0px;
|
|
24381
|
+
}
|
|
24382
|
+
|
|
24383
|
+
.mx-popover:focus-visible {
|
|
24384
|
+
box-shadow: var(--_popover-surface-focus-glow, 0 0 #0000), var(--_popover-surface-shadow, 0 0 #0000);
|
|
24385
|
+
outline-width: var(--_popover-surface-focus-outline-width, 0px);
|
|
24386
|
+
outline-color: var(--_popover-surface-focus-outline-color, currentcolor);
|
|
24387
|
+
outline-offset: var(--_popover-surface-focus-outline-offset, 0px);
|
|
24388
|
+
}
|
|
24389
|
+
|
|
24390
|
+
.mx-popover__arrow {
|
|
24391
|
+
display: var(--_popover-arrow-display, none);
|
|
24392
|
+
inline-size: var(--_popover-arrow-size, auto);
|
|
24393
|
+
block-size: var(--_popover-arrow-size, auto);
|
|
24394
|
+
background-color: var(--_popover-arrow-bg, transparent);
|
|
24395
|
+
border-style: solid;
|
|
24396
|
+
border-block-start-width: var(--_popover-arrow-border-width, 0px);
|
|
24397
|
+
border-inline-end-width: var(--_popover-arrow-border-width, 0px);
|
|
24398
|
+
border-block-end-width: var(--_popover-arrow-border-width, 0px);
|
|
24399
|
+
border-inline-start-width: var(--_popover-arrow-border-width, 0px);
|
|
24400
|
+
border-block-start-color: var(--_popover-arrow-border-color, currentcolor);
|
|
24401
|
+
border-inline-end-color: var(--_popover-arrow-border-color, currentcolor);
|
|
24402
|
+
border-block-end-color: var(--_popover-arrow-border-color, currentcolor);
|
|
24403
|
+
border-inline-start-color: var(--_popover-arrow-border-color, currentcolor);
|
|
24404
|
+
}
|
|
24405
|
+
|
|
24406
|
+
.mx-popover__header {
|
|
24407
|
+
padding-block-start: var(--_popover-header-padding-block, 0px);
|
|
24408
|
+
padding-inline-end: var(--_popover-header-padding-end, 0px);
|
|
24409
|
+
padding-block-end: var(--_popover-header-padding-block, 0px);
|
|
24410
|
+
padding-inline-start: var(--_popover-header-padding-start, 0px);
|
|
24411
|
+
border-style: solid;
|
|
24412
|
+
border-block-start-width: 0px;
|
|
24413
|
+
border-inline-end-width: 0px;
|
|
24414
|
+
border-block-end-width: var(--_popover-header-border-bottom-width, 0px);
|
|
24415
|
+
border-inline-start-width: 0px;
|
|
24416
|
+
border-block-end-color: var(--_popover-header-border-bottom-color, currentcolor);
|
|
24417
|
+
}
|
|
24418
|
+
|
|
24419
|
+
.mx-popover__title {
|
|
24420
|
+
color: var(--_popover-title-color, inherit);
|
|
24421
|
+
font-weight: var(--_popover-title-font-weight, inherit);
|
|
24422
|
+
}
|
|
24423
|
+
|
|
24424
|
+
.mx-popover__body {
|
|
24425
|
+
padding-block-start: var(--_popover-body-padding, 0px);
|
|
24426
|
+
padding-inline-end: var(--_popover-body-padding, 0px);
|
|
24427
|
+
padding-block-end: var(--_popover-body-padding, 0px);
|
|
24428
|
+
padding-inline-start: var(--_popover-body-padding, 0px);
|
|
24429
|
+
}
|
|
24430
|
+
|
|
22913
24431
|
.mx-popup {
|
|
22914
24432
|
padding-block-start: var(--_popup-surface-padding-block, var(--_popup-surface-padding, 0px));
|
|
22915
24433
|
padding-inline-end: var(--_popup-surface-padding-inline, var(--_popup-surface-padding, 0px));
|
|
@@ -24256,6 +25774,32 @@
|
|
|
24256
25774
|
color: var(--_scheduler-state-danger-color, inherit);
|
|
24257
25775
|
}
|
|
24258
25776
|
|
|
25777
|
+
.mx-scroll-view {
|
|
25778
|
+
outline-style: solid;
|
|
25779
|
+
outline-width: 0px;
|
|
25780
|
+
}
|
|
25781
|
+
|
|
25782
|
+
.mx-scroll-view:focus-visible {
|
|
25783
|
+
box-shadow: var(--_scroll-view-box-focus-glow, 0 0 #0000), 0 0 #0000;
|
|
25784
|
+
outline-width: var(--_scroll-view-box-focus-outline-width, 0px);
|
|
25785
|
+
outline-color: var(--_scroll-view-box-focus-outline-color, currentcolor);
|
|
25786
|
+
outline-offset: var(--_scroll-view-box-focus-outline-offset, 0px);
|
|
25787
|
+
}
|
|
25788
|
+
|
|
25789
|
+
.mx-scroll-view__pull {
|
|
25790
|
+
color: var(--_scroll-view-pull-color, inherit);
|
|
25791
|
+
font-size: var(--_scroll-view-pull-font-size, inherit);
|
|
25792
|
+
}
|
|
25793
|
+
|
|
25794
|
+
.mx-scroll-view[data-pull-state='refreshing'] .mx-scroll-view__pull {
|
|
25795
|
+
color: var(--_scroll-view-pull-refreshing-color, var(--_scroll-view-pull-color, inherit));
|
|
25796
|
+
}
|
|
25797
|
+
|
|
25798
|
+
.mx-scroll-view__bottom {
|
|
25799
|
+
color: var(--_scroll-view-bottom-color, inherit);
|
|
25800
|
+
font-size: var(--_scroll-view-bottom-font-size, inherit);
|
|
25801
|
+
}
|
|
25802
|
+
|
|
24259
25803
|
.mx-bottom-sheet__scrim {
|
|
24260
25804
|
background-color: var(--_sheet-scrim-bg, transparent);
|
|
24261
25805
|
}
|
|
@@ -24655,6 +26199,61 @@
|
|
|
24655
26199
|
display: none;
|
|
24656
26200
|
}
|
|
24657
26201
|
|
|
26202
|
+
.mx-sortable {
|
|
26203
|
+
gap: var(--_sortable-gap);
|
|
26204
|
+
}
|
|
26205
|
+
|
|
26206
|
+
.mx-sortable[data-drop-target] {
|
|
26207
|
+
background-color: var(--_sortable-container-target-bg, transparent);
|
|
26208
|
+
}
|
|
26209
|
+
|
|
26210
|
+
.mx-sortable__item {
|
|
26211
|
+
outline-style: solid;
|
|
26212
|
+
outline-width: 0px;
|
|
26213
|
+
}
|
|
26214
|
+
|
|
26215
|
+
.mx-sortable[data-sortable] > .mx-sortable__item {
|
|
26216
|
+
cursor: var(--_sortable-item-sortable-cursor, inherit);
|
|
26217
|
+
}
|
|
26218
|
+
|
|
26219
|
+
.mx-sortable__item[data-dragging] {
|
|
26220
|
+
opacity: var(--_sortable-item-dragging-opacity, 1);
|
|
26221
|
+
}
|
|
26222
|
+
|
|
26223
|
+
.mx-sortable__item:focus-visible {
|
|
26224
|
+
box-shadow: var(--_sortable-item-focus-glow, 0 0 #0000), 0 0 #0000;
|
|
26225
|
+
outline-width: var(--_sortable-item-focus-outline-width, 0px);
|
|
26226
|
+
outline-color: var(--_sortable-item-focus-outline-color, currentcolor);
|
|
26227
|
+
outline-offset: var(--_sortable-item-focus-outline-offset, 0px);
|
|
26228
|
+
}
|
|
26229
|
+
|
|
26230
|
+
.mx-sortable__line {
|
|
26231
|
+
block-size: var(--_sortable-line-height, auto);
|
|
26232
|
+
background-color: var(--_sortable-line-bg, transparent);
|
|
26233
|
+
border-start-start-radius: var(--_sortable-line-radius, 0px);
|
|
26234
|
+
border-start-end-radius: var(--_sortable-line-radius, 0px);
|
|
26235
|
+
border-end-start-radius: var(--_sortable-line-radius, 0px);
|
|
26236
|
+
border-end-end-radius: var(--_sortable-line-radius, 0px);
|
|
26237
|
+
}
|
|
26238
|
+
|
|
26239
|
+
.mx-sortable__line:where(.mx-sortable[data-orientation='horizontal'] *) {
|
|
26240
|
+
block-size: auto;
|
|
26241
|
+
inline-size: var(--_sortable-line-height, auto);
|
|
26242
|
+
border-start-start-radius: var(--_sortable-line-radius, 0px);
|
|
26243
|
+
border-end-start-radius: var(--_sortable-line-radius, 0px);
|
|
26244
|
+
border-start-end-radius: var(--_sortable-line-radius, 0px);
|
|
26245
|
+
border-end-end-radius: var(--_sortable-line-radius, 0px);
|
|
26246
|
+
}
|
|
26247
|
+
|
|
26248
|
+
.mx-sortable__ghost {
|
|
26249
|
+
border-start-start-radius: var(--_sortable-ghost-radius, 0px);
|
|
26250
|
+
border-start-end-radius: var(--_sortable-ghost-radius, 0px);
|
|
26251
|
+
border-end-start-radius: var(--_sortable-ghost-radius, 0px);
|
|
26252
|
+
border-end-end-radius: var(--_sortable-ghost-radius, 0px);
|
|
26253
|
+
box-shadow: var(--_sortable-ghost-shadow, none);
|
|
26254
|
+
opacity: var(--_sortable-ghost-opacity, 1);
|
|
26255
|
+
}
|
|
26256
|
+
|
|
24658
26257
|
.mx-spinner[data-contained] .mx-spinner__box {
|
|
24659
26258
|
padding-block-start: var(--_spinner-box-contained-padding, 0px);
|
|
24660
26259
|
padding-inline-end: var(--_spinner-box-contained-padding, 0px);
|
|
@@ -24698,6 +26297,168 @@
|
|
|
24698
26297
|
scale: var(--_spinner-shape-contained-scale, none);
|
|
24699
26298
|
}
|
|
24700
26299
|
|
|
26300
|
+
.mx-stepper__step {
|
|
26301
|
+
padding-block-start: var(--_padding);
|
|
26302
|
+
padding-inline-end: var(--_padding);
|
|
26303
|
+
padding-block-end: var(--_padding);
|
|
26304
|
+
padding-inline-start: var(--_padding);
|
|
26305
|
+
gap: var(--_stepper-gap);
|
|
26306
|
+
border-start-start-radius: var(--_stepper-step-radius, 0px);
|
|
26307
|
+
border-start-end-radius: var(--_stepper-step-radius, 0px);
|
|
26308
|
+
border-end-start-radius: var(--_stepper-step-radius, 0px);
|
|
26309
|
+
border-end-end-radius: var(--_stepper-step-radius, 0px);
|
|
26310
|
+
color: var(--_stepper-step-color, inherit);
|
|
26311
|
+
font-size: var(--_font-size);
|
|
26312
|
+
outline-style: solid;
|
|
26313
|
+
outline-width: 0px;
|
|
26314
|
+
cursor: default;
|
|
26315
|
+
}
|
|
26316
|
+
|
|
26317
|
+
button.mx-stepper__step:not([aria-disabled='true']):hover {
|
|
26318
|
+
background-color: var(--_stepper-step-hover-bg, transparent);
|
|
26319
|
+
cursor: var(--_stepper-step-hover-cursor, default);
|
|
26320
|
+
}
|
|
26321
|
+
|
|
26322
|
+
button.mx-stepper__step:not([aria-disabled='true']):active {
|
|
26323
|
+
background-color: var(--_stepper-step-pressed-bg, var(--_stepper-step-hover-bg, transparent));
|
|
26324
|
+
}
|
|
26325
|
+
|
|
26326
|
+
.mx-stepper__step:focus-visible {
|
|
26327
|
+
box-shadow: var(--_stepper-step-focus-glow, 0 0 #0000), 0 0 #0000;
|
|
26328
|
+
outline-width: var(--_stepper-step-focus-outline-width, 0px);
|
|
26329
|
+
outline-color: var(--_stepper-step-focus-outline-color, currentcolor);
|
|
26330
|
+
outline-offset: var(--_stepper-step-focus-outline-offset, 0px);
|
|
26331
|
+
}
|
|
26332
|
+
|
|
26333
|
+
.mx-stepper__step[aria-disabled='true'] {
|
|
26334
|
+
color: var(--_stepper-step-disabled-color, var(--_stepper-step-color, inherit));
|
|
26335
|
+
}
|
|
26336
|
+
|
|
26337
|
+
.mx-stepper__step[aria-current] {
|
|
26338
|
+
color: var(--_stepper-step-current-color, var(--_stepper-step-color, inherit));
|
|
26339
|
+
}
|
|
26340
|
+
|
|
26341
|
+
.mx-stepper__step[data-status='done'] {
|
|
26342
|
+
color: var(--_stepper-step-done-color, var(--_stepper-step-color, inherit));
|
|
26343
|
+
}
|
|
26344
|
+
|
|
26345
|
+
.mx-stepper__indicator {
|
|
26346
|
+
inline-size: var(--_size);
|
|
26347
|
+
block-size: var(--_size);
|
|
26348
|
+
background-color: var(--_stepper-indicator-bg, transparent);
|
|
26349
|
+
border-style: solid;
|
|
26350
|
+
border-block-start-width: var(--_stepper-indicator-border-width, 0px);
|
|
26351
|
+
border-inline-end-width: var(--_stepper-indicator-border-width, 0px);
|
|
26352
|
+
border-block-end-width: var(--_stepper-indicator-border-width, 0px);
|
|
26353
|
+
border-inline-start-width: var(--_stepper-indicator-border-width, 0px);
|
|
26354
|
+
border-block-start-color: var(--_stepper-indicator-border-color, currentcolor);
|
|
26355
|
+
border-inline-end-color: var(--_stepper-indicator-border-color, currentcolor);
|
|
26356
|
+
border-block-end-color: var(--_stepper-indicator-border-color, currentcolor);
|
|
26357
|
+
border-inline-start-color: var(--_stepper-indicator-border-color, currentcolor);
|
|
26358
|
+
border-start-start-radius: var(--_stepper-indicator-radius, 0px);
|
|
26359
|
+
border-start-end-radius: var(--_stepper-indicator-radius, 0px);
|
|
26360
|
+
border-end-start-radius: var(--_stepper-indicator-radius, 0px);
|
|
26361
|
+
border-end-end-radius: var(--_stepper-indicator-radius, 0px);
|
|
26362
|
+
color: var(--_stepper-indicator-color, inherit);
|
|
26363
|
+
font-size: var(--_stepper-indicator-font-size, inherit);
|
|
26364
|
+
font-weight: var(--_stepper-indicator-font-weight, inherit);
|
|
26365
|
+
}
|
|
26366
|
+
|
|
26367
|
+
.mx-stepper__indicator[data-status='current'] {
|
|
26368
|
+
background-color: var(--_stepper-indicator-current-bg, var(--_stepper-indicator-bg, transparent));
|
|
26369
|
+
border-block-start-color: var(--_stepper-indicator-current-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26370
|
+
border-inline-end-color: var(--_stepper-indicator-current-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26371
|
+
border-block-end-color: var(--_stepper-indicator-current-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26372
|
+
border-inline-start-color: var(--_stepper-indicator-current-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26373
|
+
color: var(--_stepper-indicator-current-color, var(--_stepper-indicator-color, inherit));
|
|
26374
|
+
}
|
|
26375
|
+
|
|
26376
|
+
.mx-stepper__indicator[data-status='done'] {
|
|
26377
|
+
background-color: var(--_stepper-indicator-done-bg, var(--_stepper-indicator-bg, transparent));
|
|
26378
|
+
border-block-start-color: var(--_stepper-indicator-done-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26379
|
+
border-inline-end-color: var(--_stepper-indicator-done-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26380
|
+
border-block-end-color: var(--_stepper-indicator-done-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26381
|
+
border-inline-start-color: var(--_stepper-indicator-done-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26382
|
+
color: var(--_stepper-indicator-done-color, var(--_stepper-indicator-color, inherit));
|
|
26383
|
+
}
|
|
26384
|
+
|
|
26385
|
+
.mx-stepper__indicator[data-status='error'] {
|
|
26386
|
+
background-color: var(--_stepper-indicator-error-bg, var(--_stepper-indicator-bg, transparent));
|
|
26387
|
+
border-block-start-color: var(--_stepper-indicator-error-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26388
|
+
border-inline-end-color: var(--_stepper-indicator-error-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26389
|
+
border-block-end-color: var(--_stepper-indicator-error-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26390
|
+
border-inline-start-color: var(--_stepper-indicator-error-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26391
|
+
color: var(--_stepper-indicator-error-color, var(--_stepper-indicator-color, inherit));
|
|
26392
|
+
}
|
|
26393
|
+
|
|
26394
|
+
.mx-stepper__step[aria-disabled='true'] .mx-stepper__indicator {
|
|
26395
|
+
background-color: var(--_stepper-indicator-disabled-bg, var(--_stepper-indicator-bg, transparent));
|
|
26396
|
+
border-block-start-color: var(--_stepper-indicator-disabled-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26397
|
+
border-inline-end-color: var(--_stepper-indicator-disabled-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26398
|
+
border-block-end-color: var(--_stepper-indicator-disabled-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26399
|
+
border-inline-start-color: var(--_stepper-indicator-disabled-border-color, var(--_stepper-indicator-border-color, currentcolor));
|
|
26400
|
+
color: var(--_stepper-indicator-disabled-color, var(--_stepper-indicator-color, inherit));
|
|
26401
|
+
}
|
|
26402
|
+
|
|
26403
|
+
.mx-stepper__mark {
|
|
26404
|
+
inline-size: calc(var(--_size) * 0.6);
|
|
26405
|
+
block-size: calc(var(--_size) * 0.6);
|
|
26406
|
+
}
|
|
26407
|
+
|
|
26408
|
+
.mx-stepper__mark[data-status='done'] {
|
|
26409
|
+
background-color: var(--_stepper-mark-done-bg, transparent);
|
|
26410
|
+
--_icon: var(--_stepper-mark-done-icon, none);
|
|
26411
|
+
}
|
|
26412
|
+
|
|
26413
|
+
.mx-stepper__mark[data-status='error'] {
|
|
26414
|
+
background-color: var(--_stepper-mark-error-bg, transparent);
|
|
26415
|
+
--_icon: var(--_stepper-mark-error-icon, none);
|
|
26416
|
+
}
|
|
26417
|
+
|
|
26418
|
+
.mx-stepper__step[aria-current] .mx-stepper__label {
|
|
26419
|
+
font-weight: var(--_stepper-label-current-font-weight, inherit);
|
|
26420
|
+
}
|
|
26421
|
+
|
|
26422
|
+
.mx-stepper__step[data-status='error'] .mx-stepper__label {
|
|
26423
|
+
color: var(--_stepper-label-error-color, inherit);
|
|
26424
|
+
}
|
|
26425
|
+
|
|
26426
|
+
.mx-stepper__description {
|
|
26427
|
+
color: var(--_stepper-description-color, inherit);
|
|
26428
|
+
font-size: var(--_stepper-description-font-size);
|
|
26429
|
+
}
|
|
26430
|
+
|
|
26431
|
+
.mx-stepper__step[aria-disabled='true'] .mx-stepper__description {
|
|
26432
|
+
color: var(--_stepper-description-disabled-color, var(--_stepper-description-color, inherit));
|
|
26433
|
+
}
|
|
26434
|
+
|
|
26435
|
+
.mx-stepper__note {
|
|
26436
|
+
color: var(--_stepper-note-color, inherit);
|
|
26437
|
+
font-size: var(--_stepper-description-font-size);
|
|
26438
|
+
}
|
|
26439
|
+
|
|
26440
|
+
.mx-stepper__line {
|
|
26441
|
+
block-size: var(--_stepper-line-height, auto);
|
|
26442
|
+
background-color: var(--_stepper-line-bg, transparent);
|
|
26443
|
+
border-start-start-radius: var(--_stepper-line-radius, 0px);
|
|
26444
|
+
border-start-end-radius: var(--_stepper-line-radius, 0px);
|
|
26445
|
+
border-end-start-radius: var(--_stepper-line-radius, 0px);
|
|
26446
|
+
border-end-end-radius: var(--_stepper-line-radius, 0px);
|
|
26447
|
+
}
|
|
26448
|
+
|
|
26449
|
+
.mx-stepper__line:where(.mx-stepper[data-orientation='vertical'] *) {
|
|
26450
|
+
block-size: auto;
|
|
26451
|
+
inline-size: var(--_stepper-line-height, auto);
|
|
26452
|
+
border-start-start-radius: var(--_stepper-line-radius, 0px);
|
|
26453
|
+
border-end-start-radius: var(--_stepper-line-radius, 0px);
|
|
26454
|
+
border-start-end-radius: var(--_stepper-line-radius, 0px);
|
|
26455
|
+
border-end-end-radius: var(--_stepper-line-radius, 0px);
|
|
26456
|
+
}
|
|
26457
|
+
|
|
26458
|
+
.mx-stepper__line[data-status='done'] {
|
|
26459
|
+
background-color: var(--_stepper-line-done-bg, var(--_stepper-line-bg, transparent));
|
|
26460
|
+
}
|
|
26461
|
+
|
|
24701
26462
|
.mx-switch__input {
|
|
24702
26463
|
block-size: var(--_track-height);
|
|
24703
26464
|
min-inline-size: var(--_track-width);
|
|
@@ -26608,6 +28369,16 @@
|
|
|
26608
28369
|
.mx-message-box[data-tone='danger'] > .mx-message-box__icon > * {
|
|
26609
28370
|
color: var(--_window-message-icon-danger-color, var(--_window-message-icon-color, inherit));
|
|
26610
28371
|
}
|
|
28372
|
+
|
|
28373
|
+
.mx-wizard__bar {
|
|
28374
|
+
padding-block-start: var(--_wizard-bar-padding-top, 0px);
|
|
28375
|
+
border-style: solid;
|
|
28376
|
+
border-block-start-width: var(--_wizard-bar-border-top-width, 0px);
|
|
28377
|
+
border-inline-end-width: 0px;
|
|
28378
|
+
border-block-end-width: 0px;
|
|
28379
|
+
border-inline-start-width: 0px;
|
|
28380
|
+
border-block-start-color: var(--_wizard-bar-border-top-color, currentcolor);
|
|
28381
|
+
}
|
|
26611
28382
|
}
|
|
26612
28383
|
|
|
26613
28384
|
/* Generated by scripts/build-tokens.mjs from tokens/schema and tokens/languages. Do not edit; edit the source and run `npm run tokens`. */
|
|
@@ -26858,6 +28629,16 @@
|
|
|
26858
28629
|
--_calendar-container-padding: var(--mx-date-box-calendar-container-padding);
|
|
26859
28630
|
}
|
|
26860
28631
|
|
|
28632
|
+
/* date-range-box: field — The field under a range box: two dates wide. */
|
|
28633
|
+
.mx-date-range-box {
|
|
28634
|
+
--_field-width: var(--mx-date-range-box-field-width);
|
|
28635
|
+
}
|
|
28636
|
+
|
|
28637
|
+
/* date-range-box: calendar — A calendar on the popup. */
|
|
28638
|
+
.mx-date-range-box__popup > .mx-calendar {
|
|
28639
|
+
--_calendar-container-padding: var(--mx-date-range-box-calendar-container-padding);
|
|
28640
|
+
}
|
|
28641
|
+
|
|
26861
28642
|
/* drawer: close-button — The close button in the header. */
|
|
26862
28643
|
.mx-drawer__tools > .mx-drawer__close {
|
|
26863
28644
|
--_button-variant: var(--mx-drawer-close-button-variant);
|
|
@@ -26910,6 +28691,24 @@
|
|
|
26910
28691
|
--_field-size: var(--mx-drop-down-search-size);
|
|
26911
28692
|
}
|
|
26912
28693
|
|
|
28694
|
+
/* file-uploader: field — The field under an uploader: the box is the drop zone (a dashed frame where the language draws one). */
|
|
28695
|
+
.mx-file-uploader {
|
|
28696
|
+
--_field-width: var(--mx-file-uploader-field-width);
|
|
28697
|
+
--_field-box-border-style: var(--mx-file-uploader-field-box-border-style);
|
|
28698
|
+
--_field-border-width: var(--mx-file-uploader-field-border-width);
|
|
28699
|
+
--_field-box-border-color: var(--mx-file-uploader-field-box-border-color);
|
|
28700
|
+
--_field-box-hover-bg: var(--mx-file-uploader-field-box-hover-bg);
|
|
28701
|
+
--_field-box-radius: var(--mx-file-uploader-field-box-radius);
|
|
28702
|
+
--_field-padding-sm: var(--mx-file-uploader-field-padding-sm);
|
|
28703
|
+
--_field-padding-md: var(--mx-file-uploader-field-padding-md);
|
|
28704
|
+
--_field-padding-lg: var(--mx-file-uploader-field-padding-lg);
|
|
28705
|
+
}
|
|
28706
|
+
|
|
28707
|
+
/* file-uploader: action — A row's buttons: cancel, retry, remove. */
|
|
28708
|
+
.mx-file-uploader__action {
|
|
28709
|
+
--_button-variant: var(--mx-file-uploader-action-variant);
|
|
28710
|
+
}
|
|
28711
|
+
|
|
26913
28712
|
/* filterbuilder: field-button — The button that chooses a condition's field. */
|
|
26914
28713
|
.mx-filter-builder__cell > .mx-filter-builder__field {
|
|
26915
28714
|
--_button-variant: var(--mx-filterbuilder-field-button-variant);
|
|
@@ -26998,6 +28797,16 @@
|
|
|
26998
28797
|
--_list-item-radius: var(--mx-listbox-list-item-radius);
|
|
26999
28798
|
}
|
|
27000
28799
|
|
|
28800
|
+
/* load-panel: cancel — The Cancel button in the pane. */
|
|
28801
|
+
.mx-load-panel__cancel {
|
|
28802
|
+
--_button-variant: var(--mx-load-panel-cancel-variant);
|
|
28803
|
+
}
|
|
28804
|
+
|
|
28805
|
+
/* popover: close — The close button in the header. */
|
|
28806
|
+
.mx-popover__close {
|
|
28807
|
+
--_button-variant: var(--mx-popover-close-variant);
|
|
28808
|
+
}
|
|
28809
|
+
|
|
27001
28810
|
/* popup: list-box — A list box inside a popup: the surface is its frame, so by default the list draws none of its own (no frame, fill or shadow). */
|
|
27002
28811
|
.mx-popup .mx-list-box {
|
|
27003
28812
|
--_field-frame-display: var(--mx-popup-list-box-frame-display);
|
|
@@ -27454,4 +29263,15 @@
|
|
|
27454
29263
|
--_button-variant: var(--mx-window-footer-main-button-variant);
|
|
27455
29264
|
--_button-size: var(--mx-window-footer-main-button-size);
|
|
27456
29265
|
}
|
|
29266
|
+
|
|
29267
|
+
/* wizard: previous — The Back button. */
|
|
29268
|
+
.mx-wizard__previous {
|
|
29269
|
+
--_button-variant: var(--mx-wizard-previous-variant);
|
|
29270
|
+
}
|
|
29271
|
+
|
|
29272
|
+
/* wizard: next — The Next button, Finish on the last step. */
|
|
29273
|
+
.mx-wizard__next {
|
|
29274
|
+
--_button-variant: var(--mx-wizard-next-variant);
|
|
29275
|
+
--_button-tone: var(--mx-wizard-next-tone);
|
|
29276
|
+
}
|
|
27457
29277
|
}
|