x-next 1.3.1 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AI_USAGE.md +2 -2
- package/CHANGELOG.md +71 -0
- package/dist/_utils/constant.d.ts +1 -1
- package/dist/_utils/palette.d.ts +6 -14
- package/dist/components/alert/Alert.vue.d.ts +9 -9
- package/dist/components/alert/index.d.ts +6 -6
- package/dist/components/button/ButtonGroup.vue.d.ts +22 -18
- package/dist/components/date-picker/DatePanel.vue.d.ts +342 -1
- package/dist/components/date-picker/DatePicker.vue.d.ts +343 -2
- package/dist/components/date-picker/index.d.ts +1765 -1083
- package/dist/components/dropdown/DropdownButton.vue.d.ts +2 -1
- package/dist/components/dropdown/index.d.ts +3 -0
- package/dist/components/form-input-tag/index.d.ts +26 -25
- package/dist/components/form-input-tag/interface.d.ts +8 -0
- package/dist/components/link/Link.vue.d.ts +4 -4
- package/dist/components/link/index.d.ts +6 -6
- package/dist/components/message/index.d.ts +3 -3
- package/dist/components/message/message.vue.d.ts +1 -1
- package/dist/components/notification/Notification.d.ts +1 -1
- package/dist/components/notification/index.d.ts +3 -3
- package/dist/components/popconfirm/src/types.d.ts +1 -1
- package/dist/components/progress/Progress.vue.d.ts +3 -3
- package/dist/components/progress/index.d.ts +3 -3
- package/dist/components/steps/context.d.ts +9 -0
- package/dist/components/tabs/TabPane.vue.d.ts +2 -0
- package/dist/components/tabs/index.d.ts +6 -0
- package/dist/components/tabs/interface.d.ts +4 -0
- package/dist/components/tag/Tag.vue.d.ts +14 -0
- package/dist/components/tag/index.d.ts +9 -0
- package/dist/components/tag/interface.d.ts +5 -0
- package/dist/components/trend-chart/components/TrendChart.d.ts +127 -17
- package/dist/components/trend-chart/components/trend-chart-curve.d.ts +27 -7
- package/dist/components/trend-chart/components/trend-chart-labels.d.ts +4 -0
- package/dist/components/trend-chart/helpers/getPadding.d.ts +3 -2
- package/dist/components/trend-chart/index.d.ts +223 -28
- package/dist/components/trend-chart/props.d.ts +63 -5
- package/dist/es/_styles/palette-aliases.js +182 -127
- package/dist/es/_utils/palette.js +49 -43
- package/dist/es/components/_components/picker/input-range.vue2.js +10 -10
- package/dist/es/components/_components/picker/input.vue2.js +20 -20
- package/dist/es/components/_components/select-view/select-view.js +2 -2
- package/dist/es/components/alert/Alert.vue.js +2 -2
- package/dist/es/components/alert/Alert.vue2.js +21 -20
- package/dist/es/components/button/Button.js +17 -17
- package/dist/es/components/button/ButtonGroup.vue2.js +11 -9
- package/dist/es/components/date-picker/DatePanel.vue.js +71 -62
- package/dist/es/components/date-picker/DatePanel.vue2.js +50 -40
- package/dist/es/components/date-picker/DatePicker.vue2.js +1 -1
- package/dist/es/components/dropdown/Dropdown.vue2.js +11 -4
- package/dist/es/components/dropdown/DropdownButton.vue.js +8 -7
- package/dist/es/components/dropdown/DropdownButton.vue2.js +19 -17
- package/dist/es/components/dropdown/DropdownSubmenu.vue.js +18 -17
- package/dist/es/components/form/form-item-label.vue.js +25 -22
- package/dist/es/components/form/form-item-label.vue2.js +1 -1
- package/dist/es/components/form-checkbox/icon-check.js +12 -43
- package/dist/es/components/form-input/InputPassword.vue2.js +2 -2
- package/dist/es/components/form-input/InputSearch.js +1 -1
- package/dist/es/components/form-input-number/InputNumber.js +4 -4
- package/dist/es/components/form-input-tag/InputTag.js +168 -147
- package/dist/es/components/form-input-tag/utils.js +21 -19
- package/dist/es/components/form-textarea/Textarea.vue2.js +1 -1
- package/dist/es/components/link/Link.vue2.js +1 -1
- package/dist/es/components/menu/MenuSubMenu.js +50 -36
- package/dist/es/components/menu/sub-menu-pop.vue2.js +30 -30
- package/dist/es/components/pagination/Pagination.js +73 -70
- package/dist/es/components/popconfirm/src/popup.vue.js +1 -1
- package/dist/es/components/progress/Progress.vue2.js +1 -1
- package/dist/es/components/steps/Step.vue2.js +51 -47
- package/dist/es/components/steps/Steps.vue2.js +22 -19
- package/dist/es/components/table/Table.js +1 -1
- package/dist/es/components/table/table-th.js +2 -2
- package/dist/es/components/tabs/TabPane.vue.js +11 -9
- package/dist/es/components/tabs/TabPane.vue2.js +28 -24
- package/dist/es/components/tabs/tabs-button.js +2 -2
- package/dist/es/components/tabs/tabs-nav.js +21 -19
- package/dist/es/components/tabs/tabs-tab.vue.js +10 -8
- package/dist/es/components/tag/Tag.vue.js +20 -20
- package/dist/es/components/tag/Tag.vue2.js +35 -28
- package/dist/es/components/time-picker/TimePanel.vue.js +30 -29
- package/dist/es/components/time-picker/TimePicker.vue2.js +1 -1
- package/dist/es/components/time-picker/TimeRangePanel.js +26 -23
- package/dist/es/components/trend-chart/components/TrendChart.js +208 -142
- package/dist/es/components/trend-chart/components/trend-chart-curve.js +124 -59
- package/dist/es/components/trend-chart/components/trend-chart-labels.js +43 -41
- package/dist/es/components/trend-chart/helpers/getPadding.js +3 -3
- package/dist/es/components/trend-chart/props.js +101 -33
- package/dist/es/components/trend-chart/themes.js +15 -15
- package/dist/es/components/watermark/controller.js +40 -40
- package/dist/es/icons/default/calendar.js +15 -0
- package/dist/es/icons/default/clock-circle.js +15 -0
- package/dist/es/icons/default/double-left.js +15 -0
- package/dist/es/icons/default/double-right.js +15 -0
- package/dist/es/icons/default/down.js +16 -0
- package/dist/es/icons/default/eye-invisible.js +20 -0
- package/dist/es/icons/default/eye.js +18 -0
- package/dist/es/icons/default/left.js +15 -0
- package/dist/es/icons/default/minus.js +16 -0
- package/dist/es/icons/default/plus.js +16 -0
- package/dist/es/icons/default/question-circle.js +18 -0
- package/dist/es/icons/default/right.js +15 -0
- package/dist/es/icons/default/search.js +16 -0
- package/dist/es/icons/default/up.js +16 -0
- package/dist/es/icons/icon.js +26 -25
- package/dist/es/icons/public/boxicons/basic.js +1893 -0
- package/dist/es/icons/public/boxicons/brands.js +304 -0
- package/dist/es/icons/public/boxicons/filled.js +1893 -0
- package/dist/es/icons/public/boxicons/index.js +24 -0
- package/dist/es/icons/public/boxicons/names.js +4082 -0
- package/dist/es/icons/registry.js +15 -15
- package/dist/es/locale/en-US.js +2 -1
- package/dist/es/locale/zh-CN.js +2 -1
- package/dist/es/style.css +1 -1
- package/dist/icons/default/calendar.d.ts +93 -0
- package/dist/icons/default/clock-circle.d.ts +93 -0
- package/dist/icons/{_self/down.d.ts → default/double-left.d.ts} +6 -0
- package/dist/icons/{_self/eye-invisible.d.ts → default/double-right.d.ts} +6 -0
- package/dist/icons/default/down.d.ts +93 -0
- package/dist/icons/default/eye-invisible.d.ts +93 -0
- package/dist/icons/default/eye.d.ts +93 -0
- package/dist/icons/{_self/eye.d.ts → default/left.d.ts} +7 -0
- package/dist/icons/default/minus.d.ts +93 -0
- package/dist/icons/{_self → default}/plus.d.ts +7 -0
- package/dist/icons/default/question-circle.d.ts +93 -0
- package/dist/icons/{_self/minus.d.ts → default/right.d.ts} +7 -0
- package/dist/icons/{_self → default}/search.d.ts +7 -0
- package/dist/icons/{_self → default}/up.d.ts +7 -0
- package/dist/icons/public/boxicons/basic.cjs +1 -0
- package/dist/icons/public/boxicons/basic.d.ts +2 -0
- package/dist/icons/public/boxicons/brands.cjs +1 -0
- package/dist/icons/public/boxicons/brands.d.ts +2 -0
- package/dist/icons/public/boxicons/filled.cjs +1 -0
- package/dist/icons/public/boxicons/filled.d.ts +2 -0
- package/dist/icons/public/boxicons/index.cjs +1 -0
- package/dist/icons/public/boxicons/index.d.ts +10 -0
- package/dist/icons/public/boxicons/names.d.ts +10 -0
- package/dist/icons/registry.d.ts +5 -0
- package/dist/index.cjs +4 -4
- package/dist/index.umd.js +4 -4
- package/dist/locale/interface.d.ts +2 -0
- package/dist/style/alert.css +1 -1
- package/dist/style/base.css +1 -1
- package/dist/style/button.css +1 -1
- package/dist/style/date-picker.css +1 -1
- package/dist/style/dialog.css +1 -1
- package/dist/style/drawer.css +1 -1
- package/dist/style/dropdown.css +1 -1
- package/dist/style/form-input-number.css +1 -1
- package/dist/style/form-input-tag.css +1 -1
- package/dist/style/form-input.css +1 -1
- package/dist/style/form-radio.css +1 -1
- package/dist/style/form-select.css +1 -1
- package/dist/style/form-textarea.css +1 -1
- package/dist/style/form.css +1 -1
- package/dist/style/link.css +1 -1
- package/dist/style/menu.css +1 -1
- package/dist/style/message-box.css +1 -1
- package/dist/style/network.css +1 -1
- package/dist/style/pagination.css +1 -1
- package/dist/style/popconfirm.css +1 -1
- package/dist/style/popover.css +1 -1
- package/dist/style/popup.css +1 -1
- package/dist/style/progress.css +1 -1
- package/dist/style/rate.css +1 -1
- package/dist/style/spin.css +1 -1
- package/dist/style/steps.css +1 -1
- package/dist/style/table.css +1 -1
- package/dist/style/tabs.css +1 -1
- package/dist/style/tag.css +1 -1
- package/dist/style/time-picker.css +1 -1
- package/dist/style/time-range-selector.css +1 -1
- package/dist/style.css +1 -1
- package/package.json +31 -4
- package/dist/es/icons/_self/down.js +0 -16
- package/dist/es/icons/_self/eye-invisible.js +0 -13
- package/dist/es/icons/_self/eye.js +0 -13
- package/dist/es/icons/_self/minus.js +0 -13
- package/dist/es/icons/_self/plus.js +0 -12
- package/dist/es/icons/_self/question-message.js +0 -12
- package/dist/es/icons/_self/search.js +0 -13
- package/dist/es/icons/_self/up.js +0 -16
- package/dist/es/icons/_ui/calendar.js +0 -13
- package/dist/es/icons/_ui/time.js +0 -12
package/dist/style/popover.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-popover{--x-popover-color-bg: var(--x-color-bg-elevated);--x-popover-color-text: var(--x-color-text-elevated-title);--x-popover-color-text-secondary: var(--x-color-text-elevated-body);--x-popover-color-border: var(--x-color-
|
|
1
|
+
.x-popover{--x-popover-color-bg: var(--x-color-bg-elevated);--x-popover-color-text: var(--x-color-text-elevated-title);--x-popover-color-text-secondary: var(--x-color-text-elevated-body);--x-popover-color-border: var(--x-color-transparent);--x-popover-radius: var(--x-border-radius-medium);--x-popover-shadow: var(--x-shadow-popover);--x-popover-padding-y: 10px;--x-popover-padding-x: 12px;--x-popover-title-margin-bottom: 6px;--x-popover-max-width: 320px}.x-popover--content{box-sizing:border-box;max-width:var(--x-popover-max-width);padding:var(--x-popover-padding-y) var(--x-popover-padding-x);color:var(--x-popover-color-text-secondary);font-size:var(--x-font-size-body-3);line-height:1.5715;text-align:left;overflow-wrap:break-word;background:var(--x-popover-color-bg);border:1px solid var(--x-popover-color-border);border-radius:var(--x-popover-radius);box-shadow:var(--x-popover-shadow)}.x-popover--title{margin-bottom:var(--x-popover-title-margin-bottom);color:var(--x-popover-color-text);font-weight:600;line-height:1.5}.x-popover--body{min-width:0}.x-popover--arrow{background:var(--x-popover-color-bg);border-color:var(--x-popover-color-border)}
|
package/dist/style/popup.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-popup{--x-popup-color-bg: var(--x-color-bg-elevated);--x-popup-color-text: var(--x-color-text-elevated-body);--x-popup-color-border: var(--x-color-
|
|
1
|
+
.x-popup{--x-popup-color-bg: var(--x-color-bg-elevated);--x-popup-color-text: var(--x-color-text-elevated-body);--x-popup-color-border: var(--x-color-transparent);--x-popup-radius: var(--x-border-radius-medium);--x-popup-shadow: var(--x-shadow-popover);--x-popup-padding: 12px;--x-popup-max-width: 320px}.x-popup--content{box-sizing:border-box;max-width:var(--x-popup-max-width);padding:var(--x-popup-padding);color:var(--x-popup-color-text);font-size:var(--x-font-size-body-3);line-height:1.5715;text-align:left;overflow-wrap:break-word;background:var(--x-popup-color-bg);border:1px solid var(--x-popup-color-border);border-radius:var(--x-popup-radius);box-shadow:var(--x-popup-shadow)}.x-popup--arrow{background:var(--x-popup-color-bg);border-color:var(--x-popup-color-border)}
|
package/dist/style/progress.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-progress{position:relative;line-height:1;font-size:var(--x-font-size-body-1)}.x-progress-type-line,.x-progress-type-steps{display:inline-block;max-width:100%;width:100%}.x-progress--line--wrapper{display:flex;align-items:center;width:100%;max-width:100%;height:100%}.x-progress--line--text{display:inline-flex;align-items:center;font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7);color:var(--x-color-text-2);white-space:nowrap;text-align:right;flex-grow:1;flex-shrink:0;min-width:var(--x-size-8)}.x-progress--line--text .x-icon{font-size:12px;margin-left:var(--x-spacing-2)}.x-progress--steps--wrapper{display:flex;align-items:center;width:100%;max-width:100%;height:100%}.x-progress--steps--text{font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7);color:var(--x-color-text-2);white-space:nowrap;text-align:right;flex-grow:1;flex-shrink:0;min-width:var(--x-size-8)}.x-progress--steps--text .x-icon{font-size:12px;margin-left:var(--x-spacing-2)}.x-progress--line{background-color:var(--x-color-fill-3);border-radius:100px;width:100%;position:relative;display:inline-block;overflow:hidden}.x-progress--line--bar{height:100%;border-radius:100px;background-color:var(--x-color-primary-6);position:relative;transition:width .6s var(--x-transition-timing-function-standard),background .3s var(--x-transition-timing-function-standard);max-width:100%}.x-progress--line--bar-buffer{position:absolute;background-color:var(--x-color-primary-1);height:100%;top:0;left:0;border-radius:0 100px 100px 0;max-width:100%;transition:all .6s var(--x-transition-timing-function-standard)}.x-progress--line--bar-animate::after{content:"";display:block;position:absolute;top:0;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg, var(--x-progress-line-color-loading-shimmer-start) 25%, var(--x-progress-line-color-loading-shimmer-active) 50%, var(--x-progress-line-color-loading-shimmer-end) 75%);background-size:400% 100%;animation:x-progress-loading-animation 1.5s var(--x-transition-timing-function-standard) infinite}.x-progress--line--text .x-icon{color:var(--x-color-text-2)}.x-progress-type-steps.x-progress-size-small{width:auto}.x-progress-type-steps.x-progress-size-small .x-progress--steps--item{width:3px;flex:unset;border-radius:3px}.x-progress-type-steps.x-progress-size-small .x-progress--steps--item:not(:last-of-type){margin-right:3px}.x-progress--steps{display:flex;width:100%}.x-progress--steps--text{margin-left:var(--x-spacing-4);min-width:unset}.x-progress--steps--text .x-icon{color:var(--x-color-text-2)}.x-progress--steps--item{height:100%;flex:1;background-color:var(--x-color-fill-3);position:relative;display:inline-block}.x-progress--steps--item:not(:last-of-type){margin-right:3px}.x-progress--steps--item:last-of-type{border-top-right-radius:100px;border-bottom-right-radius:100px}.x-progress--steps--item:first-of-type{border-top-left-radius:100px;border-bottom-left-radius:100px}.x-progress--steps--item-active{background-color:var(--x-color-primary-6)}.x-progress-status-warning .x-progress--line--bar{background-color:var(--x-color-warning-6)}.x-progress-status-warning .x-progress--steps--item-active{background-color:var(--x-color-warning-6)}.x-progress-status-warning .x-progress--line--text .x-icon,.x-progress-status-warning .x-progress--steps--text .x-icon{color:var(--x-color-warning-6)}.x-progress-status-success .x-progress--line--bar{background-color:var(--x-color-success-6)}.x-progress-status-success .x-progress--steps--item-active{background-color:var(--x-color-success-6)}.x-progress-status-success .x-progress--line--text .x-icon,.x-progress-status-success .x-progress--steps--text .x-icon{color:var(--x-color-success-6)}.x-progress-status-danger .x-progress--line--bar{background-color:var(--x-color-danger-6)}.x-progress-status-danger .x-progress--steps--item-active{background-color:var(--x-color-danger-6)}.x-progress-status-danger .x-progress--line--text .x-icon,.x-progress-status-danger .x-progress--steps--text .x-icon{color:var(--x-color-danger-6)}.x-progress-size-mini .x-progress--line--text{font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7)}.x-progress-size-mini .x-progress--line--text .x-icon{font-size:12px}.x-progress-size-small .x-progress--line--text{font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7)}.x-progress-size-small .x-progress--line--text .x-icon{font-size:12px}.x-progress-size-large .x-progress--line--text{font-size:16px;margin-left:var(--x-spacing-7)}.x-progress-size-large .x-progress--line--text .x-icon{font-size:14px}.x-progress-type-circle{display:inline-block}.x-progress--circle--wrapper{position:relative;text-align:center;line-height:1;display:inline-block;vertical-align:text-bottom}.x-progress--circle--svg{transform:rotate(-90deg)}.x-progress--circle--text{position:absolute;top:50%;left:50%;color:var(--x-color-text-3);transform:translate(-50%, -50%);font-size:var(--x-font-size-body-3)}.x-progress--circle--text .x-icon{font-size:var(--x-size-4);color:var(--x-color-text-2)}.x-progress--circle--bg{stroke:var(--x-color-fill-3)}.x-progress--circle--bar{stroke:var(--x-color-primary-6);transition:stroke-dashoffset .6s var(--x-transition-timing-function-linear) 0s,stroke .6s var(--x-transition-timing-function-linear)}.x-progress-size-mini .x-progress--circle--bg{stroke:var(--x-color-primary-1)}.x-progress-size-mini .x-progress--circle--bar{stroke:var(--x-color-primary-6)}.x-progress-size-mini.x-progress-status-warning .x-progress--circle--bg{stroke:var(--x-color-warning-2)}.x-progress-size-mini.x-progress-status-danger .x-progress--circle--bg{stroke:var(--x-color-danger-1)}.x-progress-size-mini.x-progress-status-success .x-progress--circle--bg{stroke:var(--x-color-success-2)}.x-progress-size-mini .x-progress--circle--wrapper .x-icon-check{position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.x-progress-size-mini .x-progress--circle--text{position:static;top:unset;left:unset;transform:unset}.x-progress-size-small .x-progress--circle--text{font-size:var(--x-font-size-body-2)}.x-progress-size-small .x-progress--circle--text .x-icon{font-size:14px}.x-progress-size-large .x-progress--circle--text{font-size:16px}.x-progress-size-large .x-progress--circle--text .x-icon{font-size:var(--x-size-4)}.x-progress-status-warning .x-progress--circle--bar{stroke:var(--x-color-warning-6)}.x-progress-status-warning .x-icon{color:var(--x-color-warning-6)}.x-progress-status-success .x-progress--circle--bar{stroke:var(--x-color-success-6)}.x-progress-status-success .x-icon{color:var(--x-color-success-6)}.x-progress-status-danger .x-progress--circle--bar{stroke:var(--x-color-danger-6)}.x-progress-status-danger .x-icon{color:var(--x-color-danger-6)}@keyframes x-progress-loading-animation{0%{background-position:100% 50%}100%{background-position:0 50%}}
|
|
1
|
+
.x-progress{position:relative;line-height:1;font-size:var(--x-font-size-body-1)}.x-progress-type-line,.x-progress-type-steps{display:inline-block;max-width:100%;width:100%}.x-progress--line--wrapper{display:flex;align-items:center;width:100%;max-width:100%;height:100%}.x-progress--line--text{display:inline-flex;align-items:center;font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7);color:var(--x-color-text-2);white-space:nowrap;text-align:right;flex-grow:1;flex-shrink:0;min-width:var(--x-size-8)}.x-progress--line--text .x-icon{font-size:12px;margin-left:var(--x-spacing-2)}.x-progress--steps--wrapper{display:flex;align-items:center;width:100%;max-width:100%;height:100%}.x-progress--steps--text{font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7);color:var(--x-color-text-2);white-space:nowrap;text-align:right;flex-grow:1;flex-shrink:0;min-width:var(--x-size-8)}.x-progress--steps--text .x-icon{font-size:12px;margin-left:var(--x-spacing-2)}.x-progress--line{background-color:var(--x-color-fill-3);border-radius:100px;width:100%;position:relative;display:inline-block;overflow:hidden}.x-progress--line--bar{height:100%;border-radius:100px;background-color:var(--x-color-primary-6);position:relative;transition:width .6s var(--x-transition-timing-function-standard),background .3s var(--x-transition-timing-function-standard);max-width:100%}.x-progress--line--bar-buffer{position:absolute;background-color:var(--x-color-primary-1);height:100%;top:0;left:0;border-radius:0 100px 100px 0;max-width:100%;transition:all .6s var(--x-transition-timing-function-standard)}.x-progress--line--bar-animate::after{content:"";display:block;position:absolute;top:0;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg, var(--x-progress-line-color-loading-shimmer-start) 25%, var(--x-progress-line-color-loading-shimmer-active) 50%, var(--x-progress-line-color-loading-shimmer-end) 75%);background-size:400% 100%;animation:x-progress-loading-animation 1.5s var(--x-transition-timing-function-standard) infinite}.x-progress--line--text .x-icon{color:var(--x-color-text-2)}.x-progress-type-steps.x-progress-size-small{width:auto}.x-progress-type-steps.x-progress-size-small .x-progress--steps--item{width:3px;flex:unset;border-radius:3px}.x-progress-type-steps.x-progress-size-small .x-progress--steps--item:not(:last-of-type){margin-right:3px}.x-progress--steps{display:flex;width:100%}.x-progress--steps--text{margin-left:var(--x-spacing-4);min-width:unset}.x-progress--steps--text .x-icon{color:var(--x-color-text-2)}.x-progress--steps--item{height:100%;flex:1;background-color:var(--x-color-fill-3);position:relative;display:inline-block}.x-progress--steps--item:not(:last-of-type){margin-right:3px}.x-progress--steps--item:last-of-type{border-top-right-radius:100px;border-bottom-right-radius:100px}.x-progress--steps--item:first-of-type{border-top-left-radius:100px;border-bottom-left-radius:100px}.x-progress--steps--item-active{background-color:var(--x-color-primary-6)}.x-progress-status-warning .x-progress--line--bar{background-color:var(--x-color-warning-6)}.x-progress-status-warning .x-progress--steps--item-active{background-color:var(--x-color-warning-6)}.x-progress-status-warning .x-progress--line--text .x-icon,.x-progress-status-warning .x-progress--steps--text .x-icon{color:var(--x-color-warning-6)}.x-progress-status-success .x-progress--line--bar{background-color:var(--x-color-success-6)}.x-progress-status-success .x-progress--steps--item-active{background-color:var(--x-color-success-6)}.x-progress-status-success .x-progress--line--text .x-icon,.x-progress-status-success .x-progress--steps--text .x-icon{color:var(--x-color-success-6)}.x-progress-status-danger .x-progress--line--bar{background-color:var(--x-color-danger-6)}.x-progress-status-danger .x-progress--steps--item-active{background-color:var(--x-color-danger-6)}.x-progress-status-danger .x-progress--line--text .x-icon,.x-progress-status-danger .x-progress--steps--text .x-icon{color:var(--x-color-danger-6)}.x-progress-status-strong .x-progress--line--bar{background-color:var(--x-color-strong-6)}.x-progress-status-strong .x-progress--steps--item-active{background-color:var(--x-color-strong-6)}.x-progress-status-strong .x-progress--line--text .x-icon,.x-progress-status-strong .x-progress--steps--text .x-icon{color:var(--x-color-strong-6)}.x-progress-size-mini .x-progress--line--text{font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7)}.x-progress-size-mini .x-progress--line--text .x-icon{font-size:12px}.x-progress-size-small .x-progress--line--text{font-size:var(--x-font-size-body-1);margin-left:var(--x-spacing-7)}.x-progress-size-small .x-progress--line--text .x-icon{font-size:12px}.x-progress-size-large .x-progress--line--text{font-size:16px;margin-left:var(--x-spacing-7)}.x-progress-size-large .x-progress--line--text .x-icon{font-size:14px}.x-progress-type-circle{display:inline-block}.x-progress--circle--wrapper{position:relative;text-align:center;line-height:1;display:inline-block;vertical-align:text-bottom}.x-progress--circle--svg{transform:rotate(-90deg)}.x-progress--circle--text{position:absolute;top:50%;left:50%;color:var(--x-color-text-3);transform:translate(-50%, -50%);font-size:var(--x-font-size-body-3)}.x-progress--circle--text .x-icon{font-size:var(--x-size-4);color:var(--x-color-text-2)}.x-progress--circle--bg{stroke:var(--x-color-fill-3)}.x-progress--circle--bar{stroke:var(--x-color-primary-6);transition:stroke-dashoffset .6s var(--x-transition-timing-function-linear) 0s,stroke .6s var(--x-transition-timing-function-linear)}.x-progress-size-mini .x-progress--circle--bg{stroke:var(--x-color-primary-1)}.x-progress-size-mini .x-progress--circle--bar{stroke:var(--x-color-primary-6)}.x-progress-size-mini.x-progress-status-warning .x-progress--circle--bg{stroke:var(--x-color-warning-2)}.x-progress-size-mini.x-progress-status-danger .x-progress--circle--bg{stroke:var(--x-color-danger-1)}.x-progress-size-mini.x-progress-status-success .x-progress--circle--bg{stroke:var(--x-color-success-2)}.x-progress-size-mini .x-progress--circle--wrapper .x-icon-check{position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.x-progress-size-mini .x-progress--circle--text{position:static;top:unset;left:unset;transform:unset}.x-progress-size-small .x-progress--circle--text{font-size:var(--x-font-size-body-2)}.x-progress-size-small .x-progress--circle--text .x-icon{font-size:14px}.x-progress-size-large .x-progress--circle--text{font-size:16px}.x-progress-size-large .x-progress--circle--text .x-icon{font-size:var(--x-size-4)}.x-progress-status-warning .x-progress--circle--bar{stroke:var(--x-color-warning-6)}.x-progress-status-warning .x-icon{color:var(--x-color-warning-6)}.x-progress-status-success .x-progress--circle--bar{stroke:var(--x-color-success-6)}.x-progress-status-success .x-icon{color:var(--x-color-success-6)}.x-progress-status-danger .x-progress--circle--bar{stroke:var(--x-color-danger-6)}.x-progress-status-danger .x-icon{color:var(--x-color-danger-6)}.x-progress-status-strong .x-progress--circle--bar{stroke:var(--x-color-strong-6)}.x-progress-status-strong .x-icon{color:var(--x-color-strong-6)}@keyframes x-progress-loading-animation{0%{background-position:100% 50%}100%{background-position:0 50%}}
|
package/dist/style/rate.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@keyframes x-rate-scale{0%{transform:scale(1)}50%{transform:scale(1.16)}100%{transform:scale(1)}}.x-rate{--x-rate-face-detail-color: var(--x-color-white);display:inline-flex;align-items:center;min-height:24px;color:var(--x-color-fill-4);font-size:24px;line-height:1;outline:none;user-select:none}.x-rate--character{position:relative;display:inline-flex;flex:0 0 auto;width:1em;height:1em;color:var(--x-color-fill-4);transition:color var(--x-transition-duration-2) var(--x-transition-timing-function-standard),transform var(--x-transition-duration-2) var(--x-transition-timing-function-standard)}.x-rate--character:not(:last-child){margin-right:var(--x-spacing-2)}.x-rate--character svg{display:block;width:1em;height:1em}.x-rate--character-left,.x-rate--character-right{display:inline-flex;align-items:center;width:1em;height:1em}.x-rate--character-left>*,.x-rate--character-right>*{flex:0 0 1em;width:1em}.x-rate--character-left{position:absolute;top:0;left:0;justify-content:flex-start;width:50%;overflow:hidden;opacity:0;pointer-events:none}.x-rate--character-right{justify-content:center;color:inherit}.x-rate--character-full .x-rate--character-right,.x-rate--character-half .x-rate--character-left{color:var(--x-color-warning-6)}.x-rate--character-half .x-rate--character-left{opacity:1}.x-rate--character-scale{animation:x-rate-scale var(--x-transition-duration-4) var(--x-transition-timing-function-standard)}.x-rate:not(.x-rate-disabled):not(.x-rate-readonly) .x-rate--character{cursor:pointer}.x-rate:not(.x-rate-disabled):not(.x-rate-readonly) .x-rate--character:hover{transform:scale(1.16)}.x-rate:focus-visible .x-rate--character-focused{outline:2px solid var(--x-color-primary-
|
|
1
|
+
@keyframes x-rate-scale{0%{transform:scale(1)}50%{transform:scale(1.16)}100%{transform:scale(1)}}.x-rate{--x-rate-face-detail-color: var(--x-color-white);display:inline-flex;align-items:center;min-height:24px;color:var(--x-color-fill-4);font-size:24px;line-height:1;outline:none;user-select:none}.x-rate--character{position:relative;display:inline-flex;flex:0 0 auto;width:1em;height:1em;color:var(--x-color-fill-4);transition:color var(--x-transition-duration-2) var(--x-transition-timing-function-standard),transform var(--x-transition-duration-2) var(--x-transition-timing-function-standard)}.x-rate--character:not(:last-child){margin-right:var(--x-spacing-2)}.x-rate--character svg{display:block;width:1em;height:1em}.x-rate--character-left,.x-rate--character-right{display:inline-flex;align-items:center;width:1em;height:1em}.x-rate--character-left>*,.x-rate--character-right>*{flex:0 0 1em;width:1em}.x-rate--character-left{position:absolute;top:0;left:0;justify-content:flex-start;width:50%;overflow:hidden;opacity:0;pointer-events:none}.x-rate--character-right{justify-content:center;color:inherit}.x-rate--character-full .x-rate--character-right,.x-rate--character-half .x-rate--character-left{color:var(--x-color-warning-6)}.x-rate--character-half .x-rate--character-left{opacity:1}.x-rate--character-scale{animation:x-rate-scale var(--x-transition-duration-4) var(--x-transition-timing-function-standard)}.x-rate:not(.x-rate-disabled):not(.x-rate-readonly) .x-rate--character{cursor:pointer}.x-rate:not(.x-rate-disabled):not(.x-rate-readonly) .x-rate--character:hover{transform:scale(1.16)}.x-rate:focus-visible .x-rate--character-focused{outline:2px solid var(--x-color-primary-text);outline-offset:2px;border-radius:var(--x-border-radius-small)}.x-rate-disabled{cursor:not-allowed}.x-rate-disabled .x-rate--character{color:var(--x-color-fill-5);cursor:not-allowed}.x-rate-disabled .x-rate--character-full .x-rate--character-right,.x-rate-disabled .x-rate--character-half .x-rate--character-left{color:var(--x-color-fill-6)}.x-rate-readonly .x-rate--character{cursor:default}.x-rate-grading{color:var(--x-color-fill-4)}
|
package/dist/style/spin.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-dot-loading{position:relative;display:inline-block;width:calc(var(--x-size-3)*3);height:calc(var(--x-size-3)*3);transform-style:preserve-3d;perspective:200px;animation:x-spin-rotate-dots 1.5s linear infinite}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(1){background-color:var(--x-color-primary)}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(2){background-color:var(--x-color-success)}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(3){background-color:var(--x-color-strong)}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(4){background-color:var(--x-color-warning)}.x-dot-loading--item{position:absolute;width:var(--x-size-3);height:var(--x-size-3);background-color:var(--x-color-primary);border-radius:var(--x-border-radius-circle);animation:x-spin-fade-dots 1.5s var(--x-transition-timing-function-linear) infinite forwards}.x-dot-loading--item:nth-child(1){top:0;left:50%;transform:translateX(-50%);animation-delay:0s}.x-dot-loading--item:nth-child(2){top:50%;right:0;transform:translateY(-50%);animation-delay:.25s}.x-dot-loading--item:nth-child(3){bottom:0;left:50%;transform:translateX(-50%);animation-delay:.5s}.x-dot-loading--item:nth-child(4){top:50%;left:0;transform:translateY(-50%);animation-delay:.75s}@keyframes x-spin-rotate-dots{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes x-spin-fade-dots{0%,100%{opacity:1}50%{opacity:.1}}.x-spin{display:inline-block}.x-spin.x-spin-block{display:block}.x-spin-with-tip{text-align:center}.x-spin--icon{display:inline-flex;color:var(--x-color-primary);font-size:24px}.x-spin--tip{margin-top:var(--x-spacing-3);color:var(--x-color-primary);font-weight:var(--x-font-weight-500);font-size:14px}.x-spin--mask{position:absolute;top:0;right:0;bottom:0;left:0;z-index:11;text-align:center;background-color:var(--x-color-spin-layer-bg);transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear);user-select:none}.x-spin--children{position:relative}.x-spin-loading{position:relative;user-select:none}.x-spin-loading .x-spin--mask--icon{position:absolute;top:50%;left:50%;z-index:12;transform:translate(-50%, -50%);display:flex;flex-direction:column;justify-content:center;align-items:center}.x-spin-loading .x-spin--children{pointer-events:none}.x-spin-loading .x-spin--children::after{opacity:1;pointer-events:auto}
|
|
1
|
+
.x-dot-loading{position:relative;display:inline-block;width:calc(var(--x-size-3)*3);height:calc(var(--x-size-3)*3);transform-style:preserve-3d;perspective:200px;animation:x-spin-rotate-dots 1.5s linear infinite}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(1){background-color:var(--x-color-primary-text)}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(2){background-color:var(--x-color-success-text)}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(3){background-color:var(--x-color-strong-text)}.x-dot-loading.x-dot-loading-color .x-dot-loading--item:nth-child(4){background-color:var(--x-color-warning-text)}.x-dot-loading--item{position:absolute;width:var(--x-size-3);height:var(--x-size-3);background-color:var(--x-color-primary-text);border-radius:var(--x-border-radius-circle);animation:x-spin-fade-dots 1.5s var(--x-transition-timing-function-linear) infinite forwards}.x-dot-loading--item:nth-child(1){top:0;left:50%;transform:translateX(-50%);animation-delay:0s}.x-dot-loading--item:nth-child(2){top:50%;right:0;transform:translateY(-50%);animation-delay:.25s}.x-dot-loading--item:nth-child(3){bottom:0;left:50%;transform:translateX(-50%);animation-delay:.5s}.x-dot-loading--item:nth-child(4){top:50%;left:0;transform:translateY(-50%);animation-delay:.75s}@keyframes x-spin-rotate-dots{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes x-spin-fade-dots{0%,100%{opacity:1}50%{opacity:.1}}.x-spin{display:inline-block}.x-spin.x-spin-block{display:block}.x-spin-with-tip{text-align:center}.x-spin--icon{display:inline-flex;color:var(--x-color-primary-text);font-size:24px}.x-spin--tip{margin-top:var(--x-spacing-3);color:var(--x-color-primary-text);font-weight:var(--x-font-weight-500);font-size:14px}.x-spin--mask{position:absolute;top:0;right:0;bottom:0;left:0;z-index:11;text-align:center;background-color:var(--x-color-spin-layer-bg);transition:opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear);user-select:none}.x-spin--children{position:relative}.x-spin-loading{position:relative;user-select:none}.x-spin-loading .x-spin--mask--icon{position:absolute;top:50%;left:50%;z-index:12;transform:translate(-50%, -50%);display:flex;flex-direction:column;justify-content:center;align-items:center}.x-spin-loading .x-spin--children{pointer-events:none}.x-spin-loading .x-spin--children::after{opacity:1;pointer-events:auto}
|
package/dist/style/steps.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-steps--item{position:relative;flex:1;margin-right:12px;overflow:hidden;white-space:nowrap;text-align:left}.x-steps--item:last-child{flex:none;margin-right:0}.x-steps--item-active .x-steps--item--title{font-weight:var(--x-font-weight-500)}.x-steps--item-disabled{cursor:not-allowed}.x-steps--item-disabled .x-steps--item--title,.x-steps--item-disabled .x-steps--item--description{color:var(--x-color-text-4)}.x-steps--item--node{display:inline-block;margin-right:12px;min-width:var(--x-size-7);min-height:var(--x-size-7);font-weight:var(--x-font-weight-500);font-size:var(--x-font-size-title-1);vertical-align:top}.x-steps--icon{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--x-size-7);height:var(--x-size-7);color:var(--x-color-text-2);font-size:var(--x-size-4);text-align:center;background-color:var(--x-color-fill-2);border:1px solid var(--x-color-transparent);border-radius:var(--x-border-radius-circle)}.x-steps--item-process .x-steps--icon{color:var(--x-color-white);background-color:var(--x-color-primary-6);border-color:var(--x-color-transparent)}.x-steps--item-finish .x-steps--icon{color:var(--x-color-primary-6);background-color:var(--x-color-primary-light-1);border-color:var(--x-color-transparent)}.x-steps--item-error .x-steps--icon{color:var(--x-color-white);background-color:var(--x-color-danger-6);border-color:var(--x-color-transparent)}.x-steps--item-disabled .x-steps--icon{color:var(--x-color-text-4);background-color:var(--x-color-fill-2)}.x-steps--item--title{position:relative;display:inline-block;padding-right:12px;color:var(--x-color-text-2);font-size:var(--x-font-size-title-1);line-height:var(--x-size-7);white-space:nowrap}.x-steps--item-process .x-steps--item--title{color:var(--x-color-text-1)}.x-steps--item-finish .x-steps--item--title{color:var(--x-color-text-1)}.x-steps--item-error .x-steps--item--title{color:var(--x-color-text-1)}.x-steps--item--content{display:inline-block}.x-steps--item--description{max-width:140px;margin-top:var(--x-spacing-1);color:var(--x-color-text-3);font-size:var(--x-font-size-body-1);white-space:normal}.x-steps--item-process .x-steps--item--description{color:var(--x-color-text-3)}.x-steps--item-finish .x-steps--item--description{color:var(--x-color-text-3)}.x-steps--item-error .x-steps--item--description{color:var(--x-color-text-3)}.x-steps--label-horizontal .x-steps--item:not(:last-child) .x-steps--item--title::after{position:absolute;top:calc((var(--x-size-7) - var(--x-border-1))/2);left:100%;display:block;box-sizing:border-box;width:5000px;height:var(--x-border-1);background-color:var(--x-color-neutral-3);content:""}.x-steps--label-horizontal .x-steps--item-finish:not(:last-child) .x-steps--item--title::after{background-color:var(--x-color-primary-6)}.x-steps--label-horizontal .x-steps--item-next-error:not(:last-child) .x-steps--item--title::after{background-color:var(--x-color-danger-6)}.x-steps--item:not(:last-child) .x-steps--item--tail{position:absolute;top:calc((var(--x-size-7) - var(--x-border-1))/2);box-sizing:border-box;width:100%;height:var(--x-border-1)}.x-steps--item:not(:last-child) .x-steps--item--tail::after{display:block;width:100%;height:100%;background-color:var(--x-color-neutral-3);content:""}.x-steps--item-finish:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-primary-6)}.x-steps--item-next-error:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-danger-6)}.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail{top:0;left:calc((var(--x-size-7) - var(--x-border-1))/2);width:var(--x-border-1);height:auto;padding:0;bottom:0}.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail::after{position:absolute;top:calc(var(--x-size-7) + 6px);bottom:6px;left:0;width:var(--x-border-1);height:auto}.x-steps-vertical .x-steps--item--node{margin-right:12px}.x-steps-vertical .x-steps--item--content{display:inline-block}.x-steps-size-small:not(.x-steps-vertical) .x-steps--item:not(:last-child) .x-steps--item--tail{top:calc((var(--x-size-6) - var(--x-border-1))/2)}.x-steps-size-small.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail{left:calc((var(--x-size-6) - var(--x-border-1))/2)}.x-steps-size-small.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail::after{top:calc(var(--x-size-6) + 6px)}.x-steps-size-small .x-steps--item--node{font-size:var(--x-font-size-body-3)}.x-steps-size-small .x-steps--item--title{font-size:var(--x-font-size-body-3);line-height:var(--x-size-6)}.x-steps-size-small .x-steps--item--description{font-size:var(--x-font-size-body-1)}.x-steps-size-small .x-steps--icon{width:var(--x-size-6);height:var(--x-size-6);font-size:14px;line-height:var(--x-size-6)}.x-steps-size-small.x-steps--label-horizontal .x-steps--item:not(:last-child) .x-steps--item--title::after{top:calc((var(--x-size-6) - var(--x-border-1))/2)}.x-steps--label-vertical .x-steps--item{overflow:visible;text-align:center}.x-steps--label-vertical .x-steps--item--title{margin-top:var(--x-spacing-1);padding-right:0}.x-steps--label-vertical .x-steps--item--node{display:block;margin-left:calc((140px - var(--x-size-7))/2);text-align:left}.x-steps--label-vertical .x-steps--item--tail{left:calc(calc((140px - var(--x-size-7)) / 2) + var(--x-size-7) + 12px);padding-right:calc(var(--x-size-7) + 12px)}.x-steps--label-vertical.x-steps-size-small .x-steps--item--node{margin-left:calc((140px - var(--x-size-6))/2)}.x-steps--label-vertical.x-steps-size-small .x-steps--item--tail{left:calc(calc((140px - var(--x-size-6)) / 2) + var(--x-size-6) + 12px);padding-right:calc(var(--x-size-6) + 12px)}.x-steps-mode-dot .x-steps--item{position:relative;flex:1;margin-right:calc(var(--x-size-2) + var(--x-spacing-2)*2);overflow:visible;white-space:nowrap;text-align:left}.x-steps-mode-dot .x-steps--item:last-child{flex:none;margin-right:0}.x-steps-mode-dot .x-steps--item-active .x-steps--item--title{font-weight:var(--x-font-weight-500)}.x-steps-mode-dot .x-steps--item--node{display:inline-block;box-sizing:border-box;min-width:0;min-height:0;width:var(--x-size-2);height:var(--x-size-2);background-color:var(--x-color-fill-4);border:1px solid var(--x-color-fill-4);border-radius:var(--x-border-radius-circle);vertical-align:top}.x-steps-mode-dot .x-steps--item-active .x-steps--item--node{width:10px;height:10px}.x-steps-mode-dot .x-steps--item-process .x-steps--item--node{background-color:var(--x-color-primary-6);border-color:var(--x-color-primary-6)}.x-steps-mode-dot .x-steps--item-finish .x-steps--item--node{background-color:var(--x-color-primary-6);border-color:var(--x-color-primary-6)}.x-steps-mode-dot .x-steps--item-error .x-steps--item--node{background-color:var(--x-color-danger-6);border-color:var(--x-color-danger-6)}.x-steps-mode-dot .x-steps--item-disabled .x-steps--item--node{background-color:var(--x-color-fill-2);border-color:var(--x-color-fill-3)}.x-steps-mode-dot.x-steps-horizontal .x-steps--item--node{margin-left:calc((140px - var(--x-size-2))/2)}.x-steps-mode-dot.x-steps-horizontal .x-steps--item-active .x-steps--item--node{margin-top:calc((var(--x-size-2) - 10px)/2);margin-left:calc(calc((140px - var(--x-size-2)) / 2) - (10px - var(--x-size-2))/2)}.x-steps-mode-dot.x-steps-horizontal .x-steps--item--title::after{display:none}.x-steps-mode-dot .x-steps--item--content{display:inline-block}.x-steps-mode-dot .x-steps--item--title{position:relative;display:inline-block;margin-top:var(--x-spacing-2);color:var(--x-color-text-2);font-size:var(--x-font-size-title-1)}.x-steps-mode-dot .x-steps--item-process .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-dot .x-steps--item-finish .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-dot .x-steps--item-error .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-dot .x-steps--item--description{margin-top:var(--x-spacing-2);color:var(--x-color-text-3);font-size:var(--x-font-size-body-1);white-space:normal}.x-steps-mode-dot .x-steps--item-process .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-dot .x-steps--item-finish .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-dot .x-steps--item-error .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-dot .x-steps--item:not(:last-child) .x-steps--item--tail{position:absolute;top:calc((var(--x-size-2) - var(--x-border-1))/2);left:calc(calc((140px - var(--x-size-2)) / 2) + var(--x-size-2) + var(--x-spacing-2));box-sizing:border-box;width:100%;height:var(--x-border-1);background-color:var(--x-color-neutral-3)}.x-steps-mode-dot .x-steps--item-finish:not(:last-child) .x-steps--item--tail{background-color:var(--x-color-primary-6)}.x-steps-mode-dot .x-steps--item-next-error:not(:last-child) .x-steps--item--tail{background-color:var(--x-color-danger-6)}.x-steps-mode-dot.x-steps-vertical .x-steps--item--node{margin-top:var(--x-spacing-4);margin-right:var(--x-spacing-7)}.x-steps-mode-dot.x-steps-vertical .x-steps--item-active .x-steps--item--node{margin-top:calc(var(--x-spacing-4) - (10px - var(--x-size-2))/2);margin-left:calc((var(--x-size-2) - 10px)/2)}.x-steps-mode-dot.x-steps-vertical .x-steps--item--content{overflow:hidden}.x-steps-mode-dot.x-steps-vertical .x-steps--item--title{margin-top:calc(var(--x-spacing-4) + var(--x-size-2)/2 - var(--x-size-7)/2)}.x-steps-mode-dot.x-steps-vertical .x-steps--item--description{margin-top:var(--x-spacing-2)}.x-steps-mode-dot.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail{position:absolute;bottom:0;left:calc(var(--x-size-2)/2);box-sizing:border-box;width:1px;height:100%;padding-top:calc(var(--x-size-2) + 4px + var(--x-spacing-2));padding-bottom:2px;background-color:var(--x-color-transparent);transform:translateX(-50%)}.x-steps-mode-dot.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail::after{display:block;width:100%;height:100%;background-color:var(--x-color-neutral-3);content:""}.x-steps-mode-dot.x-steps-vertical .x-steps--item-finish:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-primary-6)}.x-steps-mode-dot.x-steps-vertical .x-steps--item-next-error:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-danger-6)}.x-steps{--x-steps-arrow-height: 72px;--x-steps-size-arrow: 36px}.x-steps-mode-arrow .x-steps--item{position:relative;display:flex;flex:1;align-items:center;height:var(--x-steps-arrow-height);overflow:visible;white-space:nowrap;background-color:var(--x-color-fill-1)}.x-steps-mode-arrow .x-steps--item:not(:last-child){margin-right:var(--x-spacing-2)}.x-steps-mode-arrow .x-steps--item:not(:first-child)::before{position:absolute;top:0;left:0;z-index:1;display:block;width:0;height:0;border-top:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-bottom:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-left:var(--x-steps-size-arrow) solid var(--x-color-bg-2);content:""}.x-steps-mode-arrow .x-steps--item:not(:last-child)::after{position:absolute;top:0;right:calc(var(--x-steps-size-arrow)*-1);z-index:2;display:block;width:0;height:0;border-top:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-bottom:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-left:var(--x-steps-size-arrow) solid var(--x-color-fill-1);content:""}.x-steps-mode-arrow .x-steps--item-process{background-color:var(--x-color-primary-6)}.x-steps-mode-arrow .x-steps--item-process:not(:last-child)::after{border-left-color:var(--x-color-primary-6)}.x-steps-mode-arrow .x-steps--item-finish{background-color:var(--x-color-primary-light-1)}.x-steps-mode-arrow .x-steps--item-finish:not(:last-child)::after{border-left-color:var(--x-color-primary-light-1)}.x-steps-mode-arrow .x-steps--item-error{background-color:var(--x-color-danger-6)}.x-steps-mode-arrow .x-steps--item-error:not(:last-child)::after{border-left-color:var(--x-color-danger-6)}.x-steps-mode-arrow .x-steps--item-disabled{background-color:var(--x-color-fill-2)}.x-steps-mode-arrow .x-steps--item-disabled:not(:last-child)::after{border-left-color:var(--x-color-fill-2)}.x-steps-mode-arrow .x-steps--item--content{display:inline-block;box-sizing:border-box}.x-steps-mode-arrow .x-steps--item:first-child .x-steps--item--content{padding-left:var(--x-spacing-7)}.x-steps-mode-arrow .x-steps--item:not(:first-child) .x-steps--item--content{padding-left:calc(var(--x-spacing-7) + var(--x-steps-size-arrow))}.x-steps-mode-arrow .x-steps--item--title{position:relative;display:inline-block;color:var(--x-color-text-2);font-size:var(--x-font-size-title-1);white-space:nowrap}.x-steps-mode-arrow .x-steps--item--title::after{display:none}.x-steps-mode-arrow .x-steps--item-process .x-steps--item--title{color:var(--x-color-white)}.x-steps-mode-arrow .x-steps--item-finish .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-arrow .x-steps--item-error .x-steps--item--title{color:var(--x-color-white)}.x-steps-mode-arrow .x-steps--item-active .x-steps--item--title{font-weight:var(--x-font-weight-500)}.x-steps-mode-arrow .x-steps--item--description{max-width:none;margin-top:0;color:var(--x-color-text-3);font-size:var(--x-font-size-body-1);white-space:nowrap}.x-steps-mode-arrow .x-steps--item-process .x-steps--item--description{color:var(--x-color-white)}.x-steps-mode-arrow .x-steps--item-finish .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-arrow .x-steps--item-error .x-steps--item--description{color:var(--x-color-white)}.x-steps-mode-arrow.x-steps-size-small{--x-steps-arrow-height: var(--x-size-10);--x-steps-size-arrow: calc(var(--x-size-10) / 2)}.x-steps-mode-arrow.x-steps-size-small .x-steps--item--title{font-size:var(--x-font-size-body-3)}.x-steps-mode-arrow.x-steps-size-small .x-steps--item--description{display:none}.x-steps-mode-arrow.x-steps-size-small .x-steps--item:first-child .x-steps--item--content{padding-left:var(--x-spacing-8)}.x-steps-mode-arrow.x-steps-size-small .x-steps--item:not(:first-child) .x-steps--item--content{padding-left:calc(var(--x-spacing-8) + var(--x-size-10)/2)}.x-steps-mode-navigation .x-steps--item--title::after{display:none}.x-steps-mode-navigation .x-steps--item{position:relative;padding-right:var(--x-spacing-5);padding-left:var(--x-spacing-8);margin-right:var(--x-spacing-10)}.x-steps-mode-navigation .x-steps--item:last-child{flex:1}.x-steps-mode-navigation .x-steps--item--content{margin-bottom:20px}.x-steps-mode-navigation .x-steps--item--description{padding-right:20px}.x-steps-mode-navigation .x-steps--item-active .x-steps--item--title{color:var(--x-color-primary-6);font-weight:var(--x-font-weight-500)}.x-steps-mode-navigation .x-steps--item:not(:last-child) .x-steps--item--content::after{position:absolute;top:var(--x-spacing-5);right:30px;display:inline-block;width:6px;height:6px;background-color:var(--x-color-bg-2);border:2px solid var(--x-color-text-4);border-bottom:none;border-left:none;transform:rotate(45deg);content:""}.x-steps{display:flex}.x-steps-vertical{flex-direction:column}.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled){cursor:pointer}.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled):hover .x-steps--item--title,.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled):hover .x-steps--item--description{color:var(--x-color-primary-6)}.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled):focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:4px}.x-steps-changeable .x-steps--item--title,.x-steps-changeable .x-steps--item--description{transition:color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-steps-line-less .x-steps--item--tail,.x-steps-line-less .x-steps--item--title::after{display:none}.x-steps-vertical .x-steps--item:not(:last-child){min-height:90px}.x-steps-vertical .x-steps--item--content{vertical-align:top}.x-steps-vertical .x-steps--item--title::after{display:none}.x-steps-vertical .x-steps--item--description{max-width:none}.x-steps--label-vertical .x-steps--item--content{display:block;width:140px;text-align:center}.x-steps--label-vertical .x-steps--item--description{max-width:none}
|
|
1
|
+
.x-steps--item{position:relative;flex:1;margin-right:12px;overflow:hidden;white-space:nowrap;text-align:left}.x-steps--item:last-child{flex:none;margin-right:0}.x-steps--item-active .x-steps--item--title{font-weight:var(--x-font-weight-500)}.x-steps--item-disabled{cursor:not-allowed}.x-steps--item-disabled .x-steps--item--title,.x-steps--item-disabled .x-steps--item--description{color:var(--x-color-text-4)}.x-steps--item--node{display:inline-block;margin-right:12px;min-width:var(--x-size-7);min-height:var(--x-size-7);font-weight:var(--x-font-weight-500);font-size:var(--x-font-size-title-1);vertical-align:top}.x-steps--icon{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--x-size-7);height:var(--x-size-7);color:var(--x-color-text-2);font-size:var(--x-size-4);text-align:center;background-color:var(--x-color-fill-2);border:1px solid var(--x-color-transparent);border-radius:var(--x-border-radius-circle)}.x-steps--item-process .x-steps--icon{color:var(--x-color-white);background-color:var(--x-color-primary-6);border-color:var(--x-color-transparent)}.x-steps--item-finish .x-steps--icon{color:var(--x-color-primary-text);background-color:var(--x-color-primary-light-1);border-color:var(--x-color-transparent)}.x-steps--item-error .x-steps--icon{color:var(--x-color-white);background-color:var(--x-color-danger-6);border-color:var(--x-color-transparent)}.x-steps--item-disabled .x-steps--icon{color:var(--x-color-text-4);background-color:var(--x-color-fill-2)}.x-steps--item--title{position:relative;display:inline-block;padding-right:12px;color:var(--x-color-text-2);font-size:var(--x-font-size-title-1);line-height:var(--x-size-7);white-space:nowrap}.x-steps--item-process .x-steps--item--title{color:var(--x-color-text-1)}.x-steps--item-finish .x-steps--item--title{color:var(--x-color-text-1)}.x-steps--item-error .x-steps--item--title{color:var(--x-color-text-1)}.x-steps--item--content{display:inline-block}.x-steps--item--description{max-width:140px;margin-top:var(--x-spacing-1);color:var(--x-color-text-3);font-size:var(--x-font-size-body-1);white-space:normal}.x-steps--item-process .x-steps--item--description{color:var(--x-color-text-3)}.x-steps--item-finish .x-steps--item--description{color:var(--x-color-text-3)}.x-steps--item-error .x-steps--item--description{color:var(--x-color-text-3)}.x-steps--label-horizontal:not(.x-steps-mode-arrow):not(.x-steps-mode-navigation):not(.x-steps-mode-dot):not(.x-steps-vertical):not(.x-steps-line-less) .x-steps--item:not(:last-child) .x-steps--item--title::after{position:absolute;top:calc((var(--x-size-7) - var(--x-border-1))/2);left:100%;display:block;box-sizing:border-box;width:5000px;height:var(--x-border-1);background-color:var(--x-color-neutral-3);content:""}.x-steps--label-horizontal:not(.x-steps-mode-arrow):not(.x-steps-mode-navigation):not(.x-steps-mode-dot):not(.x-steps-vertical):not(.x-steps-line-less) .x-steps--item-finish:not(:last-child) .x-steps--item--title::after{background-color:var(--x-color-primary-6)}.x-steps--label-horizontal:not(.x-steps-mode-arrow):not(.x-steps-mode-navigation):not(.x-steps-mode-dot):not(.x-steps-vertical):not(.x-steps-line-less) .x-steps--item-next-error:not(:last-child) .x-steps--item--title::after{background-color:var(--x-color-danger-6)}.x-steps--item:not(:last-child) .x-steps--item--tail{position:absolute;top:calc((var(--x-size-7) - var(--x-border-1))/2);box-sizing:border-box;width:100%;height:var(--x-border-1)}.x-steps--item:not(:last-child) .x-steps--item--tail::after{display:block;width:100%;height:100%;background-color:var(--x-color-neutral-3);content:""}.x-steps--item-finish:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-primary-6)}.x-steps--item-next-error:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-danger-6)}.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail{top:0;left:calc((var(--x-size-7) - var(--x-border-1))/2);width:var(--x-border-1);height:auto;padding:0;bottom:0}.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail::after{position:absolute;top:calc(var(--x-size-7) + 6px);bottom:6px;left:0;width:var(--x-border-1);height:auto}.x-steps-vertical .x-steps--item--node{margin-right:12px}.x-steps-vertical .x-steps--item--content{display:inline-block}.x-steps-size-small:not(.x-steps-vertical) .x-steps--item:not(:last-child) .x-steps--item--tail{top:calc((var(--x-size-6) - var(--x-border-1))/2)}.x-steps-size-small.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail{left:calc((var(--x-size-6) - var(--x-border-1))/2)}.x-steps-size-small.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail::after{top:calc(var(--x-size-6) + 6px)}.x-steps-size-small .x-steps--item--node{font-size:var(--x-font-size-body-3)}.x-steps-size-small .x-steps--item--title{font-size:var(--x-font-size-body-3);line-height:var(--x-size-6)}.x-steps-size-small .x-steps--item--description{font-size:var(--x-font-size-body-1)}.x-steps-size-small .x-steps--icon{width:var(--x-size-6);height:var(--x-size-6);font-size:14px;line-height:var(--x-size-6)}.x-steps-size-small.x-steps--label-horizontal .x-steps--item:not(:last-child) .x-steps--item--title::after{top:calc((var(--x-size-6) - var(--x-border-1))/2)}.x-steps--label-vertical .x-steps--item{overflow:visible;text-align:center}.x-steps--label-vertical .x-steps--item--title{margin-top:var(--x-spacing-1);padding-right:0}.x-steps--label-vertical .x-steps--item--node{display:block;margin-left:calc((140px - var(--x-size-7))/2);text-align:left}.x-steps--label-vertical .x-steps--item--tail{left:calc(calc((140px - var(--x-size-7)) / 2) + var(--x-size-7) + 12px);padding-right:calc(var(--x-size-7) + 12px)}.x-steps--label-vertical.x-steps-size-small .x-steps--item--node{margin-left:calc((140px - var(--x-size-6))/2)}.x-steps--label-vertical.x-steps-size-small .x-steps--item--tail{left:calc(calc((140px - var(--x-size-6)) / 2) + var(--x-size-6) + 12px);padding-right:calc(var(--x-size-6) + 12px)}.x-steps-mode-dot .x-steps--item{position:relative;flex:1;margin-right:calc(var(--x-size-2) + var(--x-spacing-2)*2);overflow:visible;white-space:nowrap;text-align:left}.x-steps-mode-dot .x-steps--item:last-child{flex:none;margin-right:0}.x-steps-mode-dot .x-steps--item-active .x-steps--item--title{font-weight:var(--x-font-weight-500)}.x-steps-mode-dot .x-steps--item--node{display:inline-block;box-sizing:border-box;min-width:0;min-height:0;width:var(--x-size-2);height:var(--x-size-2);background-color:var(--x-color-fill-4);border:1px solid var(--x-color-fill-4);border-radius:var(--x-border-radius-circle);vertical-align:top}.x-steps-mode-dot .x-steps--item-active .x-steps--item--node{width:10px;height:10px}.x-steps-mode-dot .x-steps--item-process .x-steps--item--node{background-color:var(--x-color-primary-6);border-color:var(--x-color-primary-6)}.x-steps-mode-dot .x-steps--item-finish .x-steps--item--node{background-color:var(--x-color-primary-6);border-color:var(--x-color-primary-6)}.x-steps-mode-dot .x-steps--item-error .x-steps--item--node{background-color:var(--x-color-danger-6);border-color:var(--x-color-danger-6)}.x-steps-mode-dot .x-steps--item-disabled .x-steps--item--node{background-color:var(--x-color-fill-2);border-color:var(--x-color-fill-3)}.x-steps-mode-dot.x-steps-horizontal .x-steps--item--node{margin-left:calc((140px - var(--x-size-2))/2)}.x-steps-mode-dot.x-steps-horizontal .x-steps--item-active .x-steps--item--node{margin-top:calc((var(--x-size-2) - 10px)/2);margin-left:calc(calc((140px - var(--x-size-2)) / 2) - (10px - var(--x-size-2))/2)}.x-steps-mode-dot.x-steps-horizontal .x-steps--item--title::after{display:none}.x-steps-mode-dot .x-steps--item--content{display:inline-block}.x-steps-mode-dot .x-steps--item--title{position:relative;display:inline-block;margin-top:var(--x-spacing-2);color:var(--x-color-text-2);font-size:var(--x-font-size-title-1)}.x-steps-mode-dot .x-steps--item-process .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-dot .x-steps--item-finish .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-dot .x-steps--item-error .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-dot .x-steps--item--description{margin-top:var(--x-spacing-2);color:var(--x-color-text-3);font-size:var(--x-font-size-body-1);white-space:normal}.x-steps-mode-dot .x-steps--item-process .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-dot .x-steps--item-finish .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-dot .x-steps--item-error .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-dot .x-steps--item:not(:last-child) .x-steps--item--tail{position:absolute;top:calc((var(--x-size-2) - var(--x-border-1))/2);left:calc(calc((140px - var(--x-size-2)) / 2) + var(--x-size-2) + var(--x-spacing-2));box-sizing:border-box;width:100%;height:var(--x-border-1);background-color:var(--x-color-neutral-3)}.x-steps-mode-dot .x-steps--item-finish:not(:last-child) .x-steps--item--tail{background-color:var(--x-color-primary-6)}.x-steps-mode-dot .x-steps--item-next-error:not(:last-child) .x-steps--item--tail{background-color:var(--x-color-danger-6)}.x-steps-mode-dot.x-steps-vertical .x-steps--item--node{margin-top:var(--x-spacing-4);margin-right:var(--x-spacing-7)}.x-steps-mode-dot.x-steps-vertical .x-steps--item-active .x-steps--item--node{margin-top:calc(var(--x-spacing-4) - (10px - var(--x-size-2))/2);margin-left:calc((var(--x-size-2) - 10px)/2)}.x-steps-mode-dot.x-steps-vertical .x-steps--item--content{overflow:hidden}.x-steps-mode-dot.x-steps-vertical .x-steps--item--title{margin-top:calc(var(--x-spacing-4) + var(--x-size-2)/2 - var(--x-size-7)/2)}.x-steps-mode-dot.x-steps-vertical .x-steps--item--description{margin-top:var(--x-spacing-2)}.x-steps-mode-dot.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail{position:absolute;bottom:0;left:calc(var(--x-size-2)/2);box-sizing:border-box;width:1px;height:100%;padding-top:calc(var(--x-size-2) + 4px + var(--x-spacing-2));padding-bottom:2px;background-color:var(--x-color-transparent);transform:translateX(-50%)}.x-steps-mode-dot.x-steps-vertical .x-steps--item:not(:last-child) .x-steps--item--tail::after{display:block;width:100%;height:100%;background-color:var(--x-color-neutral-3);content:""}.x-steps-mode-dot.x-steps-vertical .x-steps--item-finish:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-primary-6)}.x-steps-mode-dot.x-steps-vertical .x-steps--item-next-error:not(:last-child) .x-steps--item--tail::after{background-color:var(--x-color-danger-6)}.x-steps{--x-steps-arrow-height: 72px;--x-steps-size-arrow: 36px}.x-steps-mode-arrow .x-steps--item{position:relative;display:flex;flex:1;align-items:center;height:var(--x-steps-arrow-height);overflow:visible;white-space:nowrap;background-color:var(--x-color-fill-1)}.x-steps-mode-arrow .x-steps--item:not(:last-child){margin-right:var(--x-spacing-2)}.x-steps-mode-arrow .x-steps--item:not(:first-child)::before{position:absolute;top:0;left:0;z-index:1;display:block;width:0;height:0;border-top:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-bottom:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-left:var(--x-steps-size-arrow) solid var(--x-color-bg-2);content:""}.x-steps-mode-arrow .x-steps--item:not(:last-child)::after{position:absolute;top:0;right:calc(var(--x-steps-size-arrow)*-1);z-index:2;display:block;width:0;height:0;border-top:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-bottom:var(--x-steps-size-arrow) solid var(--x-color-transparent);border-left:var(--x-steps-size-arrow) solid var(--x-color-fill-1);content:""}.x-steps-mode-arrow .x-steps--item-process{background-color:var(--x-color-primary-6)}.x-steps-mode-arrow .x-steps--item-process:not(:last-child)::after{border-left-color:var(--x-color-primary-6)}.x-steps-mode-arrow .x-steps--item-finish{background-color:var(--x-color-primary-light-1)}.x-steps-mode-arrow .x-steps--item-finish:not(:last-child)::after{border-left-color:var(--x-color-primary-light-1)}.x-steps-mode-arrow .x-steps--item-error{background-color:var(--x-color-danger-6)}.x-steps-mode-arrow .x-steps--item-error:not(:last-child)::after{border-left-color:var(--x-color-danger-6)}.x-steps-mode-arrow .x-steps--item-disabled{background-color:var(--x-color-fill-2)}.x-steps-mode-arrow .x-steps--item-disabled:not(:last-child)::after{border-left-color:var(--x-color-fill-2)}.x-steps-mode-arrow .x-steps--item--content{display:inline-block;box-sizing:border-box}.x-steps-mode-arrow .x-steps--item:first-child .x-steps--item--content{padding-left:var(--x-spacing-7)}.x-steps-mode-arrow .x-steps--item:not(:first-child) .x-steps--item--content{padding-left:calc(var(--x-spacing-7) + var(--x-steps-size-arrow))}.x-steps-mode-arrow .x-steps--item--title{position:relative;display:inline-block;color:var(--x-color-text-2);font-size:var(--x-font-size-title-1);white-space:nowrap}.x-steps-mode-arrow .x-steps--item--title::after{display:none}.x-steps-mode-arrow .x-steps--item-process .x-steps--item--title{color:var(--x-color-white)}.x-steps-mode-arrow .x-steps--item-finish .x-steps--item--title{color:var(--x-color-text-1)}.x-steps-mode-arrow .x-steps--item-error .x-steps--item--title{color:var(--x-color-white)}.x-steps-mode-arrow .x-steps--item-active .x-steps--item--title{font-weight:var(--x-font-weight-500)}.x-steps-mode-arrow .x-steps--item--description{max-width:none;margin-top:0;color:var(--x-color-text-3);font-size:var(--x-font-size-body-1);white-space:nowrap}.x-steps-mode-arrow .x-steps--item-process .x-steps--item--description{color:var(--x-color-white)}.x-steps-mode-arrow .x-steps--item-finish .x-steps--item--description{color:var(--x-color-text-3)}.x-steps-mode-arrow .x-steps--item-error .x-steps--item--description{color:var(--x-color-white)}.x-steps-mode-arrow.x-steps-size-small{--x-steps-arrow-height: var(--x-size-10);--x-steps-size-arrow: calc(var(--x-size-10) / 2)}.x-steps-mode-arrow.x-steps-size-small .x-steps--item--title{font-size:var(--x-font-size-body-3)}.x-steps-mode-arrow.x-steps-size-small .x-steps--item--description{display:none}.x-steps-mode-arrow.x-steps-size-small .x-steps--item:first-child .x-steps--item--content{padding-left:var(--x-spacing-8)}.x-steps-mode-arrow.x-steps-size-small .x-steps--item:not(:first-child) .x-steps--item--content{padding-left:calc(var(--x-spacing-8) + var(--x-size-10)/2)}.x-steps-mode-navigation .x-steps--item--title::after{display:none}.x-steps-mode-navigation .x-steps--item{position:relative;padding-right:var(--x-spacing-5);padding-left:var(--x-spacing-8);margin-right:var(--x-spacing-10)}.x-steps-mode-navigation .x-steps--item:last-child{flex:1}.x-steps-mode-navigation .x-steps--item--content{margin-bottom:20px}.x-steps-mode-navigation .x-steps--item--description{padding-right:20px}.x-steps-mode-navigation .x-steps--item-active .x-steps--item--title{color:var(--x-color-primary-text);font-weight:var(--x-font-weight-500)}.x-steps-mode-navigation .x-steps--item:not(:last-child) .x-steps--item--content::after{position:absolute;top:var(--x-spacing-5);right:30px;display:inline-block;width:6px;height:6px;background-color:var(--x-color-bg-2);border:2px solid var(--x-color-text-4);border-bottom:none;border-left:none;transform:rotate(45deg);content:""}.x-steps{display:flex}.x-steps-vertical{flex-direction:column}.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled){cursor:pointer}.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled):hover .x-steps--item--title,.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled):hover .x-steps--item--description{color:var(--x-color-primary-text)}.x-steps-changeable .x-steps--item:not(.x-steps--item-active):not(.x-steps--item-disabled):focus-visible{outline:2px solid var(--x-color-primary-text);outline-offset:4px}.x-steps-changeable .x-steps--item--title,.x-steps-changeable .x-steps--item--description{transition:color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-steps-line-less .x-steps--item--tail,.x-steps-line-less .x-steps--item--title::after{display:none}.x-steps-vertical .x-steps--item:not(:last-child){min-height:90px}.x-steps-vertical .x-steps--item--content{vertical-align:top}.x-steps-vertical .x-steps--item--title::after{display:none}.x-steps-vertical .x-steps--item--description{max-width:none}.x-steps--label-vertical .x-steps--item--content{display:block;width:140px;text-align:center}.x-steps--label-vertical .x-steps--item--description{max-width:none}
|
package/dist/style/table.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--x-table-size-default-padding-horizontal: var(--x-spacing-7);--x-table-size-default-padding-vertical: 8px;--x-table-size-middle-padding-horizontal: var(--x-spacing-7);--x-table-size-middle-padding-vertical: 7px;--x-table-size-small-padding-horizontal: var(--x-spacing-6);--x-table-size-small-padding-vertical: 5px;--x-table-size-mini-padding-horizontal: var(--x-spacing-5);--x-table-size-mini-padding-vertical: 3px;--x-table-size-default-font-size: var(--x-font-size-body-3);--x-table-size-middle-font-size: var(--x-font-size-body-3);--x-table-size-small-font-size: var(--x-font-size-body-3);--x-table-size-mini-font-size: var(--x-font-size-body-1);--x-table-size-default-font-header-size: var(--x-font-size-body-3);--x-table-size-middle-font-header-size: var(--x-font-size-body-3);--x-table-size-small-font-header-size: var(--x-font-size-body-3);--x-table-size-mini-font-header-size: var(--x-font-size-body-1);--x-table-border-width: var(--x-border-1);--x-table-border-style: solid;--x-table-size-expand-button: 14px;--x-table-spacing-expand-button-margin-right: var(--x-spacing-2);--x-table-font-size-expand-button: 12px;--x-table-border-radius-expand-button: 2px;--x-table-color-border: var(--x-color-border-subtle);--x-table-border-radius: 6px;--x-table-color-text-header-cell: var(--x-color-text-primary);--x-table-color-bg-header-cell: var(--x-color-bg-subtle);--x-table-color-bg-header-sorted-cell: var(--x-color-bg-subtle);--x-table-color-bg-header-sorted-cell_hover: var(--x-color-fill-2);--x-table-color-header-filters-icon: var(--x-color-text-4);--x-table-color-header-filters-icon_active: var(--x-color-primary-6);--x-table-color-bg-header-filters-icon_hover: var(--x-color-fill-2);--x-table-font-size-filters-icon: 14px;--x-table-size-filters-width: 32px;--x-table-font-weight-header-text: var(--x-font-weight-600);--x-table-color-text-body-cell: var(--x-color-text-primary);--x-table-color-bg-body-cell: var(--x-color-bg-surface);--x-table-color-bg-body-sorted-cell: var(--x-color-bg-subtle);--x-table-color-bg-body-stripe-row: var(--x-color-bg-subtle);--x-table-color-bg-body-row_hover: var(--x-color-bg-subtle);--x-table-color-bg-body-row_active: var(--x-color-primary-subtle);--x-table-color-bg-body-row_active_dark: var(--x-color-neutral-2);--x-table-color-expand-icon: var(--x-color-text-2);--x-table-color-expand-icon-border: var(--x-color-transparent);--x-table-color-expand-icon-border_hover: var(--x-color-transparent);--x-table-color-expand-icon_hover: var(--x-color-text-1);--x-table-color-bg-expand-icon: var(--x-color-fill-2);--x-table-color-bg-expand-icon_hover: var(--x-color-fill-3);--x-table-color-bg-expand-content: var(--x-color-bg-subtle);--x-table-color-bg-expand-content_hover: var(--x-color-bg-subtle);--x-table-border-expand-icon-width: var(--x-border-1);--x-table-color-header-sorter-icon: var(--x-color-text-4);--x-table-color-header-sorter-icon_next: var(--x-color-text-3);--x-table-color-header-sorter-icon_active: var(--x-color-primary-6);--x-table-spacing-header-sorter-icon-margin-left: var(--x-spacing-3);--x-table-size-header-sorter-icon-height: 7px;--x-table-size-header-sorter-icon-width: 12px;--x-table-font-size-header-sorter-icon: 11px;--x-table-position-header-sorter-icon-up-top: -1px;--x-table-position-header-sorter-icon-down-top: -2px;--x-table-position-header-sorter-icon-left: 0;--x-table-color-bg-filters-popup: var(--x-color-bg-5);--x-table-color-border-filters-popup: var(--x-color-neutral-3);--x-table-popup-min-width: 100px;--x-table-popup-max-height: 200px;--x-table-popup-border-radius: var(--x-border-radius-medium);--x-table-shadow-left: inset 8px 0 8px -8px var(--x-shadow-color-fixed-column);--x-table-shadow-right: inset -8px 0 8px -8px var(--x-shadow-color-fixed-column);--x-table-size-shadow-wrapper-width: 10px;--x-table-spacing-pagination-margin: var(--x-spacing-7);--x-table-size-selection-col-width: 40px;--x-table-size-expand-icon-col-width: 40px;--x-table-size-drag-handle-col-width: 40px;--x-table-size-body-min-width: 40px;--x-table-color-body-background: var(--x-color-bg-surface);--x-table-size-large-padding-horizontal: var(--x-table-size-default-padding-horizontal);--x-table-size-large-padding-vertical: var(--x-table-size-default-padding-vertical);--x-table-size-large-font-size: var(--x-table-size-default-font-size);--x-table-size-large-font-header-size: var(--x-table-size-default-font-header-size);--x-table-size-medium-padding-horizontal: var(--x-table-size-middle-padding-horizontal);--x-table-size-medium-padding-vertical: var(--x-table-size-middle-padding-vertical);--x-table-size-medium-font-size: var(--x-table-size-middle-font-size);--x-table-size-medium-font-header-size: var(--x-table-size-middle-font-header-size);--x-table-color-bg-tfoot: var(--x-color-bg-subtle);--x-table-filters-icon-bg_hover: var(--x-color-fill-2);--x-table-color-border_resizing: var(--x-color-primary-6)}.x-table--filters--content{box-sizing:border-box;min-width:var(--x-table-popup-min-width);background:var(--x-table-color-bg-filters-popup);border:1px solid var(--x-table-color-border-filters-popup);border-radius:var(--x-table-popup-border-radius);box-shadow:var(--x-shadow1-down)}.x-table--filters--list{max-height:var(--x-table-popup-max-height);padding:4px 0;overflow-y:auto}.x-table--filters--item{height:32px;padding:0 12px;font-size:14px;line-height:32px}.x-table--filters--text{width:100%;max-width:160px;height:34px;margin-right:0;padding-left:10px;overflow:hidden;line-height:32px;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.x-table--filters--bottom{box-sizing:border-box;height:38px;padding:0 12px;overflow:hidden;line-height:38px;border-top:1px solid var(--x-table-color-border)}.x-table--filters--bottom>*:not(*:last-child){margin-right:8px}.x-table{position:relative;color:var(--x-table-color-text-body-cell);font-size:var(--x-table-size-default-font-size);line-height:var(--x-line-height-base);background:var(--x-table-color-bg-body-cell)}.x-table--column-handle{position:absolute;top:0;right:-4px;z-index:1;width:8px;height:100%;cursor:col-resize}.x-table .x-spin{display:flex;flex-direction:column;height:100%}.x-table>.x-spin>.x-spin--children::after{z-index:2}.x-table-footer{border-radius:0 0 var(--x-table-border-radius) var(--x-table-border-radius)}.x-table-scroll-position-right .x-table-col-fixed-left-last::after,.x-table-scroll-position-middle .x-table-col-fixed-left-last::after{box-shadow:var(--x-table-shadow-left)}.x-table-scroll-position-left .x-table-col-fixed-right-first::after,.x-table-scroll-position-middle .x-table-col-fixed-right-first::after{box-shadow:var(--x-table-shadow-right)}.x-table-layout-fixed .x-table--element{table-layout:fixed}.x-table .x-table--element{display:table;width:100%;min-width:100%;margin:0;overflow:visible;color:inherit;border:0;border-collapse:separate;border-spacing:0;text-align:left}.x-table .x-table--element .x-table--tr{background-color:var(--x-color-transparent);border-top:0}.x-table .x-table--th{position:relative;box-sizing:border-box;padding:0;color:var(--x-table-color-text-header-cell);font-weight:var(--x-table-font-weight-header-text);line-height:var(--x-line-height-base);text-align:left;background-color:var(--x-table-color-bg-header-cell);border:0;border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table .x-table--th[colspan]{text-align:center}.x-table .x-table--th-align-right{text-align:right}.x-table .x-table--th-align-right .x-table--cell-with-sorter{justify-content:flex-end}.x-table .x-table--th-align-center{text-align:center}.x-table .x-table--th-align-center .x-table--cell-with-sorter{justify-content:center}.x-table .x-table--td{box-sizing:border-box;padding:0;color:var(--x-table-color-text-body-cell);line-height:var(--x-line-height-base);text-align:left;overflow-wrap:break-word;word-break:normal;background-color:var(--x-table-color-bg-body-cell);border:0;border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear),border-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table .x-table--td-align-right{text-align:right}.x-table .x-table--td-align-center{text-align:center}.x-table .x-table--td.x-table-drag-handle{cursor:move}.x-table--cell{position:relative;display:flex;align-items:center;min-height:22px}.x-table--cell-align-left{justify-content:flex-start;text-align:left}.x-table--cell-align-right{justify-content:flex-end;text-align:right}.x-table--cell-align-center{justify-content:center;text-align:center}.x-table-text-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-table--td--content{display:block;width:100%;min-width:0}.x-table .x-table--th.x-table .x-table--th--col-sorted{background-color:var(--x-table-color-bg-header-sorted-cell)}.x-table .x-table--td.x-table .x-table--td--col-sorted{background-color:var(--x-table-color-bg-body-sorted-cell)}.x-table-col-fixed-left,.x-table-col-fixed-right{position:sticky;z-index:10}.x-table-col-fixed-left-last::after,.x-table-col-fixed-right-first::after{position:absolute;top:0;bottom:var(--x-table-border-width);left:0;width:var(--x-table-size-shadow-wrapper-width);box-shadow:none;transform:translateX(-100%);transition:box-shadow var(--x-transition-duration-1) var(--x-transition-timing-function-linear);content:"";pointer-events:none}.x-table-col-fixed-left-last::after{right:0;left:unset;transform:translateX(100%)}.x-table--cell-text-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-table .x-table--expand-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--x-table-size-expand-button);height:var(--x-table-size-expand-button);padding:0;color:var(--x-table-color-expand-icon);font-size:var(--x-table-font-size-expand-button);line-height:var(--x-table-size-expand-button);background-color:var(--x-table-color-bg-expand-icon);border:var(--x-table-border-expand-icon-width) solid var(--x-table-color-expand-icon-border);border-radius:var(--x-table-border-radius-expand-button);outline:none;cursor:pointer;transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table .x-table--expand-btn:hover{color:var(--x-table-color-expand-icon_hover);background-color:var(--x-table-color-bg-expand-icon_hover);border-color:var(--x-table-color-expand-icon-border_hover)}.x-table--cell-expand-icon{display:flex;align-items:center}.x-table--cell-expand-icon .x-table--cell-inline-icon{display:inline-flex;margin-right:var(--x-table-spacing-expand-button-margin-right)}.x-table--cell-expand-icon .x-table--cell-inline-icon .x-icon-loading{color:var(--x-color-primary-6)}.x-table--cell-expand-icon-hidden{display:inline-block;width:var(--x-table-size-expand-button);height:var(--x-table-size-expand-button);margin-right:var(--x-table-spacing-expand-button-margin-right)}.x-table--tr-expand .x-table--td{background-color:var(--x-table-color-bg-expand-content)}.x-table--cell-fixed-expand{position:sticky;left:0;box-sizing:border-box}.x-table--tr-expand .x-table--td .x-table .x-table--container{border:none}.x-table--tr-expand .x-table--td .x-table .x-table--th{border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table--tr-expand .x-table--td .x-table .x-table--th,.x-table--tr-expand .x-table--td .x-table .x-table--td{background-color:var(--x-color-transparent)}.x-table--tr-expand .x-table--td .x-table .x-table-pagination{margin-bottom:var(--x-table-spacing-pagination-margin)}.x-table--th.x-table--operation,.x-table--td.x-table--operation{text-align:center}.x-table--th.x-table--operation .x-table--cell,.x-table--td.x-table--operation .x-table--cell{display:flex;justify-content:center;padding:0}.x-table-radio,.x-table-checkbox{justify-content:center}.x-table-checkbox .x-checkbox,.x-table-radio .x-radio{padding-left:0}.x-table-selection-checkbox-col,.x-table-selection-radio-col{width:var(--x-table-size-selection-col-width);min-width:var(--x-table-size-selection-col-width);max-width:var(--x-table-size-selection-col-width)}.x-table-expand-col{width:var(--x-table-size-expand-icon-col-width);min-width:var(--x-table-size-expand-icon-col-width);max-width:var(--x-table-size-expand-icon-col-width)}.x-table-drag-handle-col{width:var(--x-table-size-drag-handle-col-width);min-width:var(--x-table-size-drag-handle-col-width);max-width:var(--x-table-size-drag-handle-col-width)}.x-table--th{transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--cell-with-sorter{display:flex;align-items:center;width:100%;cursor:pointer}.x-table--cell-with-sorter:hover{background-color:var(--x-table-color-bg-header-sorted-cell_hover)}.x-table--cell-with-sorter:hover .x-table--sorter--icon .x-icon-caret-up,.x-table--cell-with-sorter:hover .x-table--sorter--icon .x-icon-caret-down{color:var(--x-table-color-header-sorter-icon_next)}.x-table--cell-with-filter{display:flex;align-items:center}.x-table--cell-next-ascend .x-table--sorter--icon .x-icon-caret-up{color:var(--x-table-color-header-sorter-icon_next)}.x-table--cell-next-descend .x-table--sorter--icon .x-icon-caret-down{color:var(--x-table-color-header-sorter-icon_next)}.x-table--sorter{display:inline-flex;flex:none;flex-direction:column;align-items:center;justify-content:center;margin-left:var(--x-table-spacing-header-sorter-icon-margin-left);vertical-align:-3px}.x-table--sorter--icon{position:relative;width:var(--x-table-size-header-sorter-icon-width);height:var(--x-table-size-header-sorter-icon-height);overflow:hidden;line-height:var(--x-table-size-header-sorter-icon-height)}.x-table--sorter--icon .x-icon-caret-up,.x-table--sorter--icon .x-icon-caret-down{position:absolute;top:50%;color:var(--x-table-color-header-sorter-icon);font-size:var(--x-table-font-size-header-sorter-icon);transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--sorter--icon .x-icon-caret-up{top:var(--x-table-position-header-sorter-icon-up-top);left:var(--x-table-position-header-sorter-icon-left)}.x-table--sorter--icon .x-icon-caret-down{top:var(--x-table-position-header-sorter-icon-down-top);left:var(--x-table-position-header-sorter-icon-left)}.x-table--sorter--icon-active svg{color:var(--x-table-color-header-sorter-icon_active)}.x-table--filters{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;width:var(--x-table-size-filters-width);height:100%;line-height:1;vertical-align:0;background-color:var(--x-color-transparent);cursor:pointer;transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--filters:hover,.x-table--filters-open{color:var(--x-color-text-2);background-color:var(--x-table-color-bg-header-filters-icon_hover)}.x-table--filters svg{color:var(--x-table-color-header-filters-icon);font-size:var(--x-table-font-size-filters-icon);transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--filters-active svg{color:var(--x-table-color-header-filters-icon_active)}.x-table--filters-align-left{position:relative;width:auto;margin-left:var(--x-table-spacing-header-sorter-icon-margin-left)}.x-table--filters-align-left svg{font-size:var(--x-table-font-size-header-sorter-icon)}.x-table--filters-align-left:hover,.x-table--filters-align-left-open{background:none}.x-table--filters-align-left:hover::before,.x-table--filters-align-left.x-table--filters-open::before{background:var(--x-table-filters-icon-bg_hover)}.x-table--container{position:relative;overflow:hidden;border-radius:var(--x-table-border-radius)}.x-table--header{flex-shrink:0;border-radius:var(--x-table-border-radius) var(--x-table-border-radius) 0 0}.x-table--container{box-sizing:border-box;width:100%;min-height:0}.x-table--container .x-table--content{display:flex;flex-direction:column;width:auto;height:100%}.x-table--container .x-table--content-scroll-x{overflow-x:auto;overflow-y:hidden}.x-table--container::before,.x-table--container::after{position:absolute;z-index:1;width:var(--x-table-size-shadow-wrapper-width);height:100%;box-shadow:none;transition:box-shadow var(--x-transition-duration-1) var(--x-transition-timing-function-linear);content:"";pointer-events:none}.x-table--container::before{top:0;left:0;border-top-left-radius:var(--x-table-border-radius)}.x-table--container::after{top:0;right:0;border-top-right-radius:var(--x-table-border-radius)}.x-table--container:not(.x-table-has-fixed-col-left).x-table-scroll-position-right::before,.x-table--container:not(.x-table-has-fixed-col-left).x-table-scroll-position-middle::before{box-shadow:var(--x-table-shadow-left)}.x-table--container:not(.x-table-has-fixed-col-right).x-table-scroll-position-left::after,.x-table--container:not(.x-table-has-fixed-col-right).x-table-scroll-position-middle::after{box-shadow:var(--x-table-shadow-right)}.x-table--header{overflow-x:hidden;overflow-y:hidden;background-color:var(--x-table-color-bg-header-cell);scrollbar-color:var(--x-color-transparent) var(--x-color-transparent)}.x-table--header-sticky{position:sticky;top:0;z-index:100}.x-table:not(.x-table-empty) .x-table--header::-webkit-scrollbar{height:0;background-color:var(--x-color-transparent)}.x-table.x-table--empty--header{overflow-x:auto}.x-table--body{position:relative;width:100%;min-height:var(--x-table-size-body-min-width);overflow:auto;background-color:var(--x-table-color-body-background)}.x-table-border .x-table--container{border:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border .x-table-scroll-y{border-bottom:none}.x-table-border .x-table-scroll-y .x-table--body .x-table--tr:last-of-type .x-table--td,.x-table-border .x-table-scroll-y tfoot .x-table--tr:last-of-type .x-table--td{border-bottom:none}.x-table-border .x-table-scroll-y .x-table--body .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-left-last::after,.x-table-border .x-table-scroll-y .x-table--body .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-right-first::after,.x-table-border .x-table-scroll-y tfoot .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-left-last::after,.x-table-border .x-table-scroll-y tfoot .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-right-first::after{bottom:0}.x-table-border .x-table--tr .x-table--th{border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border .x-table--footer{border:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);border-top:0}.x-table-border:not(.x-table-border-cell) .x-table--container{border-color:var(--x-table-color-border)}.x-table-border-cell .x-table--th,.x-table-border-cell .x-table--td:not(.x-table--tr-expand){border-right:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border-cell .x-table--tr .x-table--th:last-child,.x-table-border-cell .x-table--tr .x-table--td:last-child{border-right:0}.x-table-border-cell .x-table--th-resizing,.x-table-border-cell .x-table--td-resizing:not(.x-table--tr-expand){border-right-color:var(--x-table-color-border_resizing)}.x-table-border-header-cell .x-table--th{border-right:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border-header-cell .x-table--th-resizing,.x-table-border-header-cell .x-table--td-resizing:not(.x-table--tr-expand){border-right-color:var(--x-table-color-border_resizing)}.x-table-border.x-table-border-header-cell thead .x-table--tr:first-child .x-table--th:last-child{border-right:0}.x-table-border-body-cell .x-table--td:not(:last-child):not(.x-table--tr-expand){border-right:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-stripe:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):nth-child(even) .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right),.x-table-stripe .x-table--tr-drag .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-table-color-bg-body-stripe-row)}.x-table-stripe:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):nth-child(even) .x-table--td.x-table-col-fixed-left::before,.x-table-stripe:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):nth-child(even) .x-table--td.x-table-col-fixed-right::before,.x-table-stripe .x-table--tr-drag .x-table--td.x-table-col-fixed-left::before,.x-table-stripe .x-table--tr-drag .x-table--td.x-table-col-fixed-right::before{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:var(--x-table-color-bg-body-stripe-row);content:""}.x-table .x-table--tr-draggable{cursor:move}.x-table-hover:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):hover .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right),.x-table-hover .x-table--tr-drag .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-table-color-bg-body-row_hover)}.x-table-hover:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):hover .x-table--td.x-table-col-fixed-left::before,.x-table-hover:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):hover .x-table--td.x-table-col-fixed-right::before,.x-table-hover .x-table--tr-drag .x-table--td.x-table-col-fixed-left::before,.x-table-hover .x-table--tr-drag .x-table--td.x-table-col-fixed-right::before{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:var(--x-table-color-bg-body-row_hover);content:""}.x-table-hover .x-table--tr-expand:not(.x-table--tr-empty):hover .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-table-color-bg-expand-content_hover)}.x-table--tr-expand .x-table--td .x-table-hover .x-table--tr:not(.x-table--tr-empty) .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-color-transparent)}.x-table--tr-expand .x-table--td .x-table-hover .x-table--tr:not(.x-table--tr-empty) .x-table--td.x-table-col-fixed-left::before,.x-table--tr-expand .x-table--td .x-table-hover .x-table--tr:not(.x-table--tr-empty) .x-table--td.x-table-col-fixed-right::before{background-color:var(--x-color-transparent)}.x-table-tfoot{position:relative;z-index:1;flex-shrink:0;width:100%;overflow-x:auto;background-color:var(--x-table-color-bg-tfoot);border-top:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);box-shadow:none;scrollbar-color:var(--x-color-transparent) var(--x-color-transparent)}.x-table-tfoot::-webkit-scrollbar{height:0;background-color:var(--x-color-transparent)}.x-table tfoot .x-table--td{background-color:var(--x-table-color-bg-tfoot)}.x-table--tr-checked .x-table--td{background-color:var(--x-table-color-bg-body-row_active)}.x-table .x-table--cell{padding:var(--x-table-size-large-padding-vertical) var(--x-table-size-large-padding-horizontal)}.x-table .x-table--th{font-size:var(--x-table-size-large-font-header-size)}.x-table .x-table--td{font-size:var(--x-table-size-large-font-size)}.x-table .x-table--footer{padding:var(--x-table-size-large-padding-vertical) var(--x-table-size-large-padding-horizontal)}.x-table .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-large-padding-vertical)) calc(-1*var(--x-table-size-large-padding-horizontal)) calc(-1*var(--x-table-size-large-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-large-padding-horizontal))}.x-table-size-medium .x-table--cell{padding:var(--x-table-size-medium-padding-vertical) var(--x-table-size-medium-padding-horizontal)}.x-table-size-medium .x-table--th{font-size:var(--x-table-size-medium-font-header-size)}.x-table-size-medium .x-table--td{font-size:var(--x-table-size-medium-font-size)}.x-table-size-medium .x-table--footer{padding:var(--x-table-size-medium-padding-vertical) var(--x-table-size-medium-padding-horizontal)}.x-table-size-medium .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-medium-padding-vertical)) calc(-1*var(--x-table-size-medium-padding-horizontal)) calc(-1*var(--x-table-size-medium-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-medium-padding-horizontal))}.x-table-size-small .x-table--cell{padding:var(--x-table-size-small-padding-vertical) var(--x-table-size-small-padding-horizontal)}.x-table-size-small .x-table--th{font-size:var(--x-table-size-small-font-header-size)}.x-table-size-small .x-table--td{font-size:var(--x-table-size-small-font-size)}.x-table-size-small .x-table--footer{padding:var(--x-table-size-small-padding-vertical) var(--x-table-size-small-padding-horizontal)}.x-table-size-small .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-small-padding-vertical)) calc(-1*var(--x-table-size-small-padding-horizontal)) calc(-1*var(--x-table-size-small-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-small-padding-horizontal))}.x-table-size-mini .x-table--cell{padding:var(--x-table-size-mini-padding-vertical) var(--x-table-size-mini-padding-horizontal)}.x-table-size-mini .x-table--th{font-size:var(--x-table-size-mini-font-header-size)}.x-table-size-mini .x-table--td{font-size:var(--x-table-size-mini-font-size)}.x-table-size-mini .x-table--footer{padding:var(--x-table-size-mini-padding-vertical) var(--x-table-size-mini-padding-horizontal)}.x-table-size-mini .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-mini-padding-vertical)) calc(-1*var(--x-table-size-mini-padding-horizontal)) calc(-1*var(--x-table-size-mini-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-mini-padding-horizontal))}.x-table-virtualized .x-table--element{table-layout:fixed}.x-table-virtualized .x-table--body .x-table--tr{display:flex}.x-table-virtualized .x-table--body .x-table--td{display:flex;flex:1;align-items:center}.x-table-pagination{display:flex;align-items:center;flex-wrap:wrap;gap:var(--x-spacing-4);justify-content:flex-end;margin-top:var(--x-table-spacing-pagination-margin)}.x-table-pagination>*{flex:none}.x-table-pagination-left{justify-content:flex-start}.x-table-pagination-center{justify-content:center}.x-table-pagination-top{margin-top:0;margin-bottom:var(--x-table-spacing-pagination-margin)}.x-virtual-list>.x-table--element{width:auto}
|
|
1
|
+
:root{--x-table-size-default-padding-horizontal: var(--x-spacing-7);--x-table-size-default-padding-vertical: 8px;--x-table-size-middle-padding-horizontal: var(--x-spacing-7);--x-table-size-middle-padding-vertical: 7px;--x-table-size-small-padding-horizontal: var(--x-spacing-6);--x-table-size-small-padding-vertical: 5px;--x-table-size-mini-padding-horizontal: var(--x-spacing-5);--x-table-size-mini-padding-vertical: 3px;--x-table-size-default-font-size: var(--x-font-size-body-3);--x-table-size-middle-font-size: var(--x-font-size-body-3);--x-table-size-small-font-size: var(--x-font-size-body-3);--x-table-size-mini-font-size: var(--x-font-size-body-1);--x-table-size-default-font-header-size: var(--x-font-size-body-3);--x-table-size-middle-font-header-size: var(--x-font-size-body-3);--x-table-size-small-font-header-size: var(--x-font-size-body-3);--x-table-size-mini-font-header-size: var(--x-font-size-body-1);--x-table-border-width: var(--x-border-1);--x-table-border-style: solid;--x-table-size-expand-button: 14px;--x-table-spacing-expand-button-margin-right: var(--x-spacing-2);--x-table-font-size-expand-button: 12px;--x-table-border-radius-expand-button: 2px;--x-table-color-border: var(--x-color-border-subtle);--x-table-border-radius: 6px;--x-table-color-text-header-cell: var(--x-color-text-primary);--x-table-color-bg-header-cell: var(--x-color-bg-subtle);--x-table-color-bg-header-sorted-cell: var(--x-color-bg-subtle);--x-table-color-bg-header-sorted-cell_hover: var(--x-color-fill-2);--x-table-color-header-filters-icon: var(--x-color-text-4);--x-table-color-header-filters-icon_active: var(--x-color-primary-6);--x-table-color-bg-header-filters-icon_hover: var(--x-color-fill-2);--x-table-font-size-filters-icon: 14px;--x-table-size-filters-width: 32px;--x-table-font-weight-header-text: var(--x-font-weight-600);--x-table-color-text-body-cell: var(--x-color-text-primary);--x-table-color-bg-body-cell: var(--x-color-bg-surface);--x-table-color-bg-body-sorted-cell: var(--x-color-bg-subtle);--x-table-color-bg-body-stripe-row: var(--x-color-bg-subtle);--x-table-color-bg-body-row_hover: var(--x-color-bg-subtle);--x-table-color-bg-body-row_active: var(--x-color-primary-subtle);--x-table-color-bg-body-row_active_dark: var(--x-color-neutral-2);--x-table-color-expand-icon: var(--x-color-text-2);--x-table-color-expand-icon-border: var(--x-color-transparent);--x-table-color-expand-icon-border_hover: var(--x-color-transparent);--x-table-color-expand-icon_hover: var(--x-color-text-1);--x-table-color-bg-expand-icon: var(--x-color-fill-2);--x-table-color-bg-expand-icon_hover: var(--x-color-fill-3);--x-table-color-bg-expand-content: var(--x-color-bg-subtle);--x-table-color-bg-expand-content_hover: var(--x-color-bg-subtle);--x-table-border-expand-icon-width: var(--x-border-1);--x-table-color-header-sorter-icon: var(--x-color-text-4);--x-table-color-header-sorter-icon_next: var(--x-color-text-3);--x-table-color-header-sorter-icon_active: var(--x-color-primary-6);--x-table-spacing-header-sorter-icon-margin-left: var(--x-spacing-3);--x-table-size-header-sorter-icon-height: 7px;--x-table-size-header-sorter-icon-width: 12px;--x-table-font-size-header-sorter-icon: 11px;--x-table-position-header-sorter-icon-up-top: -1px;--x-table-position-header-sorter-icon-down-top: -2px;--x-table-position-header-sorter-icon-left: 0;--x-table-color-bg-filters-popup: var(--x-color-bg-5);--x-table-color-border-filters-popup: var(--x-color-neutral-3);--x-table-popup-min-width: 100px;--x-table-popup-max-height: 200px;--x-table-popup-border-radius: var(--x-border-radius-medium);--x-table-shadow-left: inset 8px 0 8px -8px var(--x-shadow-color-fixed-column);--x-table-shadow-right: inset -8px 0 8px -8px var(--x-shadow-color-fixed-column);--x-table-size-shadow-wrapper-width: 10px;--x-table-spacing-pagination-margin: var(--x-spacing-7);--x-table-size-selection-col-width: 40px;--x-table-size-expand-icon-col-width: 40px;--x-table-size-drag-handle-col-width: 40px;--x-table-size-body-min-width: 40px;--x-table-color-body-background: var(--x-color-bg-surface);--x-table-size-large-padding-horizontal: var(--x-table-size-default-padding-horizontal);--x-table-size-large-padding-vertical: var(--x-table-size-default-padding-vertical);--x-table-size-large-font-size: var(--x-table-size-default-font-size);--x-table-size-large-font-header-size: var(--x-table-size-default-font-header-size);--x-table-size-medium-padding-horizontal: var(--x-table-size-middle-padding-horizontal);--x-table-size-medium-padding-vertical: var(--x-table-size-middle-padding-vertical);--x-table-size-medium-font-size: var(--x-table-size-middle-font-size);--x-table-size-medium-font-header-size: var(--x-table-size-middle-font-header-size);--x-table-color-bg-tfoot: var(--x-color-bg-subtle);--x-table-filters-icon-bg_hover: var(--x-color-fill-2);--x-table-color-border_resizing: var(--x-color-primary-6)}.x-table--filters--content{box-sizing:border-box;min-width:var(--x-table-popup-min-width);background:var(--x-table-color-bg-filters-popup);border:1px solid var(--x-table-color-border-filters-popup);border-radius:var(--x-table-popup-border-radius);box-shadow:var(--x-shadow1-down)}.x-table--filters--list{max-height:var(--x-table-popup-max-height);padding:4px 0;overflow-y:auto}.x-table--filters--item{height:32px;padding:0 12px;font-size:14px;line-height:32px}.x-table--filters--text{width:100%;max-width:160px;height:34px;margin-right:0;padding-left:10px;overflow:hidden;line-height:32px;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.x-table--filters--bottom{box-sizing:border-box;height:38px;padding:0 12px;overflow:hidden;line-height:38px;border-top:1px solid var(--x-table-color-border)}.x-table--filters--bottom>*:not(*:last-child){margin-right:8px}.x-table{position:relative;color:var(--x-table-color-text-body-cell);font-size:var(--x-table-size-default-font-size);line-height:var(--x-line-height-base);background:var(--x-table-color-bg-body-cell)}.x-table--column-handle{position:absolute;top:0;right:-4px;z-index:1;width:8px;height:100%;cursor:col-resize}.x-table .x-spin{display:flex;flex-direction:column;height:100%}.x-table>.x-spin>.x-spin--children::after{z-index:2}.x-table-footer{border-radius:0 0 var(--x-table-border-radius) var(--x-table-border-radius)}.x-table-scroll-position-right .x-table-col-fixed-left-last::after,.x-table-scroll-position-middle .x-table-col-fixed-left-last::after{box-shadow:var(--x-table-shadow-left)}.x-table-scroll-position-left .x-table-col-fixed-right-first::after,.x-table-scroll-position-middle .x-table-col-fixed-right-first::after{box-shadow:var(--x-table-shadow-right)}.x-table-layout-fixed .x-table--element{table-layout:fixed}.x-table .x-table--element{display:table;width:100%;min-width:100%;margin:0;overflow:visible;color:inherit;border:0;border-collapse:separate;border-spacing:0;text-align:left}.x-table .x-table--element .x-table--tr{background-color:var(--x-color-transparent);border-top:0}.x-table .x-table--th{position:relative;box-sizing:border-box;padding:0;color:var(--x-table-color-text-header-cell);font-weight:var(--x-table-font-weight-header-text);line-height:var(--x-line-height-base);text-align:left;background-color:var(--x-table-color-bg-header-cell);border:0;border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table .x-table--th[colspan]{text-align:center}.x-table .x-table--th-align-right{text-align:right}.x-table .x-table--th-align-right .x-table--cell-with-sorter{justify-content:flex-end}.x-table .x-table--th-align-center{text-align:center}.x-table .x-table--th-align-center .x-table--cell-with-sorter{justify-content:center}.x-table .x-table--td{box-sizing:border-box;padding:0;color:var(--x-table-color-text-body-cell);line-height:var(--x-line-height-base);text-align:left;overflow-wrap:break-word;word-break:normal;background-color:var(--x-table-color-bg-body-cell);border:0;border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear),border-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table .x-table--td-align-right{text-align:right}.x-table .x-table--td-align-center{text-align:center}.x-table .x-table--td.x-table-drag-handle{cursor:move}.x-table--cell{position:relative;display:flex;align-items:center;min-height:22px}.x-table--cell-align-left{justify-content:flex-start;text-align:left}.x-table--cell-align-right{justify-content:flex-end;text-align:right}.x-table--cell-align-center{justify-content:center;text-align:center}.x-table-text-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-table--td--content{display:block;width:100%;min-width:0}.x-table .x-table--th.x-table .x-table--th--col-sorted{background-color:var(--x-table-color-bg-header-sorted-cell)}.x-table .x-table--td.x-table .x-table--td--col-sorted{background-color:var(--x-table-color-bg-body-sorted-cell)}.x-table-col-fixed-left,.x-table-col-fixed-right{position:sticky;z-index:10}.x-table-col-fixed-left-last::after,.x-table-col-fixed-right-first::after{position:absolute;top:0;bottom:var(--x-table-border-width);left:0;width:var(--x-table-size-shadow-wrapper-width);box-shadow:none;transform:translateX(-100%);transition:box-shadow var(--x-transition-duration-1) var(--x-transition-timing-function-linear);content:"";pointer-events:none}.x-table-col-fixed-left-last::after{right:0;left:unset;transform:translateX(100%)}.x-table--cell-text-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-table .x-table--expand-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--x-table-size-expand-button);height:var(--x-table-size-expand-button);padding:0;color:var(--x-table-color-expand-icon);font-size:var(--x-table-font-size-expand-button);line-height:var(--x-table-size-expand-button);background-color:var(--x-table-color-bg-expand-icon);border:var(--x-table-border-expand-icon-width) solid var(--x-table-color-expand-icon-border);border-radius:var(--x-table-border-radius-expand-button);outline:none;cursor:pointer;transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table .x-table--expand-btn:hover{color:var(--x-table-color-expand-icon_hover);background-color:var(--x-table-color-bg-expand-icon_hover);border-color:var(--x-table-color-expand-icon-border_hover)}.x-table--cell-expand-icon{display:flex;align-items:center}.x-table--cell-expand-icon .x-table--cell-inline-icon{display:inline-flex;margin-right:var(--x-table-spacing-expand-button-margin-right)}.x-table--cell-expand-icon .x-table--cell-inline-icon .x-icon-loading{color:var(--x-color-primary-text)}.x-table--cell-expand-icon-hidden{display:inline-block;width:var(--x-table-size-expand-button);height:var(--x-table-size-expand-button);margin-right:var(--x-table-spacing-expand-button-margin-right)}.x-table--tr-expand .x-table--td{background-color:var(--x-table-color-bg-expand-content)}.x-table--cell-fixed-expand{position:sticky;left:0;box-sizing:border-box}.x-table--tr-expand .x-table--td .x-table .x-table--container{border:none}.x-table--tr-expand .x-table--td .x-table .x-table--th{border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table--tr-expand .x-table--td .x-table .x-table--th,.x-table--tr-expand .x-table--td .x-table .x-table--td{background-color:var(--x-color-transparent)}.x-table--tr-expand .x-table--td .x-table .x-table-pagination{margin-bottom:var(--x-table-spacing-pagination-margin)}.x-table--th.x-table--operation,.x-table--td.x-table--operation{text-align:center}.x-table--th.x-table--operation .x-table--cell,.x-table--td.x-table--operation .x-table--cell{display:flex;justify-content:center;padding:0}.x-table-radio,.x-table-checkbox{justify-content:center}.x-table-checkbox .x-checkbox,.x-table-radio .x-radio{padding-left:0}.x-table-selection-checkbox-col,.x-table-selection-radio-col{width:var(--x-table-size-selection-col-width);min-width:var(--x-table-size-selection-col-width);max-width:var(--x-table-size-selection-col-width)}.x-table-expand-col{width:var(--x-table-size-expand-icon-col-width);min-width:var(--x-table-size-expand-icon-col-width);max-width:var(--x-table-size-expand-icon-col-width)}.x-table-drag-handle-col{width:var(--x-table-size-drag-handle-col-width);min-width:var(--x-table-size-drag-handle-col-width);max-width:var(--x-table-size-drag-handle-col-width)}.x-table--th{transition:background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--cell-with-sorter{display:flex;align-items:center;width:100%;cursor:pointer}.x-table--cell-with-sorter:hover{background-color:var(--x-table-color-bg-header-sorted-cell_hover)}.x-table--cell-with-sorter:hover .x-table--sorter--icon .x-icon-caret-up,.x-table--cell-with-sorter:hover .x-table--sorter--icon .x-icon-caret-down{color:var(--x-table-color-header-sorter-icon_next)}.x-table--cell-with-filter{display:flex;align-items:center}.x-table--cell-next-ascend .x-table--sorter--icon .x-icon-caret-up{color:var(--x-table-color-header-sorter-icon_next)}.x-table--cell-next-descend .x-table--sorter--icon .x-icon-caret-down{color:var(--x-table-color-header-sorter-icon_next)}.x-table--sorter{display:inline-flex;flex:none;flex-direction:column;align-items:center;justify-content:center;margin-left:var(--x-table-spacing-header-sorter-icon-margin-left);vertical-align:-3px}.x-table--sorter--icon{position:relative;width:var(--x-table-size-header-sorter-icon-width);height:var(--x-table-size-header-sorter-icon-height);overflow:hidden;line-height:var(--x-table-size-header-sorter-icon-height)}.x-table--sorter--icon .x-icon-caret-up,.x-table--sorter--icon .x-icon-caret-down{position:absolute;top:50%;color:var(--x-table-color-header-sorter-icon);font-size:var(--x-table-font-size-header-sorter-icon);transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--sorter--icon .x-icon-caret-up{top:var(--x-table-position-header-sorter-icon-up-top);left:var(--x-table-position-header-sorter-icon-left)}.x-table--sorter--icon .x-icon-caret-down{top:var(--x-table-position-header-sorter-icon-down-top);left:var(--x-table-position-header-sorter-icon-left)}.x-table--sorter--icon-active svg{color:var(--x-table-color-header-sorter-icon_active)}.x-table--filters{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;width:var(--x-table-size-filters-width);height:100%;line-height:1;vertical-align:0;background-color:var(--x-color-transparent);cursor:pointer;transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--filters:hover,.x-table--filters-open{color:var(--x-color-text-2);background-color:var(--x-table-color-bg-header-filters-icon_hover)}.x-table--filters svg{color:var(--x-table-color-header-filters-icon);font-size:var(--x-table-font-size-filters-icon);transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-table--filters-active svg{color:var(--x-table-color-header-filters-icon_active)}.x-table--filters-align-left{position:relative;width:auto;margin-left:var(--x-table-spacing-header-sorter-icon-margin-left)}.x-table--filters-align-left svg{font-size:var(--x-table-font-size-header-sorter-icon)}.x-table--filters-align-left:hover,.x-table--filters-align-left-open{background:none}.x-table--filters-align-left:hover::before,.x-table--filters-align-left.x-table--filters-open::before{background:var(--x-table-filters-icon-bg_hover)}.x-table--container{position:relative;overflow:hidden;border-radius:var(--x-table-border-radius)}.x-table--header{flex-shrink:0;border-radius:var(--x-table-border-radius) var(--x-table-border-radius) 0 0}.x-table--container{box-sizing:border-box;width:100%;min-height:0}.x-table--container .x-table--content{display:flex;flex-direction:column;width:auto;height:100%}.x-table--container .x-table--content-scroll-x{overflow-x:auto;overflow-y:hidden}.x-table--container::before,.x-table--container::after{position:absolute;z-index:1;width:var(--x-table-size-shadow-wrapper-width);height:100%;box-shadow:none;transition:box-shadow var(--x-transition-duration-1) var(--x-transition-timing-function-linear);content:"";pointer-events:none}.x-table--container::before{top:0;left:0;border-top-left-radius:var(--x-table-border-radius)}.x-table--container::after{top:0;right:0;border-top-right-radius:var(--x-table-border-radius)}.x-table--container:not(.x-table-has-fixed-col-left).x-table-scroll-position-right::before,.x-table--container:not(.x-table-has-fixed-col-left).x-table-scroll-position-middle::before{box-shadow:var(--x-table-shadow-left)}.x-table--container:not(.x-table-has-fixed-col-right).x-table-scroll-position-left::after,.x-table--container:not(.x-table-has-fixed-col-right).x-table-scroll-position-middle::after{box-shadow:var(--x-table-shadow-right)}.x-table--header{overflow-x:hidden;overflow-y:hidden;background-color:var(--x-table-color-bg-header-cell);scrollbar-color:var(--x-color-transparent) var(--x-color-transparent)}.x-table--header-sticky{position:sticky;top:0;z-index:100}.x-table:not(.x-table-empty) .x-table--header::-webkit-scrollbar{height:0;background-color:var(--x-color-transparent)}.x-table.x-table--empty--header{overflow-x:auto}.x-table--body{position:relative;width:100%;min-height:var(--x-table-size-body-min-width);overflow:auto;background-color:var(--x-table-color-body-background)}.x-table-border .x-table--container{border:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border .x-table-scroll-y{border-bottom:none}.x-table-border .x-table-scroll-y .x-table--body .x-table--tr:last-of-type .x-table--td,.x-table-border .x-table-scroll-y tfoot .x-table--tr:last-of-type .x-table--td{border-bottom:none}.x-table-border .x-table-scroll-y .x-table--body .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-left-last::after,.x-table-border .x-table-scroll-y .x-table--body .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-right-first::after,.x-table-border .x-table-scroll-y tfoot .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-left-last::after,.x-table-border .x-table-scroll-y tfoot .x-table--tr:last-of-type .x-table--td.x-table-col-fixed-right-first::after{bottom:0}.x-table-border .x-table--tr .x-table--th{border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border .x-table--footer{border:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);border-top:0}.x-table-border:not(.x-table-border-cell) .x-table--container{border-color:var(--x-table-color-border)}.x-table-border-cell .x-table--th,.x-table-border-cell .x-table--td:not(.x-table--tr-expand){border-right:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border-cell .x-table--tr .x-table--th:last-child,.x-table-border-cell .x-table--tr .x-table--td:last-child{border-right:0}.x-table-border-cell .x-table--th-resizing,.x-table-border-cell .x-table--td-resizing:not(.x-table--tr-expand){border-right-color:var(--x-table-color-border_resizing)}.x-table-border-header-cell .x-table--th{border-right:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);border-bottom:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-border-header-cell .x-table--th-resizing,.x-table-border-header-cell .x-table--td-resizing:not(.x-table--tr-expand){border-right-color:var(--x-table-color-border_resizing)}.x-table-border.x-table-border-header-cell thead .x-table--tr:first-child .x-table--th:last-child{border-right:0}.x-table-border-body-cell .x-table--td:not(:last-child):not(.x-table--tr-expand){border-right:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border)}.x-table-stripe:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):nth-child(even) .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right),.x-table-stripe .x-table--tr-drag .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-table-color-bg-body-stripe-row)}.x-table-stripe:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):nth-child(even) .x-table--td.x-table-col-fixed-left::before,.x-table-stripe:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):nth-child(even) .x-table--td.x-table-col-fixed-right::before,.x-table-stripe .x-table--tr-drag .x-table--td.x-table-col-fixed-left::before,.x-table-stripe .x-table--tr-drag .x-table--td.x-table-col-fixed-right::before{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:var(--x-table-color-bg-body-stripe-row);content:""}.x-table .x-table--tr-draggable{cursor:move}.x-table-hover:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):hover .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right),.x-table-hover .x-table--tr-drag .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-table-color-bg-body-row_hover)}.x-table-hover:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):hover .x-table--td.x-table-col-fixed-left::before,.x-table-hover:not(.x-table-dragging) .x-table--tr:not(.x-table--tr-empty):not(.x-table--tr-summary):hover .x-table--td.x-table-col-fixed-right::before,.x-table-hover .x-table--tr-drag .x-table--td.x-table-col-fixed-left::before,.x-table-hover .x-table--tr-drag .x-table--td.x-table-col-fixed-right::before{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:var(--x-table-color-bg-body-row_hover);content:""}.x-table-hover .x-table--tr-expand:not(.x-table--tr-empty):hover .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-table-color-bg-expand-content_hover)}.x-table--tr-expand .x-table--td .x-table-hover .x-table--tr:not(.x-table--tr-empty) .x-table--td:not(.x-table-col-fixed-left):not(.x-table-col-fixed-right){background-color:var(--x-color-transparent)}.x-table--tr-expand .x-table--td .x-table-hover .x-table--tr:not(.x-table--tr-empty) .x-table--td.x-table-col-fixed-left::before,.x-table--tr-expand .x-table--td .x-table-hover .x-table--tr:not(.x-table--tr-empty) .x-table--td.x-table-col-fixed-right::before{background-color:var(--x-color-transparent)}.x-table-tfoot{position:relative;z-index:1;flex-shrink:0;width:100%;overflow-x:auto;background-color:var(--x-table-color-bg-tfoot);border-top:var(--x-table-border-width) var(--x-table-border-style) var(--x-table-color-border);box-shadow:none;scrollbar-color:var(--x-color-transparent) var(--x-color-transparent)}.x-table-tfoot::-webkit-scrollbar{height:0;background-color:var(--x-color-transparent)}.x-table tfoot .x-table--td{background-color:var(--x-table-color-bg-tfoot)}.x-table--tr-checked .x-table--td{background-color:var(--x-table-color-bg-body-row_active)}.x-table .x-table--cell{padding:var(--x-table-size-large-padding-vertical) var(--x-table-size-large-padding-horizontal)}.x-table .x-table--th{font-size:var(--x-table-size-large-font-header-size)}.x-table .x-table--td{font-size:var(--x-table-size-large-font-size)}.x-table .x-table--footer{padding:var(--x-table-size-large-padding-vertical) var(--x-table-size-large-padding-horizontal)}.x-table .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-large-padding-vertical)) calc(-1*var(--x-table-size-large-padding-horizontal)) calc(-1*var(--x-table-size-large-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-large-padding-horizontal))}.x-table-size-medium .x-table--cell{padding:var(--x-table-size-medium-padding-vertical) var(--x-table-size-medium-padding-horizontal)}.x-table-size-medium .x-table--th{font-size:var(--x-table-size-medium-font-header-size)}.x-table-size-medium .x-table--td{font-size:var(--x-table-size-medium-font-size)}.x-table-size-medium .x-table--footer{padding:var(--x-table-size-medium-padding-vertical) var(--x-table-size-medium-padding-horizontal)}.x-table-size-medium .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-medium-padding-vertical)) calc(-1*var(--x-table-size-medium-padding-horizontal)) calc(-1*var(--x-table-size-medium-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-medium-padding-horizontal))}.x-table-size-small .x-table--cell{padding:var(--x-table-size-small-padding-vertical) var(--x-table-size-small-padding-horizontal)}.x-table-size-small .x-table--th{font-size:var(--x-table-size-small-font-header-size)}.x-table-size-small .x-table--td{font-size:var(--x-table-size-small-font-size)}.x-table-size-small .x-table--footer{padding:var(--x-table-size-small-padding-vertical) var(--x-table-size-small-padding-horizontal)}.x-table-size-small .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-small-padding-vertical)) calc(-1*var(--x-table-size-small-padding-horizontal)) calc(-1*var(--x-table-size-small-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-small-padding-horizontal))}.x-table-size-mini .x-table--cell{padding:var(--x-table-size-mini-padding-vertical) var(--x-table-size-mini-padding-horizontal)}.x-table-size-mini .x-table--th{font-size:var(--x-table-size-mini-font-header-size)}.x-table-size-mini .x-table--td{font-size:var(--x-table-size-mini-font-size)}.x-table-size-mini .x-table--footer{padding:var(--x-table-size-mini-padding-vertical) var(--x-table-size-mini-padding-horizontal)}.x-table-size-mini .x-table--tr-expand .x-table--td .x-table{margin:calc(-1*var(--x-table-size-mini-padding-vertical)) calc(-1*var(--x-table-size-mini-padding-horizontal)) calc(-1*var(--x-table-size-mini-padding-vertical) - var(--x-table-border-width)) calc(-1*var(--x-table-size-mini-padding-horizontal))}.x-table-virtualized .x-table--element{table-layout:fixed}.x-table-virtualized .x-table--body .x-table--tr{display:flex}.x-table-virtualized .x-table--body .x-table--td{display:flex;flex:1;align-items:center}.x-table-pagination{display:flex;align-items:center;flex-wrap:wrap;gap:var(--x-spacing-4);justify-content:flex-end;margin-top:var(--x-table-spacing-pagination-margin)}.x-table-pagination>*{flex:none}.x-table-pagination-left{justify-content:flex-start}.x-table-pagination-center{justify-content:center}.x-table-pagination-top{margin-top:0;margin-bottom:var(--x-table-spacing-pagination-margin)}.x-virtual-list>.x-table--element{width:auto}
|
package/dist/style/tabs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--x-tabs-color-text: var(--x-color-text-2);--x-tabs-color-text-hover: var(--x-color-text-1);--x-tabs-color-text-active: var(--x-color-primary-6);--x-tabs-color-text-disabled: var(--x-color-text-4);--x-tabs-color-border: var(--x-color-neutral-3);--x-tabs-color-bg: var(--x-color-bg-white);--x-tabs-color-fill: var(--x-color-fill-1);--x-tabs-color-fill-hover: var(--x-color-fill-2);--x-tabs-color-fill-active: var(--x-color-primary-light-1);--x-tabs-color-focus: var(--x-color-primary-6);--x-tabs-content-padding: var(--x-spacing-7);--x-tabs-border-radius: var(--x-border-radius-small);--x-tabs-transition-duration: var(--x-transition-duration-2);--x-tabs-transition-timing: var(--x-transition-timing-function-standard)}.x-tabs{position:relative;box-sizing:border-box;width:100%;color:var(--x-tabs-color-text)}.x-tabs-horizontal,.x-tabs-justify{display:flex;flex-direction:column}.x-tabs-vertical{display:flex;align-items:stretch}.x-tabs-vertical>.x-tabs--content{flex:1;min-width:0;padding-top:0}.x-tabs-right{flex-direction:row-reverse}.x-tabs-bottom>.x-tabs--content{padding-top:0;padding-bottom:var(--x-tabs-content-padding)}.x-tabs-justify{height:100%}.x-tabs-justify .x-tabs--content,.x-tabs-justify .x-tabs--content--list,.x-tabs-justify .x-tabs--pane{height:100%}.x-tabs--content{box-sizing:border-box;width:100%;padding-top:var(--x-tabs-content-padding);overflow:hidden}.x-tabs--content-hide{display:none}.x-tabs--content--list{display:flex;width:100%}.x-tabs--content--list-animation{transition:margin var(--x-tabs-transition-duration) var(--x-tabs-transition-timing)}.x-tabs--content--item{flex-shrink:0;width:100%;height:0;overflow:hidden}.x-tabs--content--item-active{height:auto;overflow:visible}.x-tabs--pane{box-sizing:border-box;width:100%}.x-tabs-type-card>.x-tabs--content,.x-tabs-type-card-gutter>.x-tabs--content{padding:var(--x-tabs-content-padding);border:1px solid var(--x-tabs-color-border);border-top:none}.x-tabs-type-card.x-tabs-bottom>.x-tabs--content,.x-tabs-type-card-gutter.x-tabs-bottom>.x-tabs--content{border-top:1px solid var(--x-tabs-color-border);border-bottom:none}.x-tabs-type-card.x-tabs-left>.x-tabs--content,.x-tabs-type-card-gutter.x-tabs-left>.x-tabs--content{border-top:1px solid var(--x-tabs-color-border);border-left:none}.x-tabs-type-card.x-tabs-right>.x-tabs--content,.x-tabs-type-card-gutter.x-tabs-right>.x-tabs--content{border-top:1px solid var(--x-tabs-color-border);border-right:none}.x-tabs--nav{position:relative;display:flex;flex-shrink:0;align-items:center;box-sizing:border-box;overflow:hidden}.x-tabs--nav::before{position:absolute;right:0;bottom:0;left:0;display:block;height:1px;background-color:var(--x-tabs-color-border);content:""}.x-tabs--nav-bottom::before{top:0;bottom:auto}.x-tabs--nav-vertical{flex-direction:column;align-items:stretch}.x-tabs--nav-vertical::before{top:0;right:0;bottom:0;left:auto;width:1px;height:auto}.x-tabs--nav-right::before{right:auto;left:0}.x-tabs--nav--tab{display:flex;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.x-tabs--nav--tab-scroll{flex:1 1 auto}.x-tabs--nav--tab--list{position:relative;display:inline-flex;flex:none;align-items:center;white-space:nowrap;transition:transform var(--x-tabs-transition-duration) var(--x-tabs-transition-timing)}.x-tabs--nav-vertical .x-tabs--nav--tab{flex-direction:column;width:100%;min-height:0}.x-tabs--nav-vertical .x-tabs--nav--tab--list{flex-direction:column;align-items:stretch;width:100%}.x-tabs--nav--extra{display:inline-flex;flex:none;align-items:center;gap:var(--x-spacing-3);min-width:0}.x-tabs--nav--add-btn{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--x-size-8);height:var(--x-size-8);color:var(--x-tabs-color-text);cursor:pointer}.x-tabs--nav--add-btn:hover{color:var(--x-tabs-color-text-active)}.x-tabs--nav-type-text::before,.x-tabs--nav-type-rounded::before,.x-tabs--nav-type-capsule::before{display:none}.x-tabs--tab{position:relative;display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;height:var(--x-tabs-tab-height);padding:0 var(--x-tabs-tab-padding-x);color:var(--x-tabs-color-text);font-size:var(--x-tabs-tab-font-size);line-height:1.5715;outline:none;cursor:pointer;transition:color var(--x-tabs-transition-duration) var(--x-transition-timing-function-linear),background-color var(--x-tabs-transition-duration) var(--x-transition-timing-function-linear),border-color var(--x-tabs-transition-duration) var(--x-transition-timing-function-linear)}.x-tabs--tab--title{display:inline-flex;align-items:center;min-width:0}.x-tabs--tab--close-btn{display:inline-flex;margin-left:var(--x-spacing-2);color:inherit;cursor:pointer}.x-tabs--tab:hover{color:var(--x-tabs-color-text-hover)}.x-tabs--tab:focus-visible{box-shadow:inset 0 0 0 2px var(--x-tabs-color-focus)}.x-tabs--tab-active,.x-tabs--tab-active:hover{color:var(--x-tabs-color-text-active);font-weight:var(--x-font-weight-500)}.x-tabs--tab-disabled,.x-tabs--tab-disabled:hover{color:var(--x-tabs-color-text-disabled);cursor:not-allowed}.x-tabs--nav-size-mini{--x-tabs-tab-height: 28px;--x-tabs-tab-font-size: var(--x-font-size-body-1);--x-tabs-tab-padding-x: var(--x-spacing-4);--x-tabs-tab-gap: var(--x-spacing-3)}.x-tabs--nav-size-small{--x-tabs-tab-height: 32px;--x-tabs-tab-font-size: var(--x-font-size-body-3);--x-tabs-tab-padding-x: var(--x-spacing-5);--x-tabs-tab-gap: var(--x-spacing-4)}.x-tabs--nav-size-medium{--x-tabs-tab-height: 36px;--x-tabs-tab-font-size: var(--x-font-size-body-3);--x-tabs-tab-padding-x: var(--x-spacing-6);--x-tabs-tab-gap: var(--x-spacing-5)}.x-tabs--nav-size-large{--x-tabs-tab-height: 44px;--x-tabs-tab-font-size: var(--x-font-size-title-1);--x-tabs-tab-padding-x: var(--x-spacing-7);--x-tabs-tab-gap: var(--x-spacing-6)}.x-tabs--nav-type-line .x-tabs--nav--tab--list{gap:var(--x-tabs-tab-gap)}.x-tabs--nav-type-line .x-tabs--nav--tab--list-no-padding .x-tabs--tab:first-child{padding-left:0}.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-type-card-gutter .x-tabs--tab{background-color:var(--x-tabs-color-bg);border:1px solid var(--x-tabs-color-border)}.x-tabs--nav-type-card .x-tabs--tab:hover,.x-tabs--nav-type-card-gutter .x-tabs--tab:hover{background-color:var(--x-tabs-color-fill-hover)}.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{background-color:var(--x-tabs-color-bg);border-bottom-color:var(--x-tabs-color-bg);z-index:1}.x-tabs--nav-type-card .x-tabs--tab-disabled,.x-tabs--nav-type-card .x-tabs--tab-disabled:hover,.x-tabs--nav-type-card-gutter .x-tabs--tab-disabled,.x-tabs--nav-type-card-gutter .x-tabs--tab-disabled:hover{background-color:var(--x-tabs-color-fill)}.x-tabs--nav-type-card .x-tabs--tab:not(:last-child){border-right:none}.x-tabs--nav-type-card .x-tabs--tab:first-child{border-top-left-radius:var(--x-tabs-border-radius)}.x-tabs--nav-type-card .x-tabs--tab:last-child{border-top-right-radius:var(--x-tabs-border-radius)}.x-tabs--nav-type-card-gutter .x-tabs--nav--tab--list{gap:var(--x-spacing-2)}.x-tabs--nav-type-card-gutter .x-tabs--tab{border-radius:var(--x-tabs-border-radius) var(--x-tabs-border-radius) 0 0}.x-tabs--nav-bottom.x-tabs--nav-type-card,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter{margin-top:-1px}.x-tabs--nav-bottom.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter .x-tabs--tab{border-radius:0 0 var(--x-tabs-border-radius) var(--x-tabs-border-radius)}.x-tabs--nav-bottom.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-bottom.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{border-top-color:var(--x-tabs-color-bg);border-bottom-color:var(--x-tabs-color-border)}.x-tabs--nav-left.x-tabs--nav-type-card,.x-tabs--nav-left.x-tabs--nav-type-card-gutter,.x-tabs--nav-right.x-tabs--nav-type-card,.x-tabs--nav-right.x-tabs--nav-type-card-gutter{height:auto}.x-tabs--nav-left.x-tabs--nav-type-card::before,.x-tabs--nav-left.x-tabs--nav-type-card-gutter::before,.x-tabs--nav-right.x-tabs--nav-type-card::before,.x-tabs--nav-right.x-tabs--nav-type-card-gutter::before{display:none}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab{width:100%;border-radius:var(--x-tabs-border-radius) 0 0 var(--x-tabs-border-radius)}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{border-right-color:var(--x-tabs-color-bg);border-bottom-color:var(--x-tabs-color-border)}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab:not(:last-child),.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:not(:last-child){border-right:1px solid var(--x-tabs-color-border);border-bottom:none}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab:first-child,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:first-child{border-radius:var(--x-tabs-border-radius) 0 0 0}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab:last-child,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:last-child{border-radius:0 0 0 var(--x-tabs-border-radius)}.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--nav--tab--list,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--nav--tab--list{gap:var(--x-spacing-2)}.x-tabs--nav-left.x-tabs--nav-type-card,.x-tabs--nav-left.x-tabs--nav-type-card-gutter{margin-right:-1px}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab.x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab.x-tabs--tab-active:hover,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab.x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab.x-tabs--tab-active:hover{border-right-color:var(--x-tabs-color-bg)}.x-tabs--nav-right.x-tabs--nav-type-card,.x-tabs--nav-right.x-tabs--nav-type-card-gutter{margin-left:-1px}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab{border-radius:0 var(--x-tabs-border-radius) var(--x-tabs-border-radius) 0}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{border-right-color:var(--x-tabs-color-border);border-left-color:var(--x-tabs-color-bg)}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:first-child{border-radius:0 var(--x-tabs-border-radius) 0 0}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:last-child{border-radius:0 0 var(--x-tabs-border-radius) 0}.x-tabs--nav-type-text .x-tabs--nav--tab--list{gap:var(--x-tabs-tab-gap)}.x-tabs--nav-type-text .x-tabs--tab{height:auto;min-height:var(--x-tabs-tab-height);padding:0}.x-tabs--nav-type-text .x-tabs--tab:not(:first-child)::before{width:1px;height:.8em;margin-right:var(--x-tabs-tab-gap);background-color:var(--x-tabs-color-border);content:""}.x-tabs--nav-type-text .x-tabs--tab--title{padding:var(--x-spacing-1) var(--x-tabs-tab-padding-x);border-radius:var(--x-tabs-border-radius)}.x-tabs--nav-type-text .x-tabs--tab:hover .x-tabs--tab--title,.x-tabs--nav-type-text .x-tabs--tab-active .x-tabs--tab--title{background-color:var(--x-tabs-color-fill-active)}.x-tabs--nav-type-rounded .x-tabs--nav--tab--list{gap:var(--x-tabs-tab-gap)}.x-tabs--nav-type-rounded .x-tabs--tab{background-color:var(--x-tabs-color-fill);border-radius:999px}.x-tabs--nav-type-rounded .x-tabs--tab:hover{background-color:var(--x-tabs-color-fill-hover)}.x-tabs--nav-type-rounded .x-tabs--tab-active,.x-tabs--nav-type-rounded .x-tabs--tab-active:hover{background-color:var(--x-tabs-color-fill-active)}.x-tabs--nav-type-capsule .x-tabs--nav--tab--list{gap:var(--x-spacing-1);padding:var(--x-spacing-1);background-color:var(--x-tabs-color-fill);border-radius:999px}.x-tabs--nav-type-capsule .x-tabs--tab{border-radius:999px}.x-tabs--nav-type-capsule .x-tabs--tab:hover{background-color:var(--x-tabs-color-fill-hover)}.x-tabs--nav-type-capsule .x-tabs--tab-active,.x-tabs--nav-type-capsule .x-tabs--tab-active:hover{background-color:var(--x-tabs-color-bg);box-shadow:var(--x-shadow-special)}.x-tabs--nav-vertical .x-tabs--tab{justify-content:flex-start;width:100%}.x-tabs--nav-vertical.x-tabs--nav-type-line .x-tabs--nav--tab--list{gap:0}.x-tabs--nav--ink{position:absolute;right:auto;bottom:0;left:0;height:2px;background-color:var(--x-tabs-color-text-active);border-radius:var(--x-border-radius-small);transition:top var(--x-tabs-transition-duration) var(--x-tabs-transition-timing),left var(--x-tabs-transition-duration) var(--x-tabs-transition-timing),width var(--x-tabs-transition-duration) var(--x-tabs-transition-timing),height var(--x-tabs-transition-duration) var(--x-tabs-transition-timing)}.x-tabs--nav--ink-disabled{background-color:var(--x-tabs-color-text-disabled)}.x-tabs--nav-vertical .x-tabs--nav--ink{top:0;right:0;bottom:auto;left:auto;width:2px;height:auto}.x-tabs--nav-right .x-tabs--nav--ink{right:auto;left:0}.x-tabs-nav-button{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--x-size-8);height:var(--x-size-8);color:var(--x-tabs-color-text);cursor:pointer;user-select:none}.x-tabs-nav-button-left{margin-right:var(--x-spacing-3);margin-left:var(--x-spacing-6)}.x-tabs-nav-button-right{margin-right:var(--x-spacing-6);margin-left:var(--x-spacing-3)}.x-tabs-nav-button-up{margin-bottom:var(--x-spacing-6)}.x-tabs-nav-button-down{margin-top:var(--x-spacing-6)}.x-tabs-nav-button:hover{color:var(--x-tabs-color-text-active)}.x-tabs-nav-button-disabled,.x-tabs-nav-button-disabled:hover{color:var(--x-tabs-color-text-disabled);cursor:not-allowed}
|
|
1
|
+
:root{--x-tabs-color-text: var(--x-color-text-2);--x-tabs-color-text-hover: var(--x-color-text-1);--x-tabs-color-text-active: var(--x-color-primary-6);--x-tabs-color-text-disabled: var(--x-color-text-4);--x-tabs-color-border: var(--x-color-neutral-3);--x-tabs-color-bg: var(--x-color-bg-white);--x-tabs-color-fill: var(--x-color-fill-1);--x-tabs-color-fill-hover: var(--x-color-fill-2);--x-tabs-color-fill-active: var(--x-color-primary-light-1);--x-tabs-color-focus: var(--x-color-primary-6);--x-tabs-content-padding: var(--x-spacing-7);--x-tabs-border-radius: var(--x-border-radius-small);--x-tabs-transition-duration: var(--x-transition-duration-2);--x-tabs-transition-timing: var(--x-transition-timing-function-standard)}.x-tabs{position:relative;box-sizing:border-box;width:100%;color:var(--x-tabs-color-text)}.x-tabs-horizontal,.x-tabs-justify{display:flex;flex-direction:column}.x-tabs-vertical{display:flex;flex-direction:row;align-items:stretch}.x-tabs-vertical>.x-tabs--content{flex:1;min-width:0;padding-top:0}.x-tabs-vertical.x-tabs-left>.x-tabs--content{padding-left:var(--x-tabs-content-padding)}.x-tabs-vertical.x-tabs-right>.x-tabs--content{padding-right:var(--x-tabs-content-padding)}.x-tabs-right{flex-direction:row-reverse}.x-tabs-bottom>.x-tabs--content{padding-top:0;padding-bottom:var(--x-tabs-content-padding)}.x-tabs-justify{height:100%}.x-tabs-justify .x-tabs--content,.x-tabs-justify .x-tabs--content--list,.x-tabs-justify .x-tabs--pane{height:100%}.x-tabs--content{box-sizing:border-box;width:100%;padding-top:var(--x-tabs-content-padding);overflow:hidden}.x-tabs--content-hide{display:none}.x-tabs--content--list{display:flex;width:100%}.x-tabs--content--list-animation{transition:margin var(--x-tabs-transition-duration) var(--x-tabs-transition-timing)}.x-tabs--content--item{flex-shrink:0;width:100%;height:0;overflow:hidden}.x-tabs--content--item-active{height:auto;overflow:visible}.x-tabs--pane{box-sizing:border-box;width:100%}.x-tabs-type-card>.x-tabs--content,.x-tabs-type-card-gutter>.x-tabs--content{padding:var(--x-tabs-content-padding);border:1px solid var(--x-tabs-color-border);border-top:none}.x-tabs-type-card.x-tabs-bottom>.x-tabs--content,.x-tabs-type-card-gutter.x-tabs-bottom>.x-tabs--content{border-top:1px solid var(--x-tabs-color-border);border-bottom:none}.x-tabs-type-card.x-tabs-left>.x-tabs--content,.x-tabs-type-card-gutter.x-tabs-left>.x-tabs--content{border-top:1px solid var(--x-tabs-color-border);border-left:none}.x-tabs-type-card.x-tabs-right>.x-tabs--content,.x-tabs-type-card-gutter.x-tabs-right>.x-tabs--content{border-top:1px solid var(--x-tabs-color-border);border-right:none}.x-tabs--nav{position:relative;display:flex;flex-shrink:0;align-items:center;box-sizing:border-box;overflow:hidden}.x-tabs--nav::before{position:absolute;right:0;bottom:0;left:0;display:block;height:1px;background-color:var(--x-tabs-color-border);content:""}.x-tabs--nav-bottom::before{top:0;bottom:auto}.x-tabs--nav-vertical{flex-direction:column;align-items:stretch}.x-tabs--nav-vertical::before{top:0;right:0;bottom:0;left:auto;width:1px;height:auto}.x-tabs--nav-right::before{right:auto;left:0}.x-tabs--nav--tab{display:flex;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.x-tabs--nav--tab-scroll{flex:1 1 auto}.x-tabs--nav--tab--list{position:relative;display:inline-flex;flex:none;align-items:center;white-space:nowrap;transition:transform var(--x-tabs-transition-duration) var(--x-tabs-transition-timing)}.x-tabs--nav-vertical .x-tabs--nav--tab{flex-direction:column;width:100%;min-height:0}.x-tabs--nav-vertical .x-tabs--nav--tab--list{flex-direction:column;align-items:stretch;width:100%}.x-tabs--nav--extra{display:inline-flex;flex:none;align-items:center;gap:var(--x-spacing-3);min-width:0}.x-tabs--nav--add-btn{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--x-size-8);height:var(--x-size-8);color:var(--x-tabs-color-text);cursor:pointer}.x-tabs--nav--add-btn:hover{color:var(--x-tabs-color-text-active)}.x-tabs--nav-type-text::before,.x-tabs--nav-type-rounded::before,.x-tabs--nav-type-capsule::before{display:none}.x-tabs--tab{position:relative;display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;height:var(--x-tabs-tab-height);padding:0 var(--x-tabs-tab-padding-x);color:var(--x-tabs-color-text);font-size:var(--x-tabs-tab-font-size);line-height:1.5715;outline:none;cursor:pointer;transition:color var(--x-tabs-transition-duration) var(--x-transition-timing-function-linear),background-color var(--x-tabs-transition-duration) var(--x-transition-timing-function-linear),border-color var(--x-tabs-transition-duration) var(--x-transition-timing-function-linear)}.x-tabs--tab--title{display:inline-flex;align-items:center;min-width:0}.x-tabs--tab--close-btn{display:inline-flex;margin-left:var(--x-spacing-2);color:inherit;cursor:pointer}.x-tabs--tab:hover{color:var(--x-tabs-color-text-hover)}.x-tabs--tab:focus-visible{box-shadow:inset 0 0 0 2px var(--x-tabs-color-focus)}.x-tabs--tab-active,.x-tabs--tab-active:hover{color:var(--x-tabs-color-text-active);font-weight:var(--x-font-weight-500)}.x-tabs--tab-disabled,.x-tabs--tab-disabled:hover{color:var(--x-tabs-color-text-disabled);cursor:not-allowed}.x-tabs--nav-size-mini{--x-tabs-tab-height: 28px;--x-tabs-tab-font-size: var(--x-font-size-body-1);--x-tabs-tab-padding-x: var(--x-spacing-4);--x-tabs-tab-gap: var(--x-spacing-3)}.x-tabs--nav-size-small{--x-tabs-tab-height: 32px;--x-tabs-tab-font-size: var(--x-font-size-body-3);--x-tabs-tab-padding-x: var(--x-spacing-5);--x-tabs-tab-gap: var(--x-spacing-4)}.x-tabs--nav-size-medium{--x-tabs-tab-height: 36px;--x-tabs-tab-font-size: var(--x-font-size-body-3);--x-tabs-tab-padding-x: var(--x-spacing-6);--x-tabs-tab-gap: var(--x-spacing-5)}.x-tabs--nav-size-large{--x-tabs-tab-height: 44px;--x-tabs-tab-font-size: var(--x-font-size-title-1);--x-tabs-tab-padding-x: var(--x-spacing-7);--x-tabs-tab-gap: var(--x-spacing-6)}.x-tabs--nav-type-line .x-tabs--nav--tab--list{gap:var(--x-tabs-tab-gap)}.x-tabs--nav-type-line .x-tabs--nav--tab--list-no-padding .x-tabs--tab:first-child{padding-left:0}.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-type-card-gutter .x-tabs--tab{background-color:var(--x-tabs-color-bg);border:1px solid var(--x-tabs-color-border)}.x-tabs--nav-type-card .x-tabs--tab:hover,.x-tabs--nav-type-card-gutter .x-tabs--tab:hover{background-color:var(--x-tabs-color-fill-hover)}.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{background-color:var(--x-tabs-color-bg);border-bottom-color:var(--x-tabs-color-bg);z-index:1}.x-tabs--nav-type-card .x-tabs--tab-disabled,.x-tabs--nav-type-card .x-tabs--tab-disabled:hover,.x-tabs--nav-type-card-gutter .x-tabs--tab-disabled,.x-tabs--nav-type-card-gutter .x-tabs--tab-disabled:hover{background-color:var(--x-tabs-color-fill)}.x-tabs--nav-type-card .x-tabs--tab:not(:last-child){border-right:none}.x-tabs--nav-type-card .x-tabs--tab:first-child{border-top-left-radius:var(--x-tabs-border-radius)}.x-tabs--nav-type-card .x-tabs--tab:last-child{border-top-right-radius:var(--x-tabs-border-radius)}.x-tabs--nav-type-card-gutter .x-tabs--nav--tab--list{gap:var(--x-spacing-2)}.x-tabs--nav-type-card-gutter .x-tabs--tab{border-radius:var(--x-tabs-border-radius) var(--x-tabs-border-radius) 0 0}.x-tabs--nav-bottom .x-tabs--nav--ink{top:0;bottom:auto}.x-tabs--nav-bottom.x-tabs--nav-type-card,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter{margin-top:-1px}.x-tabs--nav-bottom.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter .x-tabs--tab{border-radius:0 0 var(--x-tabs-border-radius) var(--x-tabs-border-radius)}.x-tabs--nav-bottom.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-bottom.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-bottom.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{border-top-color:var(--x-tabs-color-bg);border-bottom-color:var(--x-tabs-color-border)}.x-tabs--nav-left.x-tabs--nav-type-card,.x-tabs--nav-left.x-tabs--nav-type-card-gutter,.x-tabs--nav-right.x-tabs--nav-type-card,.x-tabs--nav-right.x-tabs--nav-type-card-gutter{height:auto}.x-tabs--nav-left.x-tabs--nav-type-card::before,.x-tabs--nav-left.x-tabs--nav-type-card-gutter::before,.x-tabs--nav-right.x-tabs--nav-type-card::before,.x-tabs--nav-right.x-tabs--nav-type-card-gutter::before{display:none}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab{width:100%;border-radius:var(--x-tabs-border-radius) 0 0 var(--x-tabs-border-radius)}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{border-right-color:var(--x-tabs-color-bg);border-bottom-color:var(--x-tabs-color-border)}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab:not(:last-child),.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:not(:last-child){border-right:1px solid var(--x-tabs-color-border);border-bottom:none}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab:first-child,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:first-child{border-radius:var(--x-tabs-border-radius) 0 0 0}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab:last-child,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:last-child{border-radius:0 0 0 var(--x-tabs-border-radius)}.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--nav--tab--list,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--nav--tab--list{gap:var(--x-spacing-2)}.x-tabs--nav-left.x-tabs--nav-type-card,.x-tabs--nav-left.x-tabs--nav-type-card-gutter{margin-right:-1px}.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab.x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card .x-tabs--tab.x-tabs--tab-active:hover,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab.x-tabs--tab-active,.x-tabs--nav-left.x-tabs--nav-type-card-gutter .x-tabs--tab.x-tabs--tab-active:hover{border-right-color:var(--x-tabs-color-bg)}.x-tabs--nav-right.x-tabs--nav-type-card,.x-tabs--nav-right.x-tabs--nav-type-card-gutter{margin-left:-1px}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab{border-radius:0 var(--x-tabs-border-radius) var(--x-tabs-border-radius) 0}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab-active:hover,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active,.x-tabs--nav-right.x-tabs--nav-type-card-gutter .x-tabs--tab-active:hover{border-right-color:var(--x-tabs-color-border);border-left-color:var(--x-tabs-color-bg)}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:first-child{border-radius:0 var(--x-tabs-border-radius) 0 0}.x-tabs--nav-right.x-tabs--nav-type-card .x-tabs--tab:last-child{border-radius:0 0 var(--x-tabs-border-radius) 0}.x-tabs--nav-type-text .x-tabs--nav--tab--list{gap:var(--x-tabs-tab-gap)}.x-tabs--nav-type-text .x-tabs--tab{height:auto;min-height:var(--x-tabs-tab-height);padding:0}.x-tabs--nav-type-text .x-tabs--tab:not(:first-child)::before{width:1px;height:.8em;margin-right:var(--x-tabs-tab-gap);background-color:var(--x-tabs-color-border);content:""}.x-tabs--nav-type-text .x-tabs--tab--title{padding:var(--x-spacing-1) var(--x-tabs-tab-padding-x);border-radius:var(--x-tabs-border-radius)}.x-tabs--nav-type-text .x-tabs--tab:hover .x-tabs--tab--title,.x-tabs--nav-type-text .x-tabs--tab-active .x-tabs--tab--title{background-color:var(--x-tabs-color-fill-active)}.x-tabs--nav-type-rounded .x-tabs--nav--tab--list{gap:var(--x-tabs-tab-gap)}.x-tabs--nav-type-rounded .x-tabs--tab{background-color:var(--x-tabs-color-fill);border-radius:999px}.x-tabs--nav-type-rounded .x-tabs--tab:hover{background-color:var(--x-tabs-color-fill-hover)}.x-tabs--nav-type-rounded .x-tabs--tab-active,.x-tabs--nav-type-rounded .x-tabs--tab-active:hover{background-color:var(--x-tabs-color-fill-active)}.x-tabs--nav-type-capsule .x-tabs--nav--tab--list{gap:var(--x-spacing-1);padding:var(--x-spacing-1);background-color:var(--x-tabs-color-fill);border-radius:999px}.x-tabs--nav-type-capsule .x-tabs--tab{border-radius:999px}.x-tabs--nav-type-capsule .x-tabs--tab:hover{background-color:var(--x-tabs-color-fill-hover)}.x-tabs--nav-type-capsule .x-tabs--tab-active,.x-tabs--nav-type-capsule .x-tabs--tab-active:hover{background-color:var(--x-tabs-color-bg);box-shadow:var(--x-shadow-special)}.x-tabs--nav-vertical .x-tabs--tab{justify-content:flex-start;width:100%}.x-tabs--nav-vertical.x-tabs--nav-type-line .x-tabs--nav--tab--list{gap:0}.x-tabs--nav-vertical.x-tabs--nav-type-line .x-tabs--tab{padding:0 var(--x-spacing-8);margin-top:var(--x-spacing-6)}.x-tabs--nav-vertical.x-tabs--nav-type-line .x-tabs--tab:first-of-type{margin-top:0}.x-tabs--nav-vertical .x-tabs--nav--tab-list-overflow-scroll{padding:var(--x-spacing-3) 0}.x-tabs--nav-vertical .x-tabs--nav--add-btn{height:auto;padding:0 var(--x-spacing-7);margin-top:var(--x-spacing-6)}.x-tabs--nav--ink{position:absolute;right:auto;bottom:0;left:0;height:2px;background-color:var(--x-tabs-color-text-active);border-radius:var(--x-border-radius-small);transition:top var(--x-tabs-transition-duration) var(--x-tabs-transition-timing),left var(--x-tabs-transition-duration) var(--x-tabs-transition-timing),width var(--x-tabs-transition-duration) var(--x-tabs-transition-timing),height var(--x-tabs-transition-duration) var(--x-tabs-transition-timing)}.x-tabs--nav--ink-disabled{background-color:var(--x-tabs-color-text-disabled)}.x-tabs--nav-vertical .x-tabs--nav--ink{top:0;right:0;bottom:auto;left:auto;width:2px;height:auto}.x-tabs--nav-right .x-tabs--nav--ink{right:auto;left:0}.x-tabs-nav-button{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--x-size-8);height:var(--x-size-8);color:var(--x-tabs-color-text);cursor:pointer;user-select:none}.x-tabs-nav-button-left{margin-right:var(--x-spacing-3);margin-left:var(--x-spacing-6)}.x-tabs-nav-button-right{margin-right:var(--x-spacing-6);margin-left:var(--x-spacing-3)}.x-tabs-nav-button-up{margin-bottom:var(--x-spacing-6)}.x-tabs-nav-button-down{margin-top:var(--x-spacing-6)}.x-tabs-nav-button:hover{color:var(--x-tabs-color-text-active)}.x-tabs-nav-button-disabled,.x-tabs-nav-button-disabled:hover{color:var(--x-tabs-color-text-disabled);cursor:not-allowed}
|
package/dist/style/tag.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-tag{display:inline-flex;align-items:center;box-sizing:border-box;height:24px;padding:4px 8px;color:var(--x-tag-color-text-default);font-weight:500;font-size:12px;line-height:14px;vertical-align:middle;border:1px solid var(--x-color-transparent);border-radius:2px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.x-tag .x-icon-hover.x-icon-hover::before{width:14px;height:14px}.x-tag .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-bg-default-hover)}.x-tag-selectable{cursor:pointer;transition:all .3s linear}.x-tag-selectable:hover{background-color:var(--x-tag-color-bg-default-hover);border-color:var(--x-tag-color-border-default-hover)}.x-tag-checked{background-color:var(--x-tag-color-bg-default)}.x-tag-bordered{border-color:var(--x-tag-color-border-default-bordered)}.x-tag-size-small{height:20px;font-size:12px;line-height:18px}.x-tag-size-medium{height:24px;font-size:12px;line-height:22px}.x-tag-size-large{height:28px;font-size:14px;line-height:26px}.x-tag-hide{display:none}.x-tag-loading{cursor:default;opacity:.8}.x-tag-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-tag-color-red{color:var(--x-tag-color-red-text);background-color:var(--x-tag-color-red-bg);border:1px solid var(--x-tag-color-red-border)}.x-tag-color-red .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-red-icon-bg_hover)}.x-tag-color-red.x-tag-bordered{border-color:var(--x-tag-color-red-text)}.x-tag-color-red.x-tag-selectable:hover{background-color:var(--x-tag-color-red-border-hover);border-color:var(--x-tag-color-red-text)}.x-tag-color-red .x-tag--close-icon:hover{color:var(--x-tag-color-red-text)}.x-tag-color-orangered{color:var(--x-tag-color-orangered-text);background-color:var(--x-tag-color-orangered-bg);border:1px solid var(--x-tag-color-orangered-border)}.x-tag-color-orangered .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-orangered-icon-bg_hover)}.x-tag-color-orangered.x-tag-bordered{border-color:var(--x-tag-color-orangered-text)}.x-tag-color-orangered.x-tag-selectable:hover{background-color:var(--x-tag-color-orangered-border-hover);border-color:var(--x-tag-color-orangered-text)}.x-tag-color-orangered .x-tag--close-icon:hover{color:var(--x-tag-color-orangered-text)}.x-tag-color-orange{color:var(--x-tag-color-orange-text);background-color:var(--x-tag-color-orange-bg);border:1px solid var(--x-tag-color-orange-border)}.x-tag-color-orange .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-orange-icon-bg_hover)}.x-tag-color-orange.x-tag-bordered{border-color:var(--x-tag-color-orange-text)}.x-tag-color-orange.x-tag-selectable:hover{background-color:var(--x-tag-color-orange-border-hover);border-color:var(--x-tag-color-orange-text)}.x-tag-color-orange .x-tag--close-icon:hover{color:var(--x-tag-color-orange-text)}.x-tag-color-gold{color:var(--x-tag-color-gold-text);background-color:var(--x-tag-color-gold-bg);border:1px solid var(--x-tag-color-gold-border)}.x-tag-color-gold .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-gold-icon-bg_hover)}.x-tag-color-gold.x-tag-bordered{border-color:var(--x-tag-color-gold-text)}.x-tag-color-gold.x-tag-selectable:hover{background-color:var(--x-tag-color-gold-border-hover);border-color:var(--x-tag-color-gold-text)}.x-tag-color-gold .x-tag--close-icon:hover{color:var(--x-tag-color-gold-text)}.x-tag-color-lime{color:var(--x-tag-color-lime-text);background-color:var(--x-tag-color-lime-bg);border:1px solid var(--x-tag-color-lime-border)}.x-tag-color-lime .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-lime-icon-bg_hover)}.x-tag-color-lime.x-tag-bordered{border-color:var(--x-tag-color-lime-text)}.x-tag-color-lime.x-tag-selectable:hover{background-color:var(--x-tag-color-lime-border-hover);border-color:var(--x-tag-color-lime-text)}.x-tag-color-lime .x-tag--close-icon:hover{color:var(--x-tag-color-lime-text)}.x-tag-color-green{color:var(--x-tag-color-green-text);background-color:var(--x-tag-color-green-bg);border:1px solid var(--x-tag-color-green-border)}.x-tag-color-green .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-green-icon-bg_hover)}.x-tag-color-green.x-tag-bordered{border-color:var(--x-tag-color-green-text)}.x-tag-color-green.x-tag-selectable:hover{background-color:var(--x-tag-color-green-border-hover);border-color:var(--x-tag-color-green-text)}.x-tag-color-green .x-tag--close-icon:hover{color:var(--x-tag-color-green-text)}.x-tag-color-cyan{color:var(--x-tag-color-cyan-text);background-color:var(--x-tag-color-cyan-bg);border:1px solid var(--x-tag-color-cyan-border)}.x-tag-color-cyan .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-cyan-icon-bg_hover)}.x-tag-color-cyan.x-tag-bordered{border-color:var(--x-tag-color-cyan-text)}.x-tag-color-cyan.x-tag-selectable:hover{background-color:var(--x-tag-color-cyan-border-hover);border-color:var(--x-tag-color-cyan-text)}.x-tag-color-cyan .x-tag--close-icon:hover{color:var(--x-tag-color-cyan-text)}.x-tag-color-better-blue{color:var(--x-tag-color-better-blue-text);background-color:var(--x-tag-color-better-blue-bg);border:1px solid var(--x-tag-color-better-blue-border)}.x-tag-color-better-blue .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-better-blue-icon-bg_hover)}.x-tag-color-better-blue.x-tag-bordered{border-color:var(--x-tag-color-better-blue-text)}.x-tag-color-better-blue.x-tag-selectable:hover{background-color:var(--x-tag-color-better-blue-border-hover);border-color:var(--x-tag-color-better-blue-text)}.x-tag-color-better-blue .x-tag--close-icon:hover{color:var(--x-tag-color-better-blue-text)}.x-tag-color-blue{color:var(--x-tag-color-blue-text);background-color:var(--x-tag-color-blue-bg);border:1px solid var(--x-tag-color-blue-border)}.x-tag-color-blue .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-blue-icon-bg_hover)}.x-tag-color-blue.x-tag-bordered{border-color:var(--x-tag-color-blue-text)}.x-tag-color-blue.x-tag-selectable:hover{background-color:var(--x-tag-color-blue-border-hover);border-color:var(--x-tag-color-blue-text)}.x-tag-color-blue .x-tag--close-icon:hover{color:var(--x-tag-color-blue-text)}.x-tag-color-purple{color:var(--x-tag-color-purple-text);background-color:var(--x-tag-color-purple-bg);border:1px solid var(--x-tag-color-purple-border)}.x-tag-color-purple .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-purple-icon-bg_hover)}.x-tag-color-purple.x-tag-bordered{border-color:var(--x-tag-color-purple-text)}.x-tag-color-purple.x-tag-selectable:hover{background-color:var(--x-tag-color-purple-border-hover);border-color:var(--x-tag-color-purple-text)}.x-tag-color-purple .x-tag--close-icon:hover{color:var(--x-tag-color-purple-text)}.x-tag-color-pink-purple{color:var(--x-tag-color-pink-purple-text);background-color:var(--x-tag-color-pink-purple-bg);border:1px solid var(--x-tag-color-pink-purple-border)}.x-tag-color-pink-purple .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-pink-purple-icon-bg_hover)}.x-tag-color-pink-purple.x-tag-bordered{border-color:var(--x-tag-color-pink-purple-text)}.x-tag-color-pink-purple.x-tag-selectable:hover{background-color:var(--x-tag-color-pink-purple-border-hover);border-color:var(--x-tag-color-pink-purple-text)}.x-tag-color-pink-purple .x-tag--close-icon:hover{color:var(--x-tag-color-pink-purple-text)}.x-tag-color-magenta{color:var(--x-tag-color-magenta-text);background-color:var(--x-tag-color-magenta-bg);border:1px solid var(--x-tag-color-magenta-border)}.x-tag-color-magenta .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-magenta-icon-bg_hover)}.x-tag-color-magenta.x-tag-bordered{border-color:var(--x-tag-color-magenta-text)}.x-tag-color-magenta.x-tag-selectable:hover{background-color:var(--x-tag-color-magenta-border-hover);border-color:var(--x-tag-color-magenta-text)}.x-tag-color-magenta .x-tag--close-icon:hover{color:var(--x-tag-color-magenta-text)}.x-tag-color-gray{color:var(--x-tag-color-gray-text);background-color:var(--x-tag-color-gray-bg);border:1px solid var(--x-tag-color-gray-border)}.x-tag-color-gray .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-gray-icon-bg_hover)}.x-tag-color-gray.x-tag-bordered{border-color:var(--x-tag-color-gray-text)}.x-tag-color-gray.x-tag-selectable:hover{background-color:var(--x-tag-color-gray-border-hover);border-color:var(--x-tag-color-gray-text)}.x-tag-color-gray .x-tag--close-icon:hover{color:var(--x-tag-color-gray-text)}.x-tag-custom-color{color:var(--x-tag-custom-color-text)}.x-tag-custom-color .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-custom-color-icon-bg_hover)}.x-tag-custom-color .x-tag--close-icon:hover{color:var(--x-tag-custom-color-text)}.x-tag--close-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:14px;height:14px;margin-left:4px;font-size:12px;line-height:1;border-radius:50%;cursor:pointer;transition:all .2s ease-in-out}.x-tag--close-icon>.x-icon,.x-tag--close-icon>svg{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1}.x-tag--close-icon>svg{position:relative}.x-tag--icon{margin-right:6px;color:currentcolor}.x-tag--loading-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:14px;height:14px;margin-left:4px;font-size:12px;line-height:1}.x-tag--loading-icon>.x-icon,.x-tag--loading-icon>svg{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1}
|
|
1
|
+
.x-tag{display:inline-flex;align-items:center;box-sizing:border-box;height:24px;padding:4px 8px;color:var(--x-tag-color-text-default);font-weight:500;font-size:12px;line-height:14px;vertical-align:middle;border:1px solid var(--x-color-transparent);border-radius:2px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.x-tag .x-icon-hover.x-icon-hover::before{width:14px;height:14px}.x-tag .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-bg-default-hover)}.x-tag-selectable{cursor:pointer;transition:all .3s linear}.x-tag-selectable:hover{background-color:var(--x-tag-color-bg-default-hover);border-color:var(--x-tag-color-border-default-hover)}.x-tag-checked{background-color:var(--x-tag-color-bg-default)}.x-tag-bordered{border-color:var(--x-tag-color-border-default-bordered)}.x-tag-size-small{height:20px;font-size:12px;line-height:18px}.x-tag-size-medium{height:24px;font-size:12px;line-height:22px}.x-tag-size-large{height:28px;font-size:14px;line-height:26px}.x-tag-hide{display:none}.x-tag-loading{cursor:default}.x-tag-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-tag-color-red.x-tag-checked{color:var(--x-tag-color-red-text);background-color:var(--x-tag-color-red-bg);border:1px solid var(--x-tag-color-red-border)}.x-tag-color-red.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-red-icon-bg_hover)}.x-tag-color-red.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-red-text)}.x-tag-color-red.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-red-border-hover);border-color:var(--x-tag-color-red-text)}.x-tag-color-red.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-red-text)}.x-tag-color-orangered.x-tag-checked{color:var(--x-tag-color-orangered-text);background-color:var(--x-tag-color-orangered-bg);border:1px solid var(--x-tag-color-orangered-border)}.x-tag-color-orangered.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-orangered-icon-bg_hover)}.x-tag-color-orangered.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-orangered-text)}.x-tag-color-orangered.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-orangered-border-hover);border-color:var(--x-tag-color-orangered-text)}.x-tag-color-orangered.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-orangered-text)}.x-tag-color-orange.x-tag-checked{color:var(--x-tag-color-orange-text);background-color:var(--x-tag-color-orange-bg);border:1px solid var(--x-tag-color-orange-border)}.x-tag-color-orange.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-orange-icon-bg_hover)}.x-tag-color-orange.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-orange-text)}.x-tag-color-orange.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-orange-border-hover);border-color:var(--x-tag-color-orange-text)}.x-tag-color-orange.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-orange-text)}.x-tag-color-gold.x-tag-checked{color:var(--x-tag-color-gold-text);background-color:var(--x-tag-color-gold-bg);border:1px solid var(--x-tag-color-gold-border)}.x-tag-color-gold.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-gold-icon-bg_hover)}.x-tag-color-gold.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-gold-text)}.x-tag-color-gold.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-gold-border-hover);border-color:var(--x-tag-color-gold-text)}.x-tag-color-gold.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-gold-text)}.x-tag-color-lime.x-tag-checked{color:var(--x-tag-color-lime-text);background-color:var(--x-tag-color-lime-bg);border:1px solid var(--x-tag-color-lime-border)}.x-tag-color-lime.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-lime-icon-bg_hover)}.x-tag-color-lime.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-lime-text)}.x-tag-color-lime.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-lime-border-hover);border-color:var(--x-tag-color-lime-text)}.x-tag-color-lime.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-lime-text)}.x-tag-color-green.x-tag-checked{color:var(--x-tag-color-green-text);background-color:var(--x-tag-color-green-bg);border:1px solid var(--x-tag-color-green-border)}.x-tag-color-green.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-green-icon-bg_hover)}.x-tag-color-green.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-green-text)}.x-tag-color-green.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-green-border-hover);border-color:var(--x-tag-color-green-text)}.x-tag-color-green.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-green-text)}.x-tag-color-cyan.x-tag-checked{color:var(--x-tag-color-cyan-text);background-color:var(--x-tag-color-cyan-bg);border:1px solid var(--x-tag-color-cyan-border)}.x-tag-color-cyan.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-cyan-icon-bg_hover)}.x-tag-color-cyan.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-cyan-text)}.x-tag-color-cyan.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-cyan-border-hover);border-color:var(--x-tag-color-cyan-text)}.x-tag-color-cyan.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-cyan-text)}.x-tag-color-better-blue.x-tag-checked{color:var(--x-tag-color-better-blue-text);background-color:var(--x-tag-color-better-blue-bg);border:1px solid var(--x-tag-color-better-blue-border)}.x-tag-color-better-blue.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-better-blue-icon-bg_hover)}.x-tag-color-better-blue.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-better-blue-text)}.x-tag-color-better-blue.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-better-blue-border-hover);border-color:var(--x-tag-color-better-blue-text)}.x-tag-color-better-blue.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-better-blue-text)}.x-tag-color-blue.x-tag-checked{color:var(--x-tag-color-blue-text);background-color:var(--x-tag-color-blue-bg);border:1px solid var(--x-tag-color-blue-border)}.x-tag-color-blue.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-blue-icon-bg_hover)}.x-tag-color-blue.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-blue-text)}.x-tag-color-blue.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-blue-border-hover);border-color:var(--x-tag-color-blue-text)}.x-tag-color-blue.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-blue-text)}.x-tag-color-purple.x-tag-checked{color:var(--x-tag-color-purple-text);background-color:var(--x-tag-color-purple-bg);border:1px solid var(--x-tag-color-purple-border)}.x-tag-color-purple.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-purple-icon-bg_hover)}.x-tag-color-purple.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-purple-text)}.x-tag-color-purple.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-purple-border-hover);border-color:var(--x-tag-color-purple-text)}.x-tag-color-purple.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-purple-text)}.x-tag-color-pink-purple.x-tag-checked{color:var(--x-tag-color-pink-purple-text);background-color:var(--x-tag-color-pink-purple-bg);border:1px solid var(--x-tag-color-pink-purple-border)}.x-tag-color-pink-purple.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-pink-purple-icon-bg_hover)}.x-tag-color-pink-purple.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-pink-purple-text)}.x-tag-color-pink-purple.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-pink-purple-border-hover);border-color:var(--x-tag-color-pink-purple-text)}.x-tag-color-pink-purple.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-pink-purple-text)}.x-tag-color-magenta.x-tag-checked{color:var(--x-tag-color-magenta-text);background-color:var(--x-tag-color-magenta-bg);border:1px solid var(--x-tag-color-magenta-border)}.x-tag-color-magenta.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-magenta-icon-bg_hover)}.x-tag-color-magenta.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-magenta-text)}.x-tag-color-magenta.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-magenta-border-hover);border-color:var(--x-tag-color-magenta-text)}.x-tag-color-magenta.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-magenta-text)}.x-tag-color-gray.x-tag-checked{color:var(--x-tag-color-gray-text);background-color:var(--x-tag-color-gray-bg);border:1px solid var(--x-tag-color-gray-border)}.x-tag-color-gray.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-color-gray-icon-bg_hover)}.x-tag-color-gray.x-tag-checked.x-tag-bordered{border-color:var(--x-tag-color-gray-text)}.x-tag-color-gray.x-tag-checked.x-tag-selectable:hover{background-color:var(--x-tag-color-gray-border-hover);border-color:var(--x-tag-color-gray-text)}.x-tag-color-gray.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-color-gray-text)}.x-tag-custom-color.x-tag-checked{color:var(--x-tag-custom-color-text)}.x-tag-custom-color.x-tag-checked .x-icon-hover.x-icon-hover:hover::before{background-color:var(--x-tag-custom-color-icon-bg_hover)}.x-tag-custom-color.x-tag-checked .x-tag--close-icon:hover{color:var(--x-tag-custom-color-text)}.x-tag--close-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:14px;height:14px;margin-left:4px;font-size:12px;line-height:1;border-radius:50%;cursor:pointer;transition:all .2s ease-in-out}.x-tag--close-icon>.x-icon,.x-tag--close-icon>svg{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1}.x-tag--close-icon>svg{position:relative}.x-tag--icon{margin-right:6px;color:currentcolor}.x-tag--loading-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:14px;height:14px;margin-left:4px;font-size:12px;line-height:1}.x-tag--loading-icon>.x-icon,.x-tag--loading-icon>svg{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--x-time-picker-panel-bg: var(--x-color-bg-popup);--x-time-picker-panel-border: var(--x-color-transparent);--x-time-picker-column-border: var(--x-color-transparent);--x-time-picker-footer-border: var(--x-split-color);--x-time-picker-panel-radius: var(--x-border-radius-medium);--x-time-picker-panel-shadow: var(--x-picker-panel-shadow);--x-time-picker-
|
|
1
|
+
:root{--x-time-picker-panel-bg: var(--x-color-bg-popup);--x-time-picker-panel-border: var(--x-color-transparent);--x-time-picker-column-border: var(--x-color-transparent);--x-time-picker-footer-border: var(--x-split-color);--x-time-picker-panel-radius: var(--x-border-radius-medium);--x-time-picker-panel-shadow: var(--x-picker-panel-shadow);--x-time-picker-column-width: 60px;--x-time-picker-column-count: 3;--x-time-picker-range-column-count: 3;--x-time-picker-column-height: 196px;--x-time-picker-cell-height: 26px;--x-time-picker-cell-padding: 0 6px;--x-time-picker-cell-color: var(--x-color-text-2);--x-time-picker-cell-color-hover: var(--x-color-text-1);--x-time-picker-cell-bg-hover: var(--x-color-fill-1);--x-time-picker-cell-bg-selected: var(--x-color-primary-light-1);--x-time-picker-cell-color-selected: var(--x-color-primary-text);--x-time-picker-cell-color-disabled: var(--x-color-text-4);--x-time-picker-confirm-color: var(--x-color-primary-text);--x-time-picker-confirm-bg-hover: var(--x-color-primary-light-1);--x-time-picker-font-size: var(--x-font-size-body-3);--x-time-picker-action-font-size: var(--x-font-size-body-3);--x-time-picker-now-color: var(--x-color-text-3);--x-time-picker-column-scrollbar-thumb-bg: var(--x-picker-column-scrollbar-thumb-bg)}.x-time-picker{width:194px}.x-time-picker-range{width:252px}.x-time-picker--popup{line-height:var(--x-line-height-base)}.x-time-picker--panel{width:calc(var(--x-time-picker-column-width)*var(--x-time-picker-column-count, 3));overflow:hidden;color:var(--x-time-picker-cell-color);font-size:var(--x-time-picker-font-size);background:var(--x-time-picker-panel-bg);border:1px solid var(--x-time-picker-panel-border);border-radius:var(--x-time-picker-panel-radius);box-shadow:var(--x-time-picker-panel-shadow)}.x-time-picker--range-panel{width:calc(var(--x-time-picker-column-width)*var(--x-time-picker-range-column-count, 3)*2);min-width:calc(var(--x-time-picker-column-width)*var(--x-time-picker-range-column-count, 3)*2);overflow:hidden;color:var(--x-time-picker-cell-color);font-size:var(--x-time-picker-font-size);background:var(--x-time-picker-panel-bg);border:1px solid var(--x-time-picker-panel-border);border-radius:var(--x-time-picker-panel-radius);box-shadow:var(--x-time-picker-panel-shadow)}.x-time-picker--range-panel .x-time-picker--panel{width:auto;border:none;border-radius:0;box-shadow:none}.x-time-picker--range-body{display:flex;align-items:stretch;background:var(--x-time-picker-panel-bg)}.x-time-picker--range-section{flex:0 0 auto;min-width:0;border-right:1px solid var(--x-time-picker-column-border)}.x-time-picker--range-section:last-child{border-right:none}.x-time-picker--range-section.x-time-picker-is-active .x-time-picker--range-header{background:var(--x-time-picker-cell-bg-selected)}.x-time-picker--range-section.x-time-picker-is-active .x-time-picker--range-header span,.x-time-picker--range-section.x-time-picker-is-active .x-time-picker--range-header strong{color:var(--x-time-picker-cell-color-selected)}.x-time-picker--range-header{display:flex;flex-direction:column;gap:4px;align-items:flex-start;min-width:0;padding:9px 12px;color:var(--x-color-text-3);background:var(--x-time-picker-panel-bg)}.x-time-picker--range-header span{font-size:var(--x-font-size-body-1)}.x-time-picker--range-header strong{color:var(--x-color-text-1);font-size:var(--x-time-picker-font-size);font-weight:500}.x-time-picker--columns{display:flex;align-items:stretch;background:var(--x-time-picker-panel-bg)}.x-time-picker--column{box-sizing:border-box;width:var(--x-time-picker-column-width);height:var(--x-time-picker-column-height);padding:6px 0;overflow:hidden;border-right:none;outline:none}.x-time-picker--column:last-child{border-right:none}.x-time-picker--column:focus-visible{outline:2px solid var(--x-color-primary-text);outline-offset:-2px}.x-time-picker--column-scrollbar{height:100%}.x-time-picker--column-scrollbar .x-scrollbar--container{height:100%}.x-time-picker--column-scrollbar .x-scrollbar--thumb-direction-vertical .x-scrollbar--thumb--bar{width:6px;background-color:var(--x-time-picker-column-scrollbar-thumb-bg)}.x-time-picker--column-list{box-sizing:border-box;min-height:100%;padding:2px 0 4px}.x-time-picker--cell{display:flex;align-items:center;justify-content:center;width:calc(100% - 20px);height:var(--x-time-picker-cell-height);margin:1px 10px;padding:var(--x-time-picker-cell-padding);color:var(--x-time-picker-cell-color);font:inherit;font-size:var(--x-time-picker-font-size);background:var(--x-color-transparent);border:none;border-radius:2px;cursor:pointer;transition:color var(--x-transition-duration-1) var(--x-transition-timing-function-linear),background-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-time-picker--cell:hover,.x-time-picker--cell:focus-visible{color:var(--x-time-picker-cell-color-hover);background:var(--x-time-picker-cell-bg-hover);outline:none}.x-time-picker--cell.x-time-picker-is-selected{color:var(--x-time-picker-cell-color-selected);font-weight:400;background:var(--x-time-picker-cell-bg-selected)}.x-time-picker--cell.x-time-picker-is-disabled,.x-time-picker--cell:disabled{color:var(--x-time-picker-cell-color-disabled);background:var(--x-color-transparent);cursor:not-allowed}.x-time-picker--footer{display:flex;align-items:center;justify-content:space-between;min-height:36px;padding:4px 8px;background:var(--x-time-picker-panel-bg);border-top:1px solid var(--x-time-picker-footer-border)}.x-time-picker--footer .x-button{--x-button-mini-height: 22px;--x-button-mini-font-size: var(--x-time-picker-action-font-size);--x-button-border-radius: 3px;--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent);--x-button-font-weight: 400;min-width:28px;line-height:1}.x-time-picker--footer .x-button::before{display:none}.x-time-picker--footer .x-button:not(.x-button-is-disabled):not(:disabled):hover{--x-button-background-color: var(--x-color-fill-1)}.x-time-picker--footer-left{display:inline-flex;flex:1;gap:8px;align-items:center;min-width:0}.x-time-picker--extra{flex:1;min-width:0;color:var(--x-color-text-3);font-size:var(--x-font-size-body-1)}.x-time-picker--now{color:var(--x-time-picker-now-color);font-size:var(--x-time-picker-action-font-size)}.x-time-picker--confirm{color:var(--x-time-picker-confirm-color);font-size:var(--x-time-picker-action-font-size)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-time-range-selector{--x-time-range-selector-color: var( --x-time-range-selector-color-default, var(--x-color-primary-6) );--x-time-range-selector-grid-height: 64px;--x-time-range-selector-grid-border: var( --x-time-range-selector-grid-border-default, var(--x-color-border-subtle) );--x-time-range-selector-grid-radius: var(--x-border-radius-medium);--x-time-range-selector-grid-shadow: var( --x-time-range-selector-grid-shadow-default, var(--x-shadow-none) );--x-time-range-selector-track-inset-block: 16px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-default, var(--x-color-fill-2) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-default, var(--x-color-border-subtle) );--x-time-range-selector-track-radius: 0;--x-time-range-selector-track-shadow: var( --x-time-range-selector-track-shadow-default, var(--x-shadow-none) );--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-default, var(--x-color-bg-white) );--x-time-range-selector-range-top: 12px;--x-time-range-selector-range-height: 40px;--x-time-range-selector-range-radius: var(--x-border-radius-medium);--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-default, var(--x-time-range-selector-color) );--x-time-range-selector-range-border: var( --x-time-range-selector-range-border-default, var(--x-time-range-selector-color) );--x-time-range-selector-range-shadow: var( --x-time-range-selector-range-shadow-default, var(--x-shadow-none) );--x-time-range-selector-range-shadow-hover: var( --x-time-range-selector-range-shadow-hover-default, var(--x-time-range-selector-range-shadow) );--x-time-range-selector-range-shadow-dragging: var( --x-time-range-selector-range-shadow-dragging-default, var(--x-time-range-selector-range-shadow-hover) );--x-time-range-selector-disabled-inset-block: var(--x-time-range-selector-track-inset-block);--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-default, var(--x-color-fill-3) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-default, var(--x-color-border-subtle) );--x-time-range-selector-disabled-shadow: var( --x-time-range-selector-disabled-shadow-default, var(--x-shadow-none) );--x-time-range-selector-disabled-radius: var(--x-border-radius-small);--x-time-range-selector-block-alternate-bg: var( --x-time-range-selector-block-alternate-bg-default, var(--x-color-transparent) );--x-time-range-selector-tick-bottom: 13px;--x-time-range-selector-tick-height: 8px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-default, var(--x-color-border-subtle) );--x-time-range-selector-edge-bg: var( --x-time-range-selector-edge-bg-default, var(--x-color-bg-surface) );--x-time-range-selector-edge-shadow: var( --x-time-range-selector-edge-shadow-default, var(--x-shadow-none) );--x-time-range-selector-edge-shadow-hover: var( --x-time-range-selector-edge-shadow-hover-default, var(--x-time-range-selector-edge-shadow) );--x-time-range-selector-label-color: var(--x-color-white);--x-time-range-selector-label-shadow: var( --x-time-range-selector-label-shadow-default, var(--x-shadow-none) );--x-time-range-selector-legend-color: var(--x-color-text-3);width:100%;container-type:inline-size}.x-time-range-selector.x-time-range-selector-is-disabled{opacity:.5}.x-time-range-selector.x-time-range-selector-is-disabled .x-time-range-selector--grid,.x-time-range-selector.x-time-range-selector-is-disabled .x-time-range-selector--range,.x-time-range-selector.x-time-range-selector-is-disabled .x-time-range-selector--edge{cursor:not-allowed}.x-time-range-selector.x-time-range-selector-is-readonly .x-time-range-selector--grid,.x-time-range-selector.x-time-range-selector-is-readonly .x-time-range-selector--range,.x-time-range-selector.x-time-range-selector-is-readonly .x-time-range-selector--edge{cursor:default}.x-time-range-selector.x-time-range-selector-is-error{--x-time-range-selector-grid-border: var(--x-color-danger-6)}.x-time-range-selector--instructions{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.x-time-range-selector--keyboard-cursor{position:absolute;inset-block:0;z-index:2;box-sizing:border-box;border:2px solid var(--x-color-primary-6);visibility:hidden;pointer-events:none}.x-time-range-selector .x-time-range-selector--grid:focus-visible .x-time-range-selector--keyboard-cursor{visibility:visible}.x-time-range-selector .x-time-range-selector--grid:focus-visible,.x-time-range-selector .x-time-range-selector--range:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.x-time-range-selector-scene-schedule{--x-time-range-selector-grid-height: 52px;--x-time-range-selector-grid-border: var( --x-time-range-selector-grid-border-schedule, var(--x-time-range-selector-grid-border) );--x-time-range-selector-grid-radius: 0;--x-time-range-selector-grid-shadow: none;--x-time-range-selector-track-inset-block: 18px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-schedule, var(--x-time-range-selector-track-bg) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-schedule, var(--x-time-range-selector-track-border) );--x-time-range-selector-track-radius: var(--x-border-radius-large);--x-time-range-selector-track-shadow: var( --x-time-range-selector-track-shadow-schedule, var(--x-time-range-selector-track-shadow) );--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-schedule, var(--x-time-range-selector-grid-bg) );--x-time-range-selector-range-top: 10px;--x-time-range-selector-range-height: 32px;--x-time-range-selector-range-radius: var(--x-border-radius-large);--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-schedule, var(--x-time-range-selector-range-bg-default, var(--x-time-range-selector-color)) );--x-time-range-selector-range-border: var( --x-time-range-selector-range-border-schedule, var(--x-time-range-selector-range-border-default, var(--x-time-range-selector-color)) );--x-time-range-selector-range-shadow: var( --x-time-range-selector-range-shadow-schedule, var(--x-time-range-selector-range-shadow-default, var(--x-shadow-none)) );--x-time-range-selector-range-shadow-hover: var( --x-time-range-selector-range-shadow-hover-schedule, var(--x-time-range-selector-range-shadow) );--x-time-range-selector-range-shadow-dragging: var( --x-time-range-selector-range-shadow-dragging-schedule, var(--x-time-range-selector-range-shadow-hover) );--x-time-range-selector-disabled-inset-block: var(--x-time-range-selector-track-inset-block);--x-time-range-selector-block-alternate-bg: var( --x-time-range-selector-block-alternate-bg-default, var(--x-color-transparent) );--x-time-range-selector-tick-bottom: 20px;--x-time-range-selector-tick-height: 5px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-schedule, var(--x-time-range-selector-tick-color) );--x-time-range-selector-edge-bg: var( --x-time-range-selector-edge-bg-schedule, var(--x-time-range-selector-edge-bg) );--x-time-range-selector-edge-shadow: var( --x-time-range-selector-edge-shadow-schedule, var(--x-time-range-selector-edge-shadow) );--x-time-range-selector-edge-shadow-hover: var( --x-time-range-selector-edge-shadow-hover-schedule, var(--x-time-range-selector-edge-shadow-hover) );--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-schedule, var(--x-time-range-selector-disabled-bg) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-schedule, var(--x-time-range-selector-disabled-border) );--x-time-range-selector-disabled-shadow: var( --x-time-range-selector-disabled-shadow-schedule, var(--x-time-range-selector-disabled-shadow) );--x-time-range-selector-disabled-radius: var(--x-border-radius-large)}.x-time-range-selector-scene-monitor{--x-time-range-selector-grid-height: 44px;--x-time-range-selector-grid-border: var( --x-time-range-selector-grid-border-monitor, var(--x-time-range-selector-grid-border) );--x-time-range-selector-grid-radius: var(--x-border-radius-small);--x-time-range-selector-grid-shadow: none;--x-time-range-selector-track-inset-block: 20px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-monitor, var(--x-time-range-selector-track-bg) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-monitor, var(--x-time-range-selector-track-border) );--x-time-range-selector-track-radius: 0;--x-time-range-selector-track-shadow: none;--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-monitor, var(--x-time-range-selector-grid-bg) );--x-time-range-selector-range-top: 8px;--x-time-range-selector-range-height: 28px;--x-time-range-selector-range-radius: var(--x-border-radius-small);--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-monitor, var(--x-time-range-selector-range-bg-default, var(--x-time-range-selector-color)) );--x-time-range-selector-disabled-inset-block: 20px;--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-monitor, var(--x-time-range-selector-disabled-bg) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-monitor, var(--x-time-range-selector-disabled-border) );--x-time-range-selector-disabled-shadow: none;--x-time-range-selector-disabled-radius: 0;--x-time-range-selector-range-border: var( --x-time-range-selector-range-border-monitor, var(--x-time-range-selector-range-border-default, var(--x-time-range-selector-color)) );--x-time-range-selector-range-shadow: var( --x-time-range-selector-range-shadow-monitor, var(--x-time-range-selector-range-shadow-default, var(--x-shadow-none)) );--x-time-range-selector-range-shadow-hover: var( --x-time-range-selector-range-shadow-hover-monitor, var(--x-time-range-selector-range-shadow) );--x-time-range-selector-range-shadow-dragging: var( --x-time-range-selector-range-shadow-dragging-monitor, var(--x-time-range-selector-range-shadow-hover) );--x-time-range-selector-block-alternate-bg: var( --x-time-range-selector-block-alternate-bg-default, var(--x-color-transparent) );--x-time-range-selector-tick-bottom: 10px;--x-time-range-selector-tick-height: 4px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-monitor, var(--x-time-range-selector-tick-color) );--x-time-range-selector-edge-bg: var( --x-time-range-selector-edge-bg-monitor, var(--x-time-range-selector-edge-bg) );--x-time-range-selector-edge-shadow: var( --x-time-range-selector-edge-shadow-monitor, var(--x-time-range-selector-edge-shadow) );--x-time-range-selector-edge-shadow-hover: var( --x-time-range-selector-edge-shadow-hover-monitor, var(--x-time-range-selector-edge-shadow-hover) );--x-time-range-selector-label-shadow: var( --x-time-range-selector-label-shadow-monitor, var(--x-time-range-selector-label-shadow) );--x-time-range-selector-legend-color: var(--x-color-text-3)}.x-time-range-selector-scene-compact{--x-time-range-selector-grid-height: 38px;--x-time-range-selector-grid-border: var(--x-color-border-subtle);--x-time-range-selector-grid-radius: var(--x-border-radius-small);--x-time-range-selector-grid-shadow: none;--x-time-range-selector-track-inset-block: 13px;--x-time-range-selector-range-top: 7px;--x-time-range-selector-range-height: 24px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-compact, var(--x-time-range-selector-track-bg) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-compact, var(--x-time-range-selector-track-border) );--x-time-range-selector-track-radius: 0;--x-time-range-selector-track-shadow: none;--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-compact, var(--x-time-range-selector-grid-bg) );--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-compact, var(--x-time-range-selector-range-bg-default, var(--x-time-range-selector-color)) );--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-compact, var(--x-time-range-selector-disabled-bg) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-compact, var(--x-time-range-selector-disabled-border) );--x-time-range-selector-disabled-radius: 0;--x-time-range-selector-tick-bottom: 8px;--x-time-range-selector-tick-height: 5px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-compact, var(--x-time-range-selector-tick-color) )}.x-time-range-selector--grid{position:relative;display:flex;height:var(--x-time-range-selector-grid-height);overflow:hidden;isolation:isolate;background:var(--x-time-range-selector-grid-bg);border:1px solid var(--x-time-range-selector-grid-border);border-radius:var(--x-time-range-selector-grid-radius);box-shadow:var(--x-time-range-selector-grid-shadow);cursor:crosshair;user-select:none}.x-time-range-selector--grid::before{position:absolute;inset:var(--x-time-range-selector-track-inset-block) 0;z-index:0;background:var(--x-time-range-selector-track-bg);border-block:1px solid var(--x-time-range-selector-track-border);border-radius:var(--x-time-range-selector-track-radius);box-shadow:var(--x-time-range-selector-track-shadow);content:"";pointer-events:none}.x-time-range-selector--grid.x-time-range-selector-is-dragging{cursor:ew-resize}.x-time-range-selector--grid--block{position:relative;z-index:1;overflow:hidden;flex:1;min-width:0;height:100%}.x-time-range-selector--grid--block.x-time-range-selector-is-alternate{background-color:var(--x-time-range-selector-block-alternate-bg)}.x-time-range-selector--grid--block::after{position:absolute;right:0;bottom:var(--x-time-range-selector-tick-bottom);width:1px;height:var(--x-time-range-selector-tick-height);background-color:var(--x-time-range-selector-tick-color);content:""}.x-time-range-selector--grid--block:last-child::after{display:none}.x-time-range-selector--grid--block.x-time-range-selector-is-disabled{cursor:not-allowed}.x-time-range-selector--disabled-range{position:absolute;inset-block:var(--x-time-range-selector-disabled-inset-block);z-index:2;box-sizing:border-box;background:var(--x-time-range-selector-disabled-bg);border:1px solid var(--x-time-range-selector-disabled-border);border-radius:var(--x-time-range-selector-disabled-radius);box-shadow:var(--x-time-range-selector-disabled-shadow);pointer-events:none}.x-time-range-selector--disabled-range::before,.x-time-range-selector--disabled-range::after{position:absolute;top:0;bottom:0;width:1px;background:var(--x-time-range-selector-disabled-border);content:""}.x-time-range-selector--disabled-range::before{left:-1px}.x-time-range-selector--disabled-range::after{right:-1px}.x-time-range-selector--range{position:absolute;top:var(--x-time-range-selector-range-top);z-index:3;box-sizing:border-box;height:var(--x-time-range-selector-range-height);background:var(--x-time-range-selector-range-bg);border:1px solid var(--x-time-range-selector-range-border);border-radius:var(--x-time-range-selector-range-radius);box-shadow:var(--x-time-range-selector-range-shadow);cursor:grab;transition:filter var(--x-transition-duration-2) var(--x-transition-timing-function-standard),box-shadow var(--x-transition-duration-2) var(--x-transition-timing-function-standard);user-select:none}.x-time-range-selector--range:hover{filter:brightness(1.04);box-shadow:var(--x-time-range-selector-range-shadow-hover)}.x-time-range-selector--range.x-time-range-selector-is-dragging{z-index:4;filter:brightness(1.08);box-shadow:var(--x-time-range-selector-range-shadow-dragging);cursor:grabbing}.x-time-range-selector--edge{position:absolute;top:0;z-index:5;box-sizing:border-box;width:12px;height:100%;cursor:ew-resize}.x-time-range-selector--edge::after{position:absolute;top:8px;bottom:8px;left:50%;width:5px;background-color:var(--x-time-range-selector-edge-bg);border-radius:var(--x-border-radius-small);box-shadow:var(--x-time-range-selector-edge-shadow);transform:translateX(-50%);transition:background-color var(--x-transition-duration-2) var(--x-transition-timing-function-standard),box-shadow var(--x-transition-duration-2) var(--x-transition-timing-function-standard);content:""}.x-time-range-selector--edge:hover::after{background-color:var(--x-time-range-selector-edge-bg-hover, var(--x-color-bg-surface));box-shadow:var(--x-time-range-selector-edge-shadow-hover)}.x-time-range-selector-edge-left{left:-6px}.x-time-range-selector-edge-right{right:-6px}.x-time-range-selector--range-label{position:absolute;top:50%;left:50%;width:calc(100% - 16px);overflow:hidden;color:var(--x-time-range-selector-label-color);font-size:var(--x-font-size-body-1);line-height:1;text-align:center;text-overflow:ellipsis;text-shadow:var(--x-time-range-selector-label-shadow);white-space:nowrap;transform:translate(-50%, -50%);pointer-events:none}.x-time-range-selector--legend{display:flex;justify-content:space-between;margin-top:var(--x-spacing-2)}.x-time-range-selector--legend--num{width:12px;color:var(--x-time-range-selector-legend-color);font-size:var(--x-font-size-body-1);line-height:1;text-align:center}@container (max-width: 420px){.x-time-range-selector .x-time-range-selector--legend--num:not(:nth-child(6n+1)){display:none}}
|
|
1
|
+
.x-time-range-selector{--x-time-range-selector-color: var( --x-time-range-selector-color-default, var(--x-color-primary-6) );--x-time-range-selector-grid-height: 64px;--x-time-range-selector-grid-border: var( --x-time-range-selector-grid-border-default, var(--x-color-border-subtle) );--x-time-range-selector-grid-radius: var(--x-border-radius-medium);--x-time-range-selector-grid-shadow: var( --x-time-range-selector-grid-shadow-default, var(--x-shadow-none) );--x-time-range-selector-track-inset-block: 16px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-default, var(--x-color-fill-2) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-default, var(--x-color-border-subtle) );--x-time-range-selector-track-radius: 0;--x-time-range-selector-track-shadow: var( --x-time-range-selector-track-shadow-default, var(--x-shadow-none) );--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-default, var(--x-color-bg-white) );--x-time-range-selector-range-top: 12px;--x-time-range-selector-range-height: 40px;--x-time-range-selector-range-radius: var(--x-border-radius-medium);--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-default, var(--x-time-range-selector-color) );--x-time-range-selector-range-border: var( --x-time-range-selector-range-border-default, var(--x-time-range-selector-color) );--x-time-range-selector-range-shadow: var( --x-time-range-selector-range-shadow-default, var(--x-shadow-none) );--x-time-range-selector-range-shadow-hover: var( --x-time-range-selector-range-shadow-hover-default, var(--x-time-range-selector-range-shadow) );--x-time-range-selector-range-shadow-dragging: var( --x-time-range-selector-range-shadow-dragging-default, var(--x-time-range-selector-range-shadow-hover) );--x-time-range-selector-disabled-inset-block: var(--x-time-range-selector-track-inset-block);--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-default, var(--x-color-fill-3) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-default, var(--x-color-border-subtle) );--x-time-range-selector-disabled-shadow: var( --x-time-range-selector-disabled-shadow-default, var(--x-shadow-none) );--x-time-range-selector-disabled-radius: var(--x-border-radius-small);--x-time-range-selector-block-alternate-bg: var( --x-time-range-selector-block-alternate-bg-default, var(--x-color-transparent) );--x-time-range-selector-tick-bottom: 13px;--x-time-range-selector-tick-height: 8px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-default, var(--x-color-border-subtle) );--x-time-range-selector-edge-bg: var( --x-time-range-selector-edge-bg-default, var(--x-color-bg-surface) );--x-time-range-selector-edge-shadow: var( --x-time-range-selector-edge-shadow-default, var(--x-shadow-none) );--x-time-range-selector-edge-shadow-hover: var( --x-time-range-selector-edge-shadow-hover-default, var(--x-time-range-selector-edge-shadow) );--x-time-range-selector-label-color: var(--x-color-white);--x-time-range-selector-label-shadow: var( --x-time-range-selector-label-shadow-default, var(--x-shadow-none) );--x-time-range-selector-legend-color: var(--x-color-text-3);width:100%;container-type:inline-size}.x-time-range-selector.x-time-range-selector-is-disabled{opacity:.5}.x-time-range-selector.x-time-range-selector-is-disabled .x-time-range-selector--grid,.x-time-range-selector.x-time-range-selector-is-disabled .x-time-range-selector--range,.x-time-range-selector.x-time-range-selector-is-disabled .x-time-range-selector--edge{cursor:not-allowed}.x-time-range-selector.x-time-range-selector-is-readonly .x-time-range-selector--grid,.x-time-range-selector.x-time-range-selector-is-readonly .x-time-range-selector--range,.x-time-range-selector.x-time-range-selector-is-readonly .x-time-range-selector--edge{cursor:default}.x-time-range-selector.x-time-range-selector-is-error{--x-time-range-selector-grid-border: var(--x-color-danger-6)}.x-time-range-selector--instructions{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.x-time-range-selector--keyboard-cursor{position:absolute;inset-block:0;z-index:2;box-sizing:border-box;border:2px solid var(--x-color-primary-6);visibility:hidden;pointer-events:none}.x-time-range-selector .x-time-range-selector--grid:focus-visible .x-time-range-selector--keyboard-cursor{visibility:visible}.x-time-range-selector .x-time-range-selector--grid:focus-visible,.x-time-range-selector .x-time-range-selector--range:focus-visible{outline:2px solid var(--x-color-primary-text);outline-offset:-2px}.x-time-range-selector-scene-schedule{--x-time-range-selector-grid-height: 52px;--x-time-range-selector-grid-border: var( --x-time-range-selector-grid-border-schedule, var(--x-time-range-selector-grid-border) );--x-time-range-selector-grid-radius: 0;--x-time-range-selector-grid-shadow: none;--x-time-range-selector-track-inset-block: 18px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-schedule, var(--x-time-range-selector-track-bg) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-schedule, var(--x-time-range-selector-track-border) );--x-time-range-selector-track-radius: var(--x-border-radius-large);--x-time-range-selector-track-shadow: var( --x-time-range-selector-track-shadow-schedule, var(--x-time-range-selector-track-shadow) );--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-schedule, var(--x-time-range-selector-grid-bg) );--x-time-range-selector-range-top: 10px;--x-time-range-selector-range-height: 32px;--x-time-range-selector-range-radius: var(--x-border-radius-large);--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-schedule, var(--x-time-range-selector-range-bg-default, var(--x-time-range-selector-color)) );--x-time-range-selector-range-border: var( --x-time-range-selector-range-border-schedule, var(--x-time-range-selector-range-border-default, var(--x-time-range-selector-color)) );--x-time-range-selector-range-shadow: var( --x-time-range-selector-range-shadow-schedule, var(--x-time-range-selector-range-shadow-default, var(--x-shadow-none)) );--x-time-range-selector-range-shadow-hover: var( --x-time-range-selector-range-shadow-hover-schedule, var(--x-time-range-selector-range-shadow) );--x-time-range-selector-range-shadow-dragging: var( --x-time-range-selector-range-shadow-dragging-schedule, var(--x-time-range-selector-range-shadow-hover) );--x-time-range-selector-disabled-inset-block: var(--x-time-range-selector-track-inset-block);--x-time-range-selector-block-alternate-bg: var( --x-time-range-selector-block-alternate-bg-default, var(--x-color-transparent) );--x-time-range-selector-tick-bottom: 20px;--x-time-range-selector-tick-height: 5px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-schedule, var(--x-time-range-selector-tick-color) );--x-time-range-selector-edge-bg: var( --x-time-range-selector-edge-bg-schedule, var(--x-time-range-selector-edge-bg) );--x-time-range-selector-edge-shadow: var( --x-time-range-selector-edge-shadow-schedule, var(--x-time-range-selector-edge-shadow) );--x-time-range-selector-edge-shadow-hover: var( --x-time-range-selector-edge-shadow-hover-schedule, var(--x-time-range-selector-edge-shadow-hover) );--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-schedule, var(--x-time-range-selector-disabled-bg) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-schedule, var(--x-time-range-selector-disabled-border) );--x-time-range-selector-disabled-shadow: var( --x-time-range-selector-disabled-shadow-schedule, var(--x-time-range-selector-disabled-shadow) );--x-time-range-selector-disabled-radius: var(--x-border-radius-large)}.x-time-range-selector-scene-monitor{--x-time-range-selector-grid-height: 44px;--x-time-range-selector-grid-border: var( --x-time-range-selector-grid-border-monitor, var(--x-time-range-selector-grid-border) );--x-time-range-selector-grid-radius: var(--x-border-radius-small);--x-time-range-selector-grid-shadow: none;--x-time-range-selector-track-inset-block: 20px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-monitor, var(--x-time-range-selector-track-bg) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-monitor, var(--x-time-range-selector-track-border) );--x-time-range-selector-track-radius: 0;--x-time-range-selector-track-shadow: none;--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-monitor, var(--x-time-range-selector-grid-bg) );--x-time-range-selector-range-top: 8px;--x-time-range-selector-range-height: 28px;--x-time-range-selector-range-radius: var(--x-border-radius-small);--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-monitor, var(--x-time-range-selector-range-bg-default, var(--x-time-range-selector-color)) );--x-time-range-selector-disabled-inset-block: 20px;--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-monitor, var(--x-time-range-selector-disabled-bg) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-monitor, var(--x-time-range-selector-disabled-border) );--x-time-range-selector-disabled-shadow: none;--x-time-range-selector-disabled-radius: 0;--x-time-range-selector-range-border: var( --x-time-range-selector-range-border-monitor, var(--x-time-range-selector-range-border-default, var(--x-time-range-selector-color)) );--x-time-range-selector-range-shadow: var( --x-time-range-selector-range-shadow-monitor, var(--x-time-range-selector-range-shadow-default, var(--x-shadow-none)) );--x-time-range-selector-range-shadow-hover: var( --x-time-range-selector-range-shadow-hover-monitor, var(--x-time-range-selector-range-shadow) );--x-time-range-selector-range-shadow-dragging: var( --x-time-range-selector-range-shadow-dragging-monitor, var(--x-time-range-selector-range-shadow-hover) );--x-time-range-selector-block-alternate-bg: var( --x-time-range-selector-block-alternate-bg-default, var(--x-color-transparent) );--x-time-range-selector-tick-bottom: 10px;--x-time-range-selector-tick-height: 4px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-monitor, var(--x-time-range-selector-tick-color) );--x-time-range-selector-edge-bg: var( --x-time-range-selector-edge-bg-monitor, var(--x-time-range-selector-edge-bg) );--x-time-range-selector-edge-shadow: var( --x-time-range-selector-edge-shadow-monitor, var(--x-time-range-selector-edge-shadow) );--x-time-range-selector-edge-shadow-hover: var( --x-time-range-selector-edge-shadow-hover-monitor, var(--x-time-range-selector-edge-shadow-hover) );--x-time-range-selector-label-shadow: var( --x-time-range-selector-label-shadow-monitor, var(--x-time-range-selector-label-shadow) );--x-time-range-selector-legend-color: var(--x-color-text-3)}.x-time-range-selector-scene-compact{--x-time-range-selector-grid-height: 38px;--x-time-range-selector-grid-border: var(--x-color-border-subtle);--x-time-range-selector-grid-radius: var(--x-border-radius-small);--x-time-range-selector-grid-shadow: none;--x-time-range-selector-track-inset-block: 13px;--x-time-range-selector-range-top: 7px;--x-time-range-selector-range-height: 24px;--x-time-range-selector-track-bg: var( --x-time-range-selector-track-bg-compact, var(--x-time-range-selector-track-bg) );--x-time-range-selector-track-border: var( --x-time-range-selector-track-border-compact, var(--x-time-range-selector-track-border) );--x-time-range-selector-track-radius: 0;--x-time-range-selector-track-shadow: none;--x-time-range-selector-grid-bg: var( --x-time-range-selector-grid-bg-compact, var(--x-time-range-selector-grid-bg) );--x-time-range-selector-range-bg: var( --x-time-range-selector-range-bg-compact, var(--x-time-range-selector-range-bg-default, var(--x-time-range-selector-color)) );--x-time-range-selector-disabled-bg: var( --x-time-range-selector-disabled-bg-compact, var(--x-time-range-selector-disabled-bg) );--x-time-range-selector-disabled-border: var( --x-time-range-selector-disabled-border-compact, var(--x-time-range-selector-disabled-border) );--x-time-range-selector-disabled-radius: 0;--x-time-range-selector-tick-bottom: 8px;--x-time-range-selector-tick-height: 5px;--x-time-range-selector-tick-color: var( --x-time-range-selector-tick-color-compact, var(--x-time-range-selector-tick-color) )}.x-time-range-selector--grid{position:relative;display:flex;height:var(--x-time-range-selector-grid-height);overflow:hidden;isolation:isolate;background:var(--x-time-range-selector-grid-bg);border:1px solid var(--x-time-range-selector-grid-border);border-radius:var(--x-time-range-selector-grid-radius);box-shadow:var(--x-time-range-selector-grid-shadow);cursor:crosshair;user-select:none}.x-time-range-selector--grid::before{position:absolute;inset:var(--x-time-range-selector-track-inset-block) 0;z-index:0;background:var(--x-time-range-selector-track-bg);border-block:1px solid var(--x-time-range-selector-track-border);border-radius:var(--x-time-range-selector-track-radius);box-shadow:var(--x-time-range-selector-track-shadow);content:"";pointer-events:none}.x-time-range-selector--grid.x-time-range-selector-is-dragging{cursor:ew-resize}.x-time-range-selector--grid--block{position:relative;z-index:1;overflow:hidden;flex:1;min-width:0;height:100%}.x-time-range-selector--grid--block.x-time-range-selector-is-alternate{background-color:var(--x-time-range-selector-block-alternate-bg)}.x-time-range-selector--grid--block::after{position:absolute;right:0;bottom:var(--x-time-range-selector-tick-bottom);width:1px;height:var(--x-time-range-selector-tick-height);background-color:var(--x-time-range-selector-tick-color);content:""}.x-time-range-selector--grid--block:last-child::after{display:none}.x-time-range-selector--grid--block.x-time-range-selector-is-disabled{cursor:not-allowed}.x-time-range-selector--disabled-range{position:absolute;inset-block:var(--x-time-range-selector-disabled-inset-block);z-index:2;box-sizing:border-box;background:var(--x-time-range-selector-disabled-bg);border:1px solid var(--x-time-range-selector-disabled-border);border-radius:var(--x-time-range-selector-disabled-radius);box-shadow:var(--x-time-range-selector-disabled-shadow);pointer-events:none}.x-time-range-selector--disabled-range::before,.x-time-range-selector--disabled-range::after{position:absolute;top:0;bottom:0;width:1px;background:var(--x-time-range-selector-disabled-border);content:""}.x-time-range-selector--disabled-range::before{left:-1px}.x-time-range-selector--disabled-range::after{right:-1px}.x-time-range-selector--range{position:absolute;top:var(--x-time-range-selector-range-top);z-index:3;box-sizing:border-box;height:var(--x-time-range-selector-range-height);background:var(--x-time-range-selector-range-bg);border:1px solid var(--x-time-range-selector-range-border);border-radius:var(--x-time-range-selector-range-radius);box-shadow:var(--x-time-range-selector-range-shadow);cursor:grab;transition:filter var(--x-transition-duration-2) var(--x-transition-timing-function-standard),box-shadow var(--x-transition-duration-2) var(--x-transition-timing-function-standard);user-select:none}.x-time-range-selector--range:hover{filter:brightness(1.04);box-shadow:var(--x-time-range-selector-range-shadow-hover)}.x-time-range-selector--range.x-time-range-selector-is-dragging{z-index:4;filter:brightness(1.08);box-shadow:var(--x-time-range-selector-range-shadow-dragging);cursor:grabbing}.x-time-range-selector--edge{position:absolute;top:0;z-index:5;box-sizing:border-box;width:12px;height:100%;cursor:ew-resize}.x-time-range-selector--edge::after{position:absolute;top:8px;bottom:8px;left:50%;width:5px;background-color:var(--x-time-range-selector-edge-bg);border-radius:var(--x-border-radius-small);box-shadow:var(--x-time-range-selector-edge-shadow);transform:translateX(-50%);transition:background-color var(--x-transition-duration-2) var(--x-transition-timing-function-standard),box-shadow var(--x-transition-duration-2) var(--x-transition-timing-function-standard);content:""}.x-time-range-selector--edge:hover::after{background-color:var(--x-time-range-selector-edge-bg-hover, var(--x-color-bg-surface));box-shadow:var(--x-time-range-selector-edge-shadow-hover)}.x-time-range-selector-edge-left{left:-6px}.x-time-range-selector-edge-right{right:-6px}.x-time-range-selector--range-label{position:absolute;top:50%;left:50%;width:calc(100% - 16px);overflow:hidden;color:var(--x-time-range-selector-label-color);font-size:var(--x-font-size-body-1);line-height:1;text-align:center;text-overflow:ellipsis;text-shadow:var(--x-time-range-selector-label-shadow);white-space:nowrap;transform:translate(-50%, -50%);pointer-events:none}.x-time-range-selector--legend{display:flex;justify-content:space-between;margin-top:var(--x-spacing-2)}.x-time-range-selector--legend--num{width:12px;color:var(--x-time-range-selector-legend-color);font-size:var(--x-font-size-body-1);line-height:1;text-align:center}@container (max-width: 420px){.x-time-range-selector .x-time-range-selector--legend--num:not(:nth-child(6n+1)){display:none}}
|