x-next 1.12.0 → 1.14.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_CODING.md +6 -5
- package/AI_USAGE/catalog.md +106 -105
- package/AI_USAGE/components/alert-api.md +48 -0
- package/AI_USAGE/components/alert.md +222 -3
- package/AI_USAGE/components/bar-chart-api.md +177 -0
- package/AI_USAGE/components/bar-chart.md +297 -3
- package/AI_USAGE/components/boxicons.md +147 -0
- package/AI_USAGE/components/button-api.md +144 -0
- package/AI_USAGE/components/button.md +447 -3
- package/AI_USAGE/components/charts.md +81 -0
- package/AI_USAGE/components/checkbox-api.md +145 -0
- package/AI_USAGE/components/checkbox.md +365 -3
- package/AI_USAGE/components/color-picker-api.md +52 -0
- package/AI_USAGE/components/color-picker.md +211 -3
- package/AI_USAGE/components/config-provider-api.md +38 -0
- package/AI_USAGE/components/config-provider.md +250 -3
- package/AI_USAGE/components/date-picker-api.md +1114 -0
- package/AI_USAGE/components/date-picker.md +378 -3
- package/AI_USAGE/components/dialog-api.md +142 -0
- package/AI_USAGE/components/dialog.md +284 -3
- package/AI_USAGE/components/draggable-api.md +146 -0
- package/AI_USAGE/components/draggable.md +259 -0
- package/AI_USAGE/components/drawer-api.md +78 -0
- package/AI_USAGE/components/drawer.md +227 -0
- package/AI_USAGE/components/dropdown-api.md +529 -0
- package/AI_USAGE/components/dropdown.md +392 -3
- package/AI_USAGE/components/empty-api.md +36 -0
- package/AI_USAGE/components/empty.md +227 -3
- package/AI_USAGE/components/finicon.md +88 -0
- package/AI_USAGE/components/form-api.md +524 -0
- package/AI_USAGE/components/form.md +454 -0
- package/AI_USAGE/components/grid-api.md +527 -0
- package/AI_USAGE/components/grid.md +224 -0
- package/AI_USAGE/components/heatmap-api.md +122 -0
- package/AI_USAGE/components/heatmap.md +220 -0
- package/AI_USAGE/components/icon-api.md +4707 -0
- package/AI_USAGE/components/icon.md +257 -0
- package/AI_USAGE/components/image-api.md +440 -0
- package/AI_USAGE/components/image.md +465 -0
- package/AI_USAGE/components/input-api.md +184 -0
- package/AI_USAGE/components/input-number-api.md +66 -0
- package/AI_USAGE/components/input-number.md +294 -0
- package/AI_USAGE/components/input-tag-api.md +114 -0
- package/AI_USAGE/components/input-tag.md +482 -0
- package/AI_USAGE/components/input.md +293 -3
- package/AI_USAGE/components/layout-api.md +147 -0
- package/AI_USAGE/components/layout.md +230 -0
- package/AI_USAGE/components/line-chart-api.md +197 -0
- package/AI_USAGE/components/line-chart.md +279 -3
- package/AI_USAGE/components/link-api.md +42 -0
- package/AI_USAGE/components/link.md +197 -0
- package/AI_USAGE/components/menu-api.md +516 -0
- package/AI_USAGE/components/menu.md +268 -0
- package/AI_USAGE/components/message-api.md +215 -0
- package/AI_USAGE/components/message-box-api.md +108 -0
- package/AI_USAGE/components/message-box.md +268 -3
- package/AI_USAGE/components/message.md +231 -3
- package/AI_USAGE/components/network-api.md +91 -0
- package/AI_USAGE/components/network.md +378 -0
- package/AI_USAGE/components/notification-api.md +236 -0
- package/AI_USAGE/components/notification.md +275 -3
- package/AI_USAGE/components/pagination-api.md +62 -0
- package/AI_USAGE/components/pagination.md +386 -5
- package/AI_USAGE/components/pie-chart-api.md +109 -0
- package/AI_USAGE/components/pie-chart.md +245 -3
- package/AI_USAGE/components/popconfirm-api.md +75 -0
- package/AI_USAGE/components/popconfirm.md +231 -3
- package/AI_USAGE/components/popover-api.md +75 -0
- package/AI_USAGE/components/popover.md +208 -3
- package/AI_USAGE/components/popup-api.md +75 -0
- package/AI_USAGE/components/popup.md +52 -0
- package/AI_USAGE/components/progress-api.md +44 -0
- package/AI_USAGE/components/progress.md +248 -3
- package/AI_USAGE/components/radio-api.md +165 -0
- package/AI_USAGE/components/radio.md +259 -3
- package/AI_USAGE/components/rate-api.md +54 -0
- package/AI_USAGE/components/rate.md +233 -3
- package/AI_USAGE/components/resize-box-api.md +56 -0
- package/AI_USAGE/components/resize-box.md +231 -0
- package/AI_USAGE/components/scrollbar-api.md +77 -0
- package/AI_USAGE/components/scrollbar.md +218 -0
- package/AI_USAGE/components/select-api.md +758 -0
- package/AI_USAGE/components/select.md +640 -3
- package/AI_USAGE/components/skeleton-api.md +85 -0
- package/AI_USAGE/components/skeleton.md +150 -0
- package/AI_USAGE/components/slider-api.md +51 -0
- package/AI_USAGE/components/slider.md +233 -3
- package/AI_USAGE/components/space-api.md +38 -0
- package/AI_USAGE/components/space.md +145 -0
- package/AI_USAGE/components/spin-api.md +43 -0
- package/AI_USAGE/components/spin.md +205 -0
- package/AI_USAGE/components/steps-api.md +111 -0
- package/AI_USAGE/components/steps.md +201 -3
- package/AI_USAGE/components/switch-api.md +58 -0
- package/AI_USAGE/components/switch.md +290 -3
- package/AI_USAGE/components/table-api.md +2919 -0
- package/AI_USAGE/components/table.md +1414 -0
- package/AI_USAGE/components/tabs-api.md +135 -0
- package/AI_USAGE/components/tabs.md +308 -3
- package/AI_USAGE/components/tag-api.md +124 -0
- package/AI_USAGE/components/tag.md +292 -0
- package/AI_USAGE/components/textarea-api.md +55 -0
- package/AI_USAGE/components/textarea.md +326 -3
- package/AI_USAGE/components/time-picker-api.md +137 -0
- package/AI_USAGE/components/time-picker.md +271 -3
- package/AI_USAGE/components/time-range-selector-api.md +44 -0
- package/AI_USAGE/components/time-range-selector.md +355 -0
- package/AI_USAGE/components/timeline-api.md +93 -0
- package/AI_USAGE/components/timeline.md +312 -0
- package/AI_USAGE/components/tooltip-api.md +77 -0
- package/AI_USAGE/components/tooltip.md +182 -0
- package/AI_USAGE/components/trend-chart-api.md +119 -0
- package/AI_USAGE/components/trend-chart.md +335 -0
- package/AI_USAGE/components/trigger-api.md +124 -0
- package/AI_USAGE/components/trigger.md +185 -0
- package/AI_USAGE/components/upload-api.md +200 -0
- package/AI_USAGE/components/upload.md +711 -3
- package/AI_USAGE/components/watermark-api.md +87 -0
- package/AI_USAGE/components/watermark.md +200 -0
- package/AI_USAGE/core.md +1 -1
- package/AI_USAGE/index.md +35 -7
- package/AI_USAGE/recipes/form-on-demand.md +1 -1
- package/AI_USAGE.md +33657 -7
- package/CHANGELOG.md +40 -0
- package/dist/_utils/inherit-component-type.d.ts +11 -0
- package/dist/components/date-picker/index.d.ts +420 -5
- package/dist/components/form-input/index.d.ts +617 -2
- package/dist/components/layout/index.d.ts +689 -1
- package/dist/components/menu/index.d.ts +786 -1
- package/dist/components/network/Network.vue.d.ts +7 -3
- package/dist/components/network/index.d.ts +10 -2
- package/dist/components/network/props.d.ts +5 -0
- package/dist/components/network/utils.d.ts +3 -3
- package/dist/components/pagination/page-item-ellipsis.vue.d.ts +4 -1
- package/dist/components/pagination/page-item-step.vue.d.ts +101 -130
- package/dist/components/pagination/page-item.vue.d.ts +1 -0
- package/dist/components/pagination/page-jumper.vue.d.ts +1 -1
- package/dist/components/pagination/page-options.vue.d.ts +6 -4
- package/dist/components/pagination/utils.d.ts +3 -0
- package/dist/components/time-range-selector/index.d.ts +6 -6
- package/dist/es/_container/resize-observer-v2.js +1 -1
- package/dist/es/_container/resize-observer.js +1 -1
- package/dist/es/_hooks/use-resize-observer.js +1 -1
- package/dist/es/_styles/palette-aliases.js +4 -4
- package/dist/es/_utils/inherit-component-type.js +6 -0
- package/dist/es/_virtual/advancedFormat.js +1 -1
- package/dist/es/_virtual/customParseFormat.js +1 -1
- package/dist/es/_virtual/dayjs.min.js +1 -1
- package/dist/es/_virtual/isBetween.js +1 -1
- package/dist/es/_virtual/quarterOfYear.js +1 -1
- package/dist/es/_virtual/weekOfYear.js +1 -1
- package/dist/es/_virtual/weekYear.js +1 -1
- package/dist/es/_virtual/zh-cn.js +1 -1
- package/dist/es/components/button/Button.js +53 -42
- package/dist/es/components/date-picker/index.js +18 -17
- package/dist/es/components/draggable/useDraggable.js +1 -1
- package/dist/es/components/form/Form.vue2.js +1 -1
- package/dist/es/components/form/FormItem.vue2.js +1 -1
- package/dist/es/components/form-input/index.js +12 -11
- package/dist/es/components/form-input-number/InputNumber.js +1 -1
- package/dist/es/components/form-slider/Slider.vue2.js +1 -1
- package/dist/es/components/form-slider/slider-ticks.vue2.js +1 -1
- package/dist/es/components/form-slider/utils.js +1 -1
- package/dist/es/components/layout/index.js +10 -9
- package/dist/es/components/menu/MenuItem.js +1 -1
- package/dist/es/components/menu/hooks/use-level.js +5 -5
- package/dist/es/components/menu/index.js +13 -10
- package/dist/es/components/menu/overflow-wrap.js +1 -1
- package/dist/es/components/network/Network.vue.js +17 -12
- package/dist/es/components/network/Network.vue2.js +78 -70
- package/dist/es/components/network/utils.js +112 -71
- package/dist/es/components/pagination/Pagination.js +132 -123
- package/dist/es/components/pagination/page-item-ellipsis.vue.js +10 -10
- package/dist/es/components/pagination/page-item-ellipsis.vue2.js +24 -19
- package/dist/es/components/pagination/page-item-step.vue.js +14 -11
- package/dist/es/components/pagination/page-item-step.vue2.js +20 -22
- package/dist/es/components/pagination/page-item.vue.js +10 -9
- package/dist/es/components/pagination/page-item.vue2.js +24 -19
- package/dist/es/components/pagination/page-jumper.vue2.js +23 -23
- package/dist/es/components/pagination/page-options.vue.js +15 -10
- package/dist/es/components/pagination/page-options.vue2.js +21 -17
- package/dist/es/components/pagination/utils.js +4 -2
- package/dist/es/components/progress/circle.vue2.js +1 -1
- package/dist/es/components/progress/line.vue2.js +1 -1
- package/dist/es/components/progress/steps.vue2.js +1 -1
- package/dist/es/components/rate/Rate.js +1 -1
- package/dist/es/components/virtual-list-v2/virtual-list-item.js +1 -1
- package/dist/es/locale/en-US.js +2 -0
- package/dist/es/locale/zh-CN.js +2 -0
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/dayjs.min.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/locale/zh-cn.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/plugin/advancedFormat.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/plugin/customParseFormat.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/plugin/isBetween.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/plugin/quarterOfYear.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/plugin/weekOfYear.js +1 -1
- package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/dayjs@1.11.21/node_modules/dayjs/plugin/weekYear.js +1 -1
- package/dist/es/style.css +1 -1
- package/dist/index.cjs +3 -3
- package/dist/index.umd.js +3 -3
- package/dist/locale/interface.d.ts +3 -0
- package/dist/style/base.css +1 -1
- package/dist/style/button.css +1 -1
- package/dist/style/form-select.css +1 -1
- package/dist/style/network.css +1 -1
- package/dist/style/pagination.css +1 -1
- package/dist/style/table.css +1 -1
- package/dist/style.css +1 -1
- package/package.json +10 -5
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/index.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/is.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/locale/en-US.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/array.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/base.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/boolean.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/custom.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/number.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/object.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/string.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/rules/type.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/b-validate@1.5.3/node_modules/b-validate/es/util.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/compute-scroll-into-view@3.1.1/node_modules/compute-scroll-into-view/dist/index.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/number-precision@1.6.0/node_modules/number-precision/build/index.es.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/scroll-into-view-if-needed@3.1.0/node_modules/scroll-into-view-if-needed/dist/index.js +0 -0
- /package/dist/es/{Users/xuyu/Code/x-next/node_modules → node_modules}/.pnpm/sortablejs@1.15.7/node_modules/sortablejs/modular/sortable.esm.js +0 -0
package/dist/style/button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--x-button-color-bg-default: var(--x-color-fill-2);--x-button-color-bg-default-hover: var(--x-color-neutral-3);--x-button-color-bg-default-active: var(--x-color-neutral-4);--x-button-color-text-default: var(--x-color-text-primary);--x-button-color-border-default: var(--x-color-border-default);--x-button-color-text-solid: var(--x-color-white);--x-button-color-text-solid-primary: var(--x-color-white);--x-button-color-text-solid-success: var(--x-color-white);--x-button-color-text-solid-warning: var(--x-color-white);--x-button-color-text-solid-strong: var(--x-color-white);--x-button-color-text-solid-danger: var(--x-color-white);--x-button-color-text-solid-info: var(--x-color-white);--x-button-color-bg-primary-subtle: var(--x-color-primary-subtle);--x-button-color-bg-primary-subtle-hover: var(--x-color-primary-subtle-hover);--x-button-color-bg-primary-subtle-active: var(--x-color-primary-subtle-active);--x-button-color-bg-primary-solid: var(--x-color-primary-solid);--x-button-color-bg-primary-solid-hover: var(--x-color-primary-solid-hover);--x-button-color-bg-primary-solid-active: var(--x-color-primary-solid-active);--x-button-color-text-primary: var(--x-color-primary-button-text);--x-button-color-border-primary: var(--x-color-primary-solid);--x-button-color-bg-success-subtle: var(--x-color-success-subtle);--x-button-color-bg-success-subtle-hover: var(--x-color-success-subtle-hover);--x-button-color-bg-success-subtle-active: var(--x-color-success-subtle-active);--x-button-color-bg-success-solid: var(--x-color-success-solid);--x-button-color-bg-success-solid-hover: var(--x-color-success-solid-hover);--x-button-color-bg-success-solid-active: var(--x-color-success-solid-active);--x-button-color-text-success: var(--x-color-success-button-text);--x-button-color-border-success: var(--x-color-success-solid);--x-button-color-bg-warning-subtle: var(--x-color-warning-subtle);--x-button-color-bg-warning-subtle-hover: var(--x-color-warning-subtle-hover);--x-button-color-bg-warning-subtle-active: var(--x-color-warning-subtle-active);--x-button-color-bg-warning-solid: var(--x-color-warning-solid);--x-button-color-bg-warning-solid-hover: var(--x-color-warning-solid-hover);--x-button-color-bg-warning-solid-active: var(--x-color-warning-solid-active);--x-button-color-text-warning: var(--x-color-warning-button-text);--x-button-color-border-warning: var(--x-color-warning-solid);--x-button-color-bg-danger-subtle: var(--x-color-danger-subtle);--x-button-color-bg-danger-subtle-hover: var(--x-color-danger-subtle-hover);--x-button-color-bg-danger-subtle-active: var(--x-color-danger-subtle-active);--x-button-color-bg-danger-solid: var(--x-color-danger-solid);--x-button-color-bg-danger-solid-hover: var(--x-color-danger-solid-hover);--x-button-color-bg-danger-solid-active: var(--x-color-danger-solid-active);--x-button-color-text-danger: var(--x-color-danger-button-text);--x-button-color-border-danger: var(--x-color-danger-solid);--x-button-color-bg-strong-subtle: var(--x-color-strong-subtle);--x-button-color-bg-strong-subtle-hover: var(--x-color-strong-subtle-hover);--x-button-color-bg-strong-subtle-active: var(--x-color-strong-subtle-active);--x-button-color-bg-strong-solid: var(--x-color-strong-solid);--x-button-color-bg-strong-solid-hover: var(--x-color-strong-solid-hover);--x-button-color-bg-strong-solid-active: var(--x-color-strong-solid-active);--x-button-color-text-strong: var(--x-color-strong-button-text);--x-button-color-border-strong: var(--x-color-strong-solid);--x-button-color-bg-info-subtle: var(--x-color-fill-2);--x-button-color-bg-info-subtle-hover: var(--x-color-neutral-3);--x-button-color-bg-info-subtle-active: var(--x-color-neutral-4);--x-button-color-bg-info-solid: var(--x-color-constant-neutral-strong);--x-button-color-bg-info-solid-hover: var(--x-color-constant-neutral-strong-hover);--x-button-color-bg-info-solid-active: var(--x-color-constant-neutral-strong-active);--x-button-color-text-info: var(--x-color-text-secondary);--x-button-color-border-info: var(--x-color-neutral-5)}.x-button{--x-button-width: auto;--x-button-font-weight: 500;--x-button-opacity: 1;--x-button-border-style: solid;--x-button-border-color: var(--x-button-color-border-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-text-color: var(--x-button-color-text-default);--x-button-padding: 0 0;--x-button-mini-height: var(--x-size-mini);--x-button-mini-font-size: 12px;--x-button-mini-padding: 0 8px;--x-button-mini-border-radius: 4px;--x-button-small-height: var(--x-size-small);--x-button-small-font-size: 13px;--x-button-small-padding: 0 10px;--x-button-small-border-radius: 4px;--x-button-medium-height: var(--x-size-medium);--x-button-medium-font-size: 14px;--x-button-medium-padding: 0 14px;--x-button-medium-border-radius: 4px;--x-button-large-height: var(--x-size-large);--x-button-large-font-size: 14px;--x-button-large-padding: 0 20px;--x-button-large-border-radius: 6px;--x-button-huge-height: var(--x-size-huge);--x-button-huge-font-size: 16px;--x-button-huge-font-weight: 400;--x-button-huge-padding: 0 28px;--x-button-huge-border-radius: 4px}.x-button{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button{position:relative;display:inline-flex;justify-content:center;align-items:center;overflow:visible;margin:0;border-style:var(--x-button-border-style);border-width:1px;border-color:var(--x-button-border-color);border-radius:var(--x-button-border-radius);padding:var(--x-button-padding);width:var(--x-button-width);height:var(--x-button-height);color:var(--x-button-text-color);font-size:var(--x-button-font-size);font-weight:var(--x-button-font-weight);line-height:var(--x-line-height-base);white-space:nowrap;background-color:var(--x-button-background-color);opacity:var(--x-button-opacity);outline:none;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),border-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear),opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear);box-sizing:border-box;appearance:none;user-select:none;vertical-align:bottom;cursor:pointer}.x-button>.x-wave{position:absolute;inset:-1px;z-index:0;border-radius:inherit;pointer-events:none;opacity:.45;box-shadow:0 0 0 0 var(--x-wave-color, currentColor);transition:box-shadow var(--x-transition-duration-4, 0.4s) var(--x-transition-timing-function-standard, ease),opacity var(--x-transition-duration-4, 0.4s) var(--x-transition-timing-function-linear, linear)}.x-button>.x-wave-active{opacity:0;box-shadow:0 0 0 6px var(--x-wave-color, currentColor)}.x-button--prefix{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;margin-right:4px}.x-button--suffix{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;margin-left:4px}.x-button--loading{position:relative;z-index:1;display:flex;flex-shrink:0;transition:width .2s ease,opacity .2s ease,margin-right .2s ease}@media(prefers-reduced-motion: reduce){.x-button--loading{transition:none}}.x-button--content{position:relative;z-index:1;display:flex}.x-button.x-button-default{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-primary{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid);--x-button-border-color: var(--x-button-color-bg-primary-solid)}.x-button-primary:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-hover);--x-button-border-color: var(--x-button-color-bg-primary-solid-hover)}.x-button-primary:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-active);--x-button-border-color: var(--x-button-color-bg-primary-solid-active)}.x-button-primary.x-button-default{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid);--x-button-border-color: var(--x-button-color-bg-primary-solid)}.x-button-primary.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-hover);--x-button-border-color: var(--x-button-color-bg-primary-solid-hover)}.x-button-primary.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-active);--x-button-border-color: var(--x-button-color-bg-primary-solid-active)}.x-button-primary.x-button-success{--x-button-text-color: var(--x-button-color-text-solid-success);--x-button-background-color: var(--x-button-color-bg-success-solid);--x-button-border-color: var(--x-button-color-bg-success-solid)}.x-button-primary.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-success);--x-button-background-color: var(--x-button-color-bg-success-solid-hover);--x-button-border-color: var(--x-button-color-bg-success-solid-hover)}.x-button-primary.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-success);--x-button-background-color: var(--x-button-color-bg-success-solid-active);--x-button-border-color: var(--x-button-color-bg-success-solid-active)}.x-button-primary.x-button-warning{--x-button-text-color: var(--x-button-color-text-solid-warning);--x-button-background-color: var(--x-button-color-bg-warning-solid);--x-button-border-color: var(--x-button-color-bg-warning-solid)}.x-button-primary.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-warning);--x-button-background-color: var(--x-button-color-bg-warning-solid-hover);--x-button-border-color: var(--x-button-color-bg-warning-solid-hover)}.x-button-primary.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-warning);--x-button-background-color: var(--x-button-color-bg-warning-solid-active);--x-button-border-color: var(--x-button-color-bg-warning-solid-active)}.x-button-primary.x-button-strong{--x-button-text-color: var(--x-button-color-text-solid-strong);--x-button-background-color: var(--x-button-color-bg-strong-solid);--x-button-border-color: var(--x-button-color-bg-strong-solid)}.x-button-primary.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-strong);--x-button-background-color: var(--x-button-color-bg-strong-solid-hover);--x-button-border-color: var(--x-button-color-bg-strong-solid-hover)}.x-button-primary.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-strong);--x-button-background-color: var(--x-button-color-bg-strong-solid-active);--x-button-border-color: var(--x-button-color-bg-strong-solid-active)}.x-button-primary.x-button-danger{--x-button-text-color: var(--x-button-color-text-solid-danger);--x-button-background-color: var(--x-button-color-bg-danger-solid);--x-button-border-color: var(--x-button-color-bg-danger-solid)}.x-button-primary.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-danger);--x-button-background-color: var(--x-button-color-bg-danger-solid-hover);--x-button-border-color: var(--x-button-color-bg-danger-solid-hover)}.x-button-primary.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-danger);--x-button-background-color: var(--x-button-color-bg-danger-solid-active);--x-button-border-color: var(--x-button-color-bg-danger-solid-active)}.x-button-primary.x-button-info{--x-button-text-color: var(--x-button-color-text-solid-info);--x-button-background-color: var(--x-button-color-bg-info-solid);--x-button-border-color: var(--x-button-color-bg-info-solid)}.x-button-primary.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-info);--x-button-background-color: var(--x-button-color-bg-info-solid-hover);--x-button-border-color: var(--x-button-color-bg-info-solid-hover)}.x-button-primary.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-solid-info);--x-button-background-color: var(--x-button-color-bg-info-solid-active);--x-button-border-color: var(--x-button-color-bg-info-solid-active)}.x-button-outline{--x-button-border-style: solid}.x-button-outline{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-default{--x-button-border-style: solid}.x-button-outline.x-button-default{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-success{--x-button-border-style: solid}.x-button-outline.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-success)}.x-button-outline.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-button-color-border-success)}.x-button-outline.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-button-color-border-success)}.x-button-outline.x-button-warning{--x-button-border-style: solid}.x-button-outline.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-outline.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-outline.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-outline.x-button-strong{--x-button-border-style: solid}.x-button-outline.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-outline.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-outline.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-outline.x-button-danger{--x-button-border-style: solid}.x-button-outline.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-outline.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-outline.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-outline.x-button-info{--x-button-border-style: solid}.x-button-outline.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-info)}.x-button-outline.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-button-color-border-info)}.x-button-outline.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-button-color-border-info)}.x-button-dashed{--x-button-border-style: dashed}.x-button-dashed{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-default{--x-button-border-style: dashed}.x-button-dashed.x-button-default{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-success{--x-button-border-style: dashed}.x-button-dashed.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-success)}.x-button-dashed.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-button-color-border-success)}.x-button-dashed.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-button-color-border-success)}.x-button-dashed.x-button-warning{--x-button-border-style: dashed}.x-button-dashed.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-dashed.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-dashed.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-dashed.x-button-strong{--x-button-border-style: dashed}.x-button-dashed.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-dashed.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-dashed.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-dashed.x-button-danger{--x-button-border-style: dashed}.x-button-dashed.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-dashed.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-dashed.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-dashed.x-button-info{--x-button-border-style: dashed}.x-button-dashed.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-info)}.x-button-dashed.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-button-color-border-info)}.x-button-dashed.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-button-color-border-info)}.x-button-text{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-default{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain{--x-button-font-weight: 500}.x-button-plain{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-default{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button-plain.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button-plain.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button-plain.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border{--x-button-font-weight: 500}.x-button-hide-border{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-default{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button-hide-border.x-button-default:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button-hide-border.x-button-default:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button-hide-border.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-success:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-success:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-warning:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-warning:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-strong:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-strong:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-danger:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-danger:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-info:not(.is-disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-info:not(.is-disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-link{--x-button-height: auto;--x-button-padding: 0;--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent);--x-button-text-color: var(--x-button-color-text-primary);min-height:0}.x-button-link:not(.is-disabled):hover{--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent);--x-button-text-color: var(--x-button-color-text-primary)}.x-button-link:not(.is-disabled):active{--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent);--x-button-text-color: var(--x-button-color-text-primary)}.x-button-is-disabled{--x-button-opacity: 0.4;cursor:not-allowed}.x-button-block{display:flex;width:100%}.x-button-loading{cursor:default}.x-button-loading-fill>.x-button--loading{position:absolute;inset:0;z-index:2;justify-content:center;align-items:center;border-radius:inherit;color:var(--x-button-text-color);background-color:var(--x-button-background-color);pointer-events:none;transition:opacity .2s ease}@media(prefers-reduced-motion: reduce){.x-button-loading-fill>.x-button--loading{transition:none}}.x-button-loading-fill.x-button-loading>.x-button--prefix,.x-button-loading-fill.x-button-loading>.x-button--content,.x-button-loading-fill.x-button-loading>.x-button--suffix{opacity:0}.x-button-narrow{--x-button-mini-padding: 0 0;--x-button-small-padding: 0 0;--x-button-medium-padding: 0 0;--x-button-large-padding: 0 0;--x-button-huge-padding: 0 0}.x-button-mini{--x-button-height: var(--x-button-mini-height);--x-button-font-size: var(--x-button-mini-font-size);--x-button-padding: var(--x-button-mini-padding);--x-button-border-radius: var(--x-button-mini-border-radius)}.x-button-small{--x-button-height: var(--x-button-small-height);--x-button-font-size: var(--x-button-small-font-size);--x-button-padding: var(--x-button-small-padding);--x-button-border-radius: var(--x-button-small-border-radius)}.x-button-medium{--x-button-height: var(--x-button-medium-height);--x-button-font-size: var(--x-button-medium-font-size);--x-button-padding: var(--x-button-medium-padding);--x-button-border-radius: var(--x-button-medium-border-radius)}.x-button-large{--x-button-height: var(--x-button-large-height);--x-button-font-size: var(--x-button-large-font-size);--x-button-padding: var(--x-button-large-padding);--x-button-border-radius: var(--x-button-large-border-radius)}.x-button-huge{--x-button-height: var(--x-button-huge-height);--x-button-font-size: var(--x-button-huge-font-size);--x-button-font-weight: var(--x-button-huge-font-weight);--x-button-padding: var(--x-button-huge-padding);--x-button-border-radius: var(--x-button-huge-border-radius)}.x-button-round{--x-button-border-radius: var(--x-button-height);height:var(--x-button-height)}.x-button-circle{--x-button-width: var(--x-button-height);--x-button-padding: 0;--x-button-border-radius: 100%;width:var(--x-button-height);height:var(--x-button-height)}.x-button-group{display:flex;width:min-content}.x-button-group>.x-button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.x-button-group>.x-button:last-child{margin-left:-1px;border-left-color:var(--x-button-group-color-separator);border-top-left-radius:0;border-bottom-left-radius:0}.x-button-group>.x-button:not(:first-child):not(:last-child){margin-left:-1px;border-left-color:var(--x-button-group-color-separator);border-radius:0}
|
|
1
|
+
:root{--x-button-color-bg-default: var(--x-color-fill-2);--x-button-color-bg-default-hover: var(--x-color-neutral-3);--x-button-color-bg-default-active: var(--x-color-neutral-4);--x-button-color-text-default: var(--x-color-text-primary);--x-button-color-border-default: var(--x-color-border-default);--x-button-color-text-solid: var(--x-color-white);--x-button-color-text-solid-primary: var(--x-color-white);--x-button-color-text-solid-success: var(--x-color-white);--x-button-color-text-solid-warning: var(--x-color-white);--x-button-color-text-solid-strong: var(--x-color-white);--x-button-color-text-solid-danger: var(--x-color-white);--x-button-color-text-solid-info: var(--x-color-white);--x-button-color-bg-primary-subtle: var(--x-color-primary-subtle);--x-button-color-bg-primary-subtle-hover: var(--x-color-primary-subtle-hover);--x-button-color-bg-primary-subtle-active: var(--x-color-primary-subtle-active);--x-button-color-bg-primary-solid: var(--x-color-primary-solid);--x-button-color-bg-primary-solid-hover: var(--x-color-primary-solid-hover);--x-button-color-bg-primary-solid-active: var(--x-color-primary-solid-active);--x-button-color-text-primary: var(--x-color-primary-button-text);--x-button-color-border-primary: var(--x-color-primary-solid);--x-button-color-bg-success-subtle: var(--x-color-success-subtle);--x-button-color-bg-success-subtle-hover: var(--x-color-success-subtle-hover);--x-button-color-bg-success-subtle-active: var(--x-color-success-subtle-active);--x-button-color-bg-success-solid: var(--x-color-success-solid);--x-button-color-bg-success-solid-hover: var(--x-color-success-solid-hover);--x-button-color-bg-success-solid-active: var(--x-color-success-solid-active);--x-button-color-text-success: var(--x-color-success-button-text);--x-button-color-border-success: var(--x-color-success-solid);--x-button-color-bg-warning-subtle: var(--x-color-warning-subtle);--x-button-color-bg-warning-subtle-hover: var(--x-color-warning-subtle-hover);--x-button-color-bg-warning-subtle-active: var(--x-color-warning-subtle-active);--x-button-color-bg-warning-solid: var(--x-color-warning-solid);--x-button-color-bg-warning-solid-hover: var(--x-color-warning-solid-hover);--x-button-color-bg-warning-solid-active: var(--x-color-warning-solid-active);--x-button-color-text-warning: var(--x-color-warning-button-text);--x-button-color-border-warning: var(--x-color-warning-solid);--x-button-color-bg-danger-subtle: var(--x-color-danger-subtle);--x-button-color-bg-danger-subtle-hover: var(--x-color-danger-subtle-hover);--x-button-color-bg-danger-subtle-active: var(--x-color-danger-subtle-active);--x-button-color-bg-danger-solid: var(--x-color-danger-solid);--x-button-color-bg-danger-solid-hover: var(--x-color-danger-solid-hover);--x-button-color-bg-danger-solid-active: var(--x-color-danger-solid-active);--x-button-color-text-danger: var(--x-color-danger-button-text);--x-button-color-border-danger: var(--x-color-danger-solid);--x-button-color-bg-strong-subtle: var(--x-color-strong-subtle);--x-button-color-bg-strong-subtle-hover: var(--x-color-strong-subtle-hover);--x-button-color-bg-strong-subtle-active: var(--x-color-strong-subtle-active);--x-button-color-bg-strong-solid: var(--x-color-strong-solid);--x-button-color-bg-strong-solid-hover: var(--x-color-strong-solid-hover);--x-button-color-bg-strong-solid-active: var(--x-color-strong-solid-active);--x-button-color-text-strong: var(--x-color-strong-button-text);--x-button-color-border-strong: var(--x-color-strong-solid);--x-button-color-bg-info-subtle: var(--x-color-fill-2);--x-button-color-bg-info-subtle-hover: var(--x-color-neutral-3);--x-button-color-bg-info-subtle-active: var(--x-color-neutral-4);--x-button-color-bg-info-solid: var(--x-color-constant-neutral-strong);--x-button-color-bg-info-solid-hover: var(--x-color-constant-neutral-strong-hover);--x-button-color-bg-info-solid-active: var(--x-color-constant-neutral-strong-active);--x-button-color-text-info: var(--x-color-text-secondary);--x-button-color-border-info: var(--x-color-neutral-5)}.x-button{--x-button-width: auto;--x-button-font-weight: 500;--x-button-opacity: 1;--x-button-border-style: solid;--x-button-border-color: var(--x-button-color-border-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-text-color: var(--x-button-color-text-default);--x-button-padding: 0 0;--x-button-mini-height: var(--x-size-mini);--x-button-mini-font-size: 12px;--x-button-mini-padding: 0 8px;--x-button-mini-border-radius: var(--x-border-radius);--x-button-small-height: var(--x-size-small);--x-button-small-font-size: 13px;--x-button-small-padding: 0 10px;--x-button-small-border-radius: var(--x-border-radius);--x-button-medium-height: var(--x-size-medium);--x-button-medium-font-size: 14px;--x-button-medium-padding: 0 14px;--x-button-medium-border-radius: var(--x-border-radius);--x-button-large-height: var(--x-size-large);--x-button-large-font-size: 14px;--x-button-large-padding: 0 20px;--x-button-large-border-radius: calc(var(--x-border-radius) + 2px);--x-button-huge-height: calc(var(--x-size-huge) - 2px);--x-button-huge-font-size: 16px;--x-button-huge-font-weight: 500;--x-button-huge-padding: 0 28px;--x-button-huge-border-radius: calc(var(--x-border-radius) + 2px)}.x-button{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button{position:relative;display:inline-flex;flex-shrink:0;justify-content:center;align-items:center;overflow:visible;margin:0;border-style:var(--x-button-border-style);border-width:1px;border-color:var(--x-button-border-color);border-radius:var(--x-button-border-radius);padding:var(--x-button-padding);width:var(--x-button-width);height:var(--x-button-height);color:var(--x-button-text-color);font-family:inherit;font-size:var(--x-button-font-size);font-weight:var(--x-button-font-weight);line-height:var(--x-line-height-base);white-space:nowrap;background-color:var(--x-button-background-color);opacity:var(--x-button-opacity);outline:none;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),border-color var(--x-transition-duration-1) var(--x-transition-timing-function-linear),opacity var(--x-transition-duration-1) var(--x-transition-timing-function-linear);box-sizing:border-box;appearance:none;user-select:none;vertical-align:bottom;cursor:pointer}.x-button:focus-visible{outline:2px solid var(--x-color-border-focus);outline-offset:2px}.x-button.x-button-mini:not(.x-button-link),.x-button.x-button-small:not(.x-button-link){line-height:1}.x-button>.x-wave{position:absolute;inset:-1px;z-index:0;border-radius:inherit;pointer-events:none;opacity:.45;box-shadow:0 0 0 0 var(--x-wave-color, currentColor);transition:box-shadow var(--x-transition-duration-4, 0.4s) var(--x-transition-timing-function-standard, ease),opacity var(--x-transition-duration-4, 0.4s) var(--x-transition-timing-function-linear, linear)}.x-button>.x-wave-active{opacity:0;box-shadow:0 0 0 6px var(--x-wave-color, currentColor)}@media(prefers-reduced-motion: reduce){.x-button{transition:none}.x-button>.x-wave{display:none}}.x-button--prefix{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;margin-right:4px}.x-button--suffix{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;margin-left:4px}.x-button--loading{position:relative;z-index:1;display:flex;flex-shrink:0;transition:width .2s ease,opacity .2s ease,margin-right .2s ease}@media(prefers-reduced-motion: reduce){.x-button--loading{transition:none}}.x-button--content{position:relative;z-index:1;display:flex;align-items:center}.x-button.x-button-empty-content>.x-button--content{display:none}.x-button.x-button-empty-content>.x-button--prefix{margin-right:0}.x-button.x-button-empty-content>.x-button--suffix{margin-left:0}.x-button.x-button-empty-content>.x-button--prefix~.x-button--prefix,.x-button.x-button-empty-content>.x-button--prefix~.x-button--suffix{margin-left:4px}.x-button.x-button-default{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-primary{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid);--x-button-border-color: var(--x-button-color-bg-primary-solid)}.x-button-primary:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-hover);--x-button-border-color: var(--x-button-color-bg-primary-solid-hover)}.x-button-primary:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-active);--x-button-border-color: var(--x-button-color-bg-primary-solid-active)}.x-button-primary.x-button-default{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid);--x-button-border-color: var(--x-button-color-bg-primary-solid)}.x-button-primary.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-hover);--x-button-border-color: var(--x-button-color-bg-primary-solid-hover)}.x-button-primary.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-primary);--x-button-background-color: var(--x-button-color-bg-primary-solid-active);--x-button-border-color: var(--x-button-color-bg-primary-solid-active)}.x-button-primary.x-button-success{--x-button-text-color: var(--x-button-color-text-solid-success);--x-button-background-color: var(--x-button-color-bg-success-solid);--x-button-border-color: var(--x-button-color-bg-success-solid)}.x-button-primary.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-success);--x-button-background-color: var(--x-button-color-bg-success-solid-hover);--x-button-border-color: var(--x-button-color-bg-success-solid-hover)}.x-button-primary.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-success);--x-button-background-color: var(--x-button-color-bg-success-solid-active);--x-button-border-color: var(--x-button-color-bg-success-solid-active)}.x-button-primary.x-button-warning{--x-button-text-color: var(--x-button-color-text-solid-warning);--x-button-background-color: var(--x-button-color-bg-warning-solid);--x-button-border-color: var(--x-button-color-bg-warning-solid)}.x-button-primary.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-warning);--x-button-background-color: var(--x-button-color-bg-warning-solid-hover);--x-button-border-color: var(--x-button-color-bg-warning-solid-hover)}.x-button-primary.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-warning);--x-button-background-color: var(--x-button-color-bg-warning-solid-active);--x-button-border-color: var(--x-button-color-bg-warning-solid-active)}.x-button-primary.x-button-strong{--x-button-text-color: var(--x-button-color-text-solid-strong);--x-button-background-color: var(--x-button-color-bg-strong-solid);--x-button-border-color: var(--x-button-color-bg-strong-solid)}.x-button-primary.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-strong);--x-button-background-color: var(--x-button-color-bg-strong-solid-hover);--x-button-border-color: var(--x-button-color-bg-strong-solid-hover)}.x-button-primary.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-strong);--x-button-background-color: var(--x-button-color-bg-strong-solid-active);--x-button-border-color: var(--x-button-color-bg-strong-solid-active)}.x-button-primary.x-button-danger{--x-button-text-color: var(--x-button-color-text-solid-danger);--x-button-background-color: var(--x-button-color-bg-danger-solid);--x-button-border-color: var(--x-button-color-bg-danger-solid)}.x-button-primary.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-danger);--x-button-background-color: var(--x-button-color-bg-danger-solid-hover);--x-button-border-color: var(--x-button-color-bg-danger-solid-hover)}.x-button-primary.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-danger);--x-button-background-color: var(--x-button-color-bg-danger-solid-active);--x-button-border-color: var(--x-button-color-bg-danger-solid-active)}.x-button-primary.x-button-info{--x-button-text-color: var(--x-button-color-text-solid-info);--x-button-background-color: var(--x-button-color-bg-info-solid);--x-button-border-color: var(--x-button-color-bg-info-solid)}.x-button-primary.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-solid-info);--x-button-background-color: var(--x-button-color-bg-info-solid-hover);--x-button-border-color: var(--x-button-color-bg-info-solid-hover)}.x-button-primary.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-solid-info);--x-button-background-color: var(--x-button-color-bg-info-solid-active);--x-button-border-color: var(--x-button-color-bg-info-solid-active)}.x-button-outline{--x-button-border-style: solid}.x-button-outline{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-default{--x-button-border-style: solid}.x-button-outline.x-button-default{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-outline.x-button-success{--x-button-border-style: solid}.x-button-outline.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-success)}.x-button-outline.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-button-color-border-success)}.x-button-outline.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-button-color-border-success)}.x-button-outline.x-button-warning{--x-button-border-style: solid}.x-button-outline.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-outline.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-outline.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-outline.x-button-strong{--x-button-border-style: solid}.x-button-outline.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-outline.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-outline.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-outline.x-button-danger{--x-button-border-style: solid}.x-button-outline.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-outline.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-outline.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-outline.x-button-info{--x-button-border-style: solid}.x-button-outline.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-info)}.x-button-outline.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-button-color-border-info)}.x-button-outline.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-button-color-border-info)}.x-button-dashed{--x-button-border-style: dashed}.x-button-dashed{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-default{--x-button-border-style: dashed}.x-button-dashed.x-button-default{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-button-color-border-primary)}.x-button-dashed.x-button-success{--x-button-border-style: dashed}.x-button-dashed.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-success)}.x-button-dashed.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-button-color-border-success)}.x-button-dashed.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-button-color-border-success)}.x-button-dashed.x-button-warning{--x-button-border-style: dashed}.x-button-dashed.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-dashed.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-dashed.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-button-color-border-warning)}.x-button-dashed.x-button-strong{--x-button-border-style: dashed}.x-button-dashed.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-dashed.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-dashed.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-button-color-border-strong)}.x-button-dashed.x-button-danger{--x-button-border-style: dashed}.x-button-dashed.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-dashed.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-dashed.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-button-color-border-danger)}.x-button-dashed.x-button-info{--x-button-border-style: dashed}.x-button-dashed.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-button-color-border-info)}.x-button-dashed.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-button-color-border-info)}.x-button-dashed.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-button-color-border-info)}.x-button-text{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-default{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-text.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain{--x-button-font-weight: 500}.x-button-plain{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-default{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button-plain.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button-plain.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button-plain.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-plain.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border{--x-button-font-weight: 500}.x-button-hide-border{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-primary);--x-button-background-color: var(--x-button-color-bg-primary-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-default{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default);--x-button-border-color: var(--x-button-color-border-default)}.x-button-hide-border.x-button-default:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-hover);--x-button-border-color: var(--x-button-color-border-default)}.x-button-hide-border.x-button-default:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-default);--x-button-background-color: var(--x-button-color-bg-default-active);--x-button-border-color: var(--x-button-color-border-default)}.x-button-hide-border.x-button-success{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-success:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-success:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-success);--x-button-background-color: var(--x-button-color-bg-success-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-warning:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-warning:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-warning);--x-button-background-color: var(--x-button-color-bg-warning-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-strong:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-strong:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-strong);--x-button-background-color: var(--x-button-color-bg-strong-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-danger:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-danger:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-danger);--x-button-background-color: var(--x-button-color-bg-danger-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-info{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-info:not(:disabled):hover{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-hover);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button-info:not(:disabled):active{--x-button-text-color: var(--x-button-color-text-info);--x-button-background-color: var(--x-button-color-bg-info-subtle-active);--x-button-border-color: var(--x-color-transparent)}.x-button-hide-border.x-button,.x-button-hide-border.x-button:not(:disabled):hover,.x-button-hide-border.x-button:not(:disabled):active{--x-button-border-color: var(--x-color-transparent)}.x-button.x-button-link{min-height:0}.x-button.x-button-link:not(.x-button-circle){--x-button-height: auto;--x-button-padding: 0}.x-button.x-button-link,.x-button.x-button-link:not(:disabled):hover,.x-button.x-button-link:not(:disabled):active{--x-button-background-color: var(--x-color-transparent);--x-button-border-color: var(--x-color-transparent);--x-button-text-color: var(--x-button-color-text-primary)}.x-button.x-button-link.x-button-success,.x-button.x-button-link:not(:disabled):hover.x-button-success,.x-button.x-button-link:not(:disabled):active.x-button-success{--x-button-text-color: var(--x-button-color-text-success)}.x-button.x-button-link.x-button-warning,.x-button.x-button-link:not(:disabled):hover.x-button-warning,.x-button.x-button-link:not(:disabled):active.x-button-warning{--x-button-text-color: var(--x-button-color-text-warning)}.x-button.x-button-link.x-button-strong,.x-button.x-button-link:not(:disabled):hover.x-button-strong,.x-button.x-button-link:not(:disabled):active.x-button-strong{--x-button-text-color: var(--x-button-color-text-strong)}.x-button.x-button-link.x-button-danger,.x-button.x-button-link:not(:disabled):hover.x-button-danger,.x-button.x-button-link:not(:disabled):active.x-button-danger{--x-button-text-color: var(--x-button-color-text-danger)}.x-button.x-button-link.x-button-info,.x-button.x-button-link:not(:disabled):hover.x-button-info,.x-button.x-button-link:not(:disabled):active.x-button-info{--x-button-text-color: var(--x-button-color-text-info)}.x-button-is-disabled{--x-button-opacity: 0.4;cursor:not-allowed}.x-button-block{display:flex;width:100%}.x-button-loading{cursor:default}.x-button-loading-fill>.x-button--loading{position:absolute;inset:0;z-index:2;justify-content:center;align-items:center;border-radius:inherit;color:var(--x-button-text-color);background-color:var(--x-button-background-color);pointer-events:none;transition:opacity .2s ease}@media(prefers-reduced-motion: reduce){.x-button-loading-fill>.x-button--loading{transition:none}}.x-button-loading-fill.x-button-loading>.x-button--prefix,.x-button-loading-fill.x-button-loading>.x-button--content,.x-button-loading-fill.x-button-loading>.x-button--suffix{opacity:0}.x-button-narrow{--x-button-mini-padding: 0 0;--x-button-small-padding: 0 0;--x-button-medium-padding: 0 0;--x-button-large-padding: 0 0;--x-button-huge-padding: 0 0}.x-button-mini{--x-button-height: var(--x-button-mini-height);--x-button-font-size: var(--x-button-mini-font-size);--x-button-padding: var(--x-button-mini-padding);--x-button-border-radius: var(--x-button-mini-border-radius)}.x-button-small{--x-button-height: var(--x-button-small-height);--x-button-font-size: var(--x-button-small-font-size);--x-button-padding: var(--x-button-small-padding);--x-button-border-radius: var(--x-button-small-border-radius)}.x-button-medium{--x-button-height: var(--x-button-medium-height);--x-button-font-size: var(--x-button-medium-font-size);--x-button-padding: var(--x-button-medium-padding);--x-button-border-radius: var(--x-button-medium-border-radius)}.x-button-large{--x-button-height: var(--x-button-large-height);--x-button-font-size: var(--x-button-large-font-size);--x-button-padding: var(--x-button-large-padding);--x-button-border-radius: var(--x-button-large-border-radius)}.x-button-huge{--x-button-height: var(--x-button-huge-height);--x-button-font-size: var(--x-button-huge-font-size);--x-button-font-weight: var(--x-button-huge-font-weight);--x-button-padding: var(--x-button-huge-padding);--x-button-border-radius: var(--x-button-huge-border-radius)}.x-button-round{--x-button-border-radius: 999px}.x-button-square{--x-button-border-radius: var(--x-border-radius-none)}.x-button.x-button-only-icon:not(.x-button-link){--x-button-width: var(--x-button-height);--x-button-padding: 0}.x-button-circle{--x-button-width: var(--x-button-height);--x-button-padding: 0;--x-button-border-radius: 100%;width:var(--x-button-height);height:var(--x-button-height)}.x-button-group{display:flex;width:min-content}.x-button-group>.x-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.x-button-group>.x-button:not(:first-child){margin-left:-1px;border-left-color:var(--x-button-group-color-separator);border-top-left-radius:0;border-bottom-left-radius:0}.x-button-group>.x-button:not(:disabled):hover{z-index:1}.x-button-group>.x-button:focus-visible{z-index:2}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--x-select-popup-max-height: var(--x-size-50);--x-select-popup-border-radius: var(--x-border-radius-medium);--x-select-popup-padding-vertical: var(--x-spacing-2);--x-select-popup-font-size: var(--x-font-size-body-3);--x-select-popup-color-bg: var(--x-color-bg-elevated);--x-select-popup-color-border: var(--x-color-transparent);--x-select-popup-box-shadow: var(--x-shadow-popover);--x-select-popup-empty-min-height: var(--x-size-14);--x-select-popup-option-height: var(--x-size-9);--x-select-popup-option-font-weight_selected: var(--x-font-weight-500);--x-select-signal-popup-option-padding-horizontal: var(--x-spacing-6);--x-select-multi-popup-option-padding-horizontal: var(--x-spacing-2);--x-select-popup-option-color-bg_default: var(--x-color-bg-elevated);--x-select-popup-option-color-bg_hover: var(--x-color-fill-2);--x-select-popup-option-color-bg_selected: var(--x-color-bg-elevated);--x-select-popup-option-color-bg_disabled: var(--x-color-bg-elevated);--x-select-popup-option-color-text_default: var(--x-color-text-primary);--x-select-popup-option-color-text_hover: var(--x-color-text-primary);--x-select-popup-option-color-text_selected: var(--x-color-text-primary);--x-select-popup-option-color-text_disabled: var(--x-color-text-disabled);--x-select-popup-option-color-highlight-text: var(--x-color-text-primary);--x-select-popup-option-font-highlight-weight: var(--x-font-weight-500);--x-select-popup-group-title-height: var(--x-size-5);--x-select-popup-group-title-padding-horizontal: var(--x-spacing-6);--x-select-popup-group-title-padding-top: var(--x-spacing-4);--x-select-popup-group-title-font-size: var(--x-font-size-body-1);--x-select-popup-group-title-color-text: var(--x-color-text-tertiary);--x-dropdown-margin-left-suffix-icon: var(--x-spacing-6)}.x-select--dropdown{box-sizing:border-box;padding:var(--x-select-popup-padding-vertical) 0;background-color:var(--x-select-popup-color-bg);border:1px solid var(--x-select-popup-color-border);border-radius:var(--x-select-popup-border-radius);box-shadow:var(--x-select-popup-box-shadow)}.x-select--dropdown--loading,.x-select--dropdown--empty{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--x-select-popup-empty-min-height);padding:var(--x-select-popup-padding-vertical) var(--x-select-signal-popup-option-padding-horizontal)}.x-select--dropdown--list{margin-top:0;margin-bottom:0;padding-left:0;list-style:none}.x-select--dropdown--list-wrapper{max-height:var(--x-select-popup-max-height);overflow-y:auto}.x-select--dropdown .x-select--option{position:relative;z-index:1;display:flex;align-items:center;box-sizing:border-box;width:100%;padding:0 var(--x-select-signal-popup-option-padding-horizontal);color:var(--x-select-popup-option-color-text_default);font-size:var(--x-select-popup-font-size);line-height:var(--x-select-popup-option-height);text-align:left;background-color:var(--x-select-popup-option-color-bg_default);cursor:pointer}.x-select--dropdown .x-select--option--content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-select--dropdown .x-select--option--checkbox{overflow:hidden}.x-select--dropdown .x-select--option--checkbox .x-checkbox--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-select--dropdown .x-select--option-has-suffix{justify-content:space-between}.x-select--dropdown .x-select--option-selected{color:var(--x-select-popup-option-color-text_selected);font-weight:var(--x-select-popup-option-font-weight_selected);background-color:var(--x-select-popup-option-color-bg_selected)}.x-select--dropdown .x-select--option-active,.x-select--dropdown .x-select--option:not(.x-select--dropdown .x-select--option-disabled):hover{color:var(--x-select-popup-option-color-text_hover);background-color:var(--x-select-popup-option-color-bg_hover);transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-select--dropdown .x-select--option-disabled{color:var(--x-select-popup-option-color-text_disabled);background-color:var(--x-select-popup-option-color-bg_disabled);cursor:not-allowed}.x-select--dropdown .x-select--option--icon{display:inline-flex;margin-right:8px}.x-select--dropdown .x-select--option--suffix{margin-left:var(--x-dropdown-margin-left-suffix-icon)}.x-select--dropdown .x-select--option--group--title:first-child{margin-top:var(--x-select-popup-group-title-padding-top)}.x-select--dropdown .x-select--option--group--title{box-sizing:border-box;width:100%;margin-top:var(--x-select-popup-group-title-padding-top);padding:0 var(--x-select-popup-group-title-padding-horizontal);color:var(--x-select-popup-group-title-color-text);font-size:var(--x-select-popup-group-title-font-size);line-height:var(--x-select-popup-group-title-height);cursor:default;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-select--dropdown.x-select--dropdown-has-header{padding-top:0}.x-select--dropdown-header{border-bottom:1px solid var(--x-select-popup-color-border)}.x-select--dropdown.x-select--dropdown-has-footer{padding-bottom:0}.x-select--dropdown-footer{border-top:1px solid var(--x-select-popup-color-border)}
|
|
1
|
+
:root{--x-select-popup-max-height: var(--x-size-50);--x-select-popup-border-radius: var(--x-border-radius-medium);--x-select-popup-padding-vertical: var(--x-spacing-2);--x-select-popup-font-size: var(--x-font-size-body-3);--x-select-popup-color-bg: var(--x-color-bg-elevated);--x-select-popup-color-border: var(--x-color-transparent);--x-select-popup-box-shadow: var(--x-shadow-popover);--x-select-popup-empty-min-height: var(--x-size-14);--x-select-popup-option-height: var(--x-size-9);--x-select-popup-option-font-weight_selected: var(--x-font-weight-500);--x-select-signal-popup-option-padding-horizontal: var(--x-spacing-6);--x-select-multi-popup-option-padding-horizontal: var(--x-spacing-2);--x-select-popup-option-color-bg_default: var(--x-color-bg-elevated);--x-select-popup-option-color-bg_hover: var(--x-color-fill-2);--x-select-popup-option-color-bg_selected: var(--x-color-bg-elevated);--x-select-popup-option-color-bg_disabled: var(--x-color-bg-elevated);--x-select-popup-option-color-text_default: var(--x-color-text-primary);--x-select-popup-option-color-text_hover: var(--x-color-text-primary);--x-select-popup-option-color-text_selected: var(--x-color-text-primary);--x-select-popup-option-color-text_disabled: var(--x-color-text-disabled);--x-select-popup-option-color-highlight-text: var(--x-color-text-primary);--x-select-popup-option-font-highlight-weight: var(--x-font-weight-500);--x-select-popup-group-title-height: var(--x-size-5);--x-select-popup-group-title-padding-horizontal: var(--x-spacing-6);--x-select-popup-group-title-padding-top: var(--x-spacing-4);--x-select-popup-group-title-font-size: var(--x-font-size-body-1);--x-select-popup-group-title-color-text: var(--x-color-text-tertiary);--x-dropdown-margin-left-suffix-icon: var(--x-spacing-6)}.x-select--dropdown{box-sizing:border-box;padding:var(--x-select-popup-padding-vertical) 0;background-color:var(--x-select-popup-color-bg);border:1px solid var(--x-select-popup-color-border);border-radius:var(--x-select-popup-border-radius);box-shadow:var(--x-select-popup-box-shadow)}.x-select--dropdown--loading,.x-select--dropdown--empty{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--x-select-popup-empty-min-height);padding:var(--x-select-popup-padding-vertical) var(--x-select-signal-popup-option-padding-horizontal)}.x-select--dropdown--list{margin-top:0;margin-bottom:0;padding-left:0;list-style:none}.x-select--dropdown--list-wrapper{max-height:var(--x-select-popup-max-height);overflow-y:auto}.x-select--dropdown .x-select--option{position:relative;z-index:1;display:flex;align-items:center;box-sizing:border-box;width:100%;min-height:var(--x-select-popup-option-height);padding:0 var(--x-select-signal-popup-option-padding-horizontal);color:var(--x-select-popup-option-color-text_default);font-size:var(--x-select-popup-font-size);line-height:var(--x-select-popup-option-height);text-align:left;background-color:var(--x-select-popup-option-color-bg_default);cursor:pointer}.x-select--dropdown .x-select--option--content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-select--dropdown .x-select--option--checkbox{overflow:hidden}.x-select--dropdown .x-select--option--checkbox .x-checkbox--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-select--dropdown .x-select--option-has-suffix{justify-content:space-between}.x-select--dropdown .x-select--option-selected{color:var(--x-select-popup-option-color-text_selected);font-weight:var(--x-select-popup-option-font-weight_selected);background-color:var(--x-select-popup-option-color-bg_selected)}.x-select--dropdown .x-select--option-active,.x-select--dropdown .x-select--option:not(.x-select--dropdown .x-select--option-disabled):hover{color:var(--x-select-popup-option-color-text_hover);background-color:var(--x-select-popup-option-color-bg_hover);transition:all var(--x-transition-duration-1) var(--x-transition-timing-function-linear)}.x-select--dropdown .x-select--option-disabled{color:var(--x-select-popup-option-color-text_disabled);background-color:var(--x-select-popup-option-color-bg_disabled);cursor:not-allowed}.x-select--dropdown .x-select--option--icon{display:inline-flex;margin-right:8px}.x-select--dropdown .x-select--option--suffix{margin-left:var(--x-dropdown-margin-left-suffix-icon)}.x-select--dropdown .x-select--option--group--title:first-child{margin-top:var(--x-select-popup-group-title-padding-top)}.x-select--dropdown .x-select--option--group--title{box-sizing:border-box;width:100%;margin-top:var(--x-select-popup-group-title-padding-top);padding:0 var(--x-select-popup-group-title-padding-horizontal);color:var(--x-select-popup-group-title-color-text);font-size:var(--x-select-popup-group-title-font-size);line-height:var(--x-select-popup-group-title-height);cursor:default;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-select--dropdown.x-select--dropdown-has-header{padding-top:0}.x-select--dropdown-header{border-bottom:1px solid var(--x-select-popup-color-border)}.x-select--dropdown.x-select--dropdown-has-footer{padding-bottom:0}.x-select--dropdown-footer{border-top:1px solid var(--x-select-popup-color-border)}
|
package/dist/style/network.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-network{--x-network-height: 18px;--x-network-width: 20px;--x-network-signal-width: 3px;--x-network-gap: 3px;--x-network-color-good: var(--x-color-success-6);--x-network-color-medium: var(--x-color-warning-6);--x-network-color-poor: var(--x-color-strong-6);--x-network-color-offline: var(--x-color-neutral-4);--x-network-color-unknown: var(--x-color-neutral-4);--x-network-color-inactive: var(--x-color-fill-4);--x-network-text-color: var(--x-color-text-2);display:inline-flex;justify-content:center;align-items:flex-end;gap:var(--x-network-gap);user-select:none;vertical-align:middle}.x-network-mini{--x-network-width: 13px;--x-network-height: 10px;--x-network-signal-width: 3px;--x-network-gap: 3px}.x-network-small{--x-network-width: 16px;--x-network-height: 14px;--x-network-signal-width: 4px;--x-network-gap: 3px}.x-network-medium{--x-network-width: 22px;--x-network-height: 16px;--x-network-signal-width: 4px}.x-network-large{--x-network-width: 28px;--x-network-height: 20px;--x-network-signal-width: 4px}.x-network--signal{width:var(--x-network-width);height:var(--x-network-height);display:flex;flex-direction:row;justify-content:space-between;align-items:flex-end}.x-network--signal--item{width:var(--x-network-signal-width);height:100%;border-radius:3px;overflow:hidden;background:var(--x-network-color-inactive)}.x-network--signal--item i{display:block;width:100%;height:100%;background:var(--x-network-line-color, var(--x-network-color-inactive));transition:background-color .2s ease}.x-network--metrics{display:inline-flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:1px;height:var(--x-network-height);font-size:
|
|
1
|
+
.x-network{--x-network-height: 18px;--x-network-width: 20px;--x-network-signal-width: 3px;--x-network-gap: 3px;--x-network-color-good: var(--x-color-success-6);--x-network-color-medium: var(--x-color-warning-6);--x-network-color-poor: var(--x-color-strong-6);--x-network-color-offline: var(--x-color-neutral-4);--x-network-color-unknown: var(--x-color-neutral-4);--x-network-color-inactive: var(--x-color-fill-4);--x-network-text-color: var(--x-color-text-2);--x-network-metrics-font-size: 10px;position:relative;display:inline-flex;justify-content:center;align-items:flex-end;gap:var(--x-network-gap);user-select:none;vertical-align:middle}.x-network-mini{--x-network-width: 13px;--x-network-height: 10px;--x-network-signal-width: 3px;--x-network-gap: 3px;--x-network-metrics-font-size: 9px}.x-network-small{--x-network-width: 16px;--x-network-height: 14px;--x-network-signal-width: 4px;--x-network-gap: 3px}.x-network-medium{--x-network-width: 22px;--x-network-height: 16px;--x-network-signal-width: 4px}.x-network-large{--x-network-width: 28px;--x-network-height: 20px;--x-network-signal-width: 4px;--x-network-metrics-font-size: 11px}.x-network--signal{width:var(--x-network-width);height:var(--x-network-height);flex-shrink:0;display:flex;flex-direction:row;justify-content:space-between;align-items:flex-end}.x-network--signal--item{width:var(--x-network-signal-width);flex-shrink:0;height:100%;border-radius:3px;overflow:hidden;background:var(--x-network-color-inactive)}.x-network--signal--item i{display:block;width:100%;height:100%;background:var(--x-network-line-color, var(--x-network-color-inactive));transition:background-color .2s ease}.x-network--metrics{display:inline-flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:1px;min-height:var(--x-network-height);flex-shrink:0;font-size:var(--x-network-metrics-font-size);font-weight:500;line-height:1;white-space:nowrap}.x-network--status-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.x-network--latency{color:var(--x-color-text-3)}.x-network--speed{color:var(--x-network-text-color);text-align:right}.x-network-status-good{--x-network-text-color: var(--x-color-success-text)}.x-network-status-medium{--x-network-text-color: var(--x-color-warning-text)}.x-network-status-poor{--x-network-text-color: var(--x-color-strong-text)}.x-network-status-offline{--x-network-text-color: var(--x-color-text-3)}@media(prefers-reduced-motion: reduce){.x-network .x-network--signal--item i{transition:none}}@media(forced-colors: active){.x-network .x-network--signal--item{box-sizing:border-box;border:1px solid GrayText;forced-color-adjust:none;background:Canvas}.x-network .x-network--signal--item i{background:Canvas}.x-network .x-network--signal--item.x-network-is-active{border-color:Highlight}.x-network .x-network--signal--item.x-network-is-active i{background:Highlight}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--x-pagination-item-border-radius: var(--x-border-radius-small);--x-pagination-item-spacing: var(--x-spacing-4);--x-pagination-margin-total-spacing: var(--x-spacing-4);--x-pagination-margin-option-left: var(--x-spacing-4);--x-pagination-margin-jumper-left: var(--x-spacing-4);--x-pagination-size-mini: var(--x-size-mini);--x-pagination-size-small: var(--x-size-small);--x-pagination-size-default: var(--x-size-default);--x-pagination-size-large: var(--x-size-large);--x-pagination-padding-horizontal: 8px;--x-pagination-size-mini-font-size: var(--x-font-size-body-1);--x-pagination-size-small-font-size: var(--x-font-size-body-3);--x-pagination-size-default-font-size: var(--x-font-size-body-3);--x-pagination-size-large-font-size: var(--x-font-size-body-3);--x-pagination-size-icon-arrow-mini: var(--x-size-3);--x-pagination-size-icon-arrow-small: var(--x-size-3);--x-pagination-size-icon-arrow-default: var(--x-size-3);--x-pagination-size-icon-arrow-large: 14px;--x-pagination-size-icon-ellipsis: var(--x-size-4);--x-pagination-border-width: var(--x-border-none);--x-pagination-color-bg-item: var(--x-color-transparent);--x-pagination-color-bg-item_active: var(--x-color-primary-light-1);--x-pagination-color-bg-item_hover: var(--x-color-fill-1);--x-pagination-color-bg-item_disabled: var(--x-color-transparent);--x-pagination-color-bg-item_active_disabled: var(--x-color-fill-1);--x-pagination-color-item-text: var(--x-color-text-2);--x-pagination-color-item-text_hover: var(--x-color-text-2);--x-pagination-color-item-text_active: var(--x-color-primary-6);--x-pagination-color-item-text_disabled: var(--x-color-text-4);--x-pagination-color-item-text_active_disabled: var(--x-color-primary-light-3);--x-pagination-color-item-border: var(--x-color-transparent);--x-pagination-color-item-border_active: var(--x-color-transparent);--x-pagination-color-item-border_hover: var(--x-color-transparent);--x-pagination-color-item-border_disabled: var(--x-color-transparent);--x-pagination-color-item-border_active_disabled: var(--x-color-transparent);--x-pagination-color-item-outline_focus: var(--x-color-primary-light-3);--x-pagination-color-icon-arrow: var(--x-color-text-2);--x-pagination-color-icon-arrow-bg: var(--x-color-transparent);--x-pagination-color-icon-arrow-bg_hover: var(--x-color-fill-1);--x-pagination-color-icon-arrow-bg_disabled: var(--x-color-transparent);--x-pagination-color-icon-arrow-text_hover: var(--x-color-primary-6);--x-pagination-color-icon-arrow-text_disabled: var(--x-color-text-4);--x-pagination-simple-input-width: var(--x-size-10);--x-pagination-simple-color-icon-arrow: var(--x-color-text-2);--x-pagination-simple-color-icon-arrow-bg: var(--x-color-transparent);--x-pagination-simple-color-icon-arrow-bg_hover: var(--x-color-fill-1);--x-pagination-simple-color-icon-arrow-bg_disabled: var(--x-color-transparent);--x-pagination-simple-color-icon-arrow-text_hover: var(--x-color-primary-6);--x-pagination-simple-color-icon-arrow-text_disabled: var(--x-color-text-4);--x-pagination-simple-margin-prev-right: var(--x-spacing-2);--x-pagination-simple-margin-next-left: var(--x-spacing-6);--x-pagination-simple-margin-separator-left: var(--x-spacing-6);--x-pagination-simple-margin-separator-right: var(--x-spacing-6);--x-pagination-jumper-input-width: var(--x-size-10);--x-pagination-color-jumper-goto: var(--x-color-text-3);--x-pagination-color-text-total: var(--x-color-text-1)}.x-pagination{display:flex;align-items:center;font-size:var(--x-pagination-size-default-font-size)}.x-pagination--list{display:inline-flex;align-items:center;column-gap:var(--x-pagination-item-spacing);margin:0;padding:0;white-space:nowrap;list-style:none}.x-pagination--list>.x-pagination--item{margin:0}.x-pagination--item{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;flex:0 0 auto;padding:0 var(--x-pagination-padding-horizontal);margin:0;color:var(--x-pagination-color-item-text);text-align:center;vertical-align:middle;list-style:none;background-color:var(--x-pagination-color-bg-item);border:var(--x-pagination-border-width) solid var(--x-pagination-color-item-border);border-radius:var(--x-pagination-item-border-radius);outline:0;cursor:pointer;user-select:none;min-width:var(--x-pagination-size-default);height:var(--x-pagination-size-default);font-size:var(--x-pagination-size-default-font-size);line-height:1}.x-pagination--item-previous,.x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-default)}.x-pagination--item:hover{color:var(--x-pagination-color-item-text_hover);background-color:var(--x-pagination-color-bg-item_hover);border-color:var(--x-pagination-color-item-border_hover)}.x-pagination--item:focus-visible{box-shadow:0 0 0 2px var(--x-pagination-color-item-outline_focus)}.x-pagination--item-active,.x-pagination--item-active:hover{color:var(--x-pagination-color-item-text_active);background-color:var(--x-pagination-color-bg-item_active);border-color:var(--x-pagination-color-item-border_active);transition:color var(--x-transition-duration-2) var(--x-transition-timing-function-linear),background-color var(--x-transition-duration-2) var(--x-transition-timing-function-linear)}.x-pagination--item-disabled,.x-pagination--item-disabled:hover{color:var(--x-pagination-color-item-text_disabled);background-color:var(--x-pagination-color-bg-item_disabled);border-color:var(--x-pagination-color-item-border_disabled);cursor:not-allowed}.x-pagination--item-previous,.x-pagination--item-next{color:var(--x-pagination-color-icon-arrow);font-size:var(--x-pagination-size-icon-arrow-default);background-color:var(--x-pagination-color-icon-arrow-bg)}.x-pagination--item-previous:not(.x-pagination--item-disabled):hover,.x-pagination--item-next:not(.x-pagination--item-disabled):hover{color:var(--x-pagination-color-icon-arrow-text_hover);background-color:var(--x-pagination-color-icon-arrow-bg_hover)}.x-pagination--item-previous svg,.x-pagination--item-next svg{display:block;width:1em;height:1em}.x-pagination--item-previous.x-pagination--item-disabled,.x-pagination--item-next.x-pagination--item-disabled{color:var(--x-pagination-color-icon-arrow-text_disabled);background-color:var(--x-pagination-color-icon-arrow-bg_disabled)}.x-pagination--item-ellipsis{font-size:var(--x-pagination-size-icon-ellipsis)}.x-pagination--jumper{display:flex;align-items:center;margin-left:var(--x-pagination-margin-jumper-left)}.x-pagination--jumper>span{font-size:var(--x-pagination-size-default-font-size);line-height:var(--x-line-height-base)}.x-pagination--jumper-text-goto,.x-pagination--jumper--prepend,.x-pagination--jumper--append{color:var(--x-pagination-color-jumper-goto);white-space:nowrap}.x-pagination--jumper--prepend{margin-right:var(--x-pagination-item-spacing)}.x-pagination--jumper--append{margin-left:var(--x-pagination-item-spacing)}.x-pagination--jumper .x-pagination--jumper--input{width:var(--x-pagination-jumper-input-width);padding-right:2px;padding-left:2px}.x-pagination--jumper .x-pagination--jumper--input input{text-align:center}.x-pagination--options{position:relative;display:inline-block;flex:0 0 auto;min-width:0;margin-left:var(--x-pagination-margin-option-left);text-align:center;vertical-align:middle}.x-pagination--options .x-select--view{width:auto}.x-pagination--total{display:inline-block;height:100%;margin-right:var(--x-pagination-margin-total-spacing);color:var(--x-pagination-color-text-total);font-size:var(--x-pagination-size-default-font-size);font-size:var(--x-pagination-size-default-font-size);line-height:var(--x-pagination-size-default);white-space:nowrap}.x-pagination--jumper{flex:0 0 auto}.x-pagination--jumper--separator{padding:0 var(--x-pagination-simple-margin-separator-right) 0 var(--x-pagination-simple-margin-separator-left)}.x-pagination--jumper--total-page{margin-right:calc(var(--x-pagination-simple-margin-next-left) - var(--x-pagination-simple-margin-prev-right))}.x-pagination--simple{display:inline-flex;align-items:center;flex:0 0 auto}.x-pagination--simple>.x-pagination--item{margin:0}.x-pagination--simple .x-pagination--jumper{display:inline-flex;align-items:center;flex:0 0 auto;margin:0 var(--x-pagination-simple-margin-prev-right);color:var(--x-color-text-1)}.x-pagination--simple .x-pagination--jumper .x-pagination--jumper--input{width:var(--x-pagination-simple-input-width);margin-left:0}.x-pagination--simple .x-pagination--item-previous,.x-pagination--simple .x-pagination--item-next{color:var(--x-pagination-simple-color-icon-arrow);background-color:var(--x-pagination-simple-color-icon-arrow-bg)}.x-pagination--simple .x-pagination--item-previous:not(.x-pagination--item-disabled):hover,.x-pagination--simple .x-pagination--item-next:not(.x-pagination--item-disabled):hover{color:var(--x-pagination-simple-color-icon-arrow-text_hover);background-color:var(--x-pagination-simple-color-icon-arrow-bg_hover)}.x-pagination--simple .x-pagination--item-previous.x-pagination--item-disabled,.x-pagination--simple .x-pagination--item-next.x-pagination--item-disabled{color:var(--x-pagination-simple-color-icon-arrow-text_disabled);background-color:var(--x-pagination-simple-color-icon-arrow-bg_disabled)}.x-pagination-disabled{cursor:not-allowed}.x-pagination-disabled .x-pagination--item,.x-pagination-disabled .x-pagination--item:not(.x-pagination--item-disabled):not(.x-pagination--item-active):hover{color:var(--x-pagination-color-item-text_disabled);background-color:var(--x-pagination-color-bg-item_disabled);border-color:var(--x-pagination-color-item-border_disabled);cursor:not-allowed}.x-pagination-disabled .x-pagination--item-active{color:var(--x-pagination-color-item-text_active_disabled);background-color:var(--x-pagination-color-bg-item_active_disabled);border-color:var(--x-pagination-color-item-border_active_disabled)}.x-pagination-size-mini .x-pagination--item{min-width:var(--x-pagination-size-mini);height:var(--x-pagination-size-mini);font-size:var(--x-pagination-size-mini-font-size);line-height:1}.x-pagination-size-mini .x-pagination--item-previous,.x-pagination-size-mini .x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-mini)}.x-pagination-size-mini .x-pagination--total{font-size:var(--x-pagination-size-mini-font-size);line-height:var(--x-pagination-size-mini)}.x-pagination-size-mini .x-pagination--options{height:var(--x-pagination-size-mini);font-size:var(--x-pagination-size-mini-font-size);line-height:0}.x-pagination-size-mini .x-pagination--jumper>span{font-size:var(--x-pagination-size-mini-font-size)}.x-pagination-size-small .x-pagination--item{min-width:var(--x-pagination-size-small);height:var(--x-pagination-size-small);font-size:var(--x-pagination-size-small-font-size);line-height:1}.x-pagination-size-small .x-pagination--item-previous,.x-pagination-size-small .x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-small)}.x-pagination-size-small .x-pagination--total{font-size:var(--x-pagination-size-small-font-size);line-height:var(--x-pagination-size-small)}.x-pagination-size-small .x-pagination--options{height:var(--x-pagination-size-small);font-size:var(--x-pagination-size-small-font-size);line-height:0}.x-pagination-size-small .x-pagination--jumper>span{font-size:var(--x-pagination-size-small-font-size)}.x-pagination-size-large .x-pagination--item{min-width:var(--x-pagination-size-large);height:var(--x-pagination-size-large);font-size:var(--x-pagination-size-large-font-size);line-height:1}.x-pagination-size-large .x-pagination--item-previous,.x-pagination-size-large .x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-large)}.x-pagination-size-large .x-pagination--total{font-size:var(--x-pagination-size-large-font-size);line-height:var(--x-pagination-size-large)}.x-pagination-size-large .x-pagination--options{height:var(--x-pagination-size-large);font-size:var(--x-pagination-size-large-font-size);line-height:0}.x-pagination-size-large .x-pagination--jumper>span{font-size:var(--x-pagination-size-large-font-size)}
|
|
1
|
+
:root{--x-pagination-item-border-radius: var(--x-border-radius-small);--x-pagination-item-spacing: var(--x-spacing-4);--x-pagination-margin-total-spacing: var(--x-spacing-4);--x-pagination-margin-option-left: var(--x-spacing-4);--x-pagination-margin-jumper-left: var(--x-spacing-4);--x-pagination-size-mini: var(--x-size-mini);--x-pagination-size-small: var(--x-size-small);--x-pagination-size-default: var(--x-size-default);--x-pagination-size-large: var(--x-size-large);--x-pagination-padding-horizontal: 8px;--x-pagination-size-mini-font-size: var(--x-font-size-body-1);--x-pagination-size-small-font-size: var(--x-font-size-body-3);--x-pagination-size-default-font-size: var(--x-font-size-body-3);--x-pagination-size-large-font-size: var(--x-font-size-body-3);--x-pagination-size-icon-arrow-mini: var(--x-size-4);--x-pagination-size-icon-arrow-small: 18px;--x-pagination-size-icon-arrow-default: var(--x-size-5);--x-pagination-size-icon-arrow-large: 22px;--x-pagination-size-icon-ellipsis: var(--x-size-4);--x-pagination-border-width: var(--x-border-none);--x-pagination-color-bg-item: var(--x-color-transparent);--x-pagination-color-bg-item_active: var(--x-color-primary-light-1);--x-pagination-color-bg-item_hover: var(--x-color-fill-1);--x-pagination-color-bg-item_disabled: var(--x-color-transparent);--x-pagination-color-bg-item_active_disabled: var(--x-color-fill-1);--x-pagination-color-item-text: var(--x-color-text-2);--x-pagination-color-item-text_hover: var(--x-color-text-2);--x-pagination-color-item-text_active: color-mix( in srgb, var(--x-color-primary-text) 96%, var(--x-color-text-1) );--x-pagination-color-item-text_disabled: var(--x-color-text-4);--x-pagination-color-item-text_active_disabled: var(--x-color-primary-light-3);--x-pagination-color-item-border: var(--x-color-transparent);--x-pagination-color-item-border_active: var(--x-color-transparent);--x-pagination-color-item-border_hover: var(--x-color-transparent);--x-pagination-color-item-border_disabled: var(--x-color-transparent);--x-pagination-color-item-border_active_disabled: var(--x-color-transparent);--x-pagination-color-item-outline_focus: var(--x-color-primary-text);--x-pagination-color-icon-arrow: var(--x-color-text-2);--x-pagination-color-icon-arrow-bg: var(--x-color-transparent);--x-pagination-color-icon-arrow-bg_hover: var(--x-color-fill-1);--x-pagination-color-icon-arrow-bg_disabled: var(--x-color-transparent);--x-pagination-color-icon-arrow-text_hover: var(--x-color-primary-text);--x-pagination-color-icon-arrow-text_disabled: var(--x-color-text-4);--x-pagination-simple-input-width: var(--x-size-10);--x-pagination-simple-color-icon-arrow: var(--x-color-text-2);--x-pagination-simple-color-icon-arrow-bg: var(--x-color-transparent);--x-pagination-simple-color-icon-arrow-bg_hover: var(--x-color-fill-1);--x-pagination-simple-color-icon-arrow-bg_disabled: var(--x-color-transparent);--x-pagination-simple-color-icon-arrow-text_hover: var(--x-color-primary-text);--x-pagination-simple-color-icon-arrow-text_disabled: var(--x-color-text-4);--x-pagination-simple-margin-prev-right: var(--x-spacing-2);--x-pagination-simple-margin-next-left: var(--x-spacing-6);--x-pagination-simple-margin-separator-left: var(--x-spacing-6);--x-pagination-simple-margin-separator-right: var(--x-spacing-6);--x-pagination-jumper-input-width: var(--x-size-10);--x-pagination-color-jumper-goto: var(--x-color-text-3);--x-pagination-color-text-total: var(--x-color-text-1)}.x-pagination{display:flex;flex-wrap:wrap;align-items:center;min-width:0;max-width:100%;row-gap:var(--x-pagination-item-spacing);font-size:var(--x-pagination-size-default-font-size)}.x-pagination--list{display:inline-flex;align-items:center;flex:0 1 auto;min-width:0;max-width:100%;column-gap:var(--x-pagination-item-spacing);box-sizing:border-box;margin:0;padding:2px;overflow-x:auto;white-space:nowrap;list-style:none}.x-pagination--list>.x-pagination--item{margin:0}.x-pagination--item{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;flex:0 0 auto;padding:0 var(--x-pagination-padding-horizontal);margin:0;color:var(--x-pagination-color-item-text);text-align:center;vertical-align:middle;list-style:none;background-color:var(--x-pagination-color-bg-item);border:var(--x-pagination-border-width) solid var(--x-pagination-color-item-border);border-radius:var(--x-pagination-item-border-radius);outline:0;cursor:pointer;user-select:none;min-width:var(--x-pagination-size-default);height:var(--x-pagination-size-default);font-size:var(--x-pagination-size-default-font-size);line-height:1}.x-pagination--item-previous,.x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-default)}.x-pagination--item:hover{color:var(--x-pagination-color-item-text_hover);background-color:var(--x-pagination-color-bg-item_hover);border-color:var(--x-pagination-color-item-border_hover)}.x-pagination--item:focus-visible{box-shadow:0 0 0 2px var(--x-pagination-color-item-outline_focus)}.x-pagination--item-active,.x-pagination--item-active:hover{color:var(--x-pagination-color-item-text_active);background-color:var(--x-pagination-color-bg-item_active);border-color:var(--x-pagination-color-item-border_active);transition:color var(--x-transition-duration-2) var(--x-transition-timing-function-linear),background-color var(--x-transition-duration-2) var(--x-transition-timing-function-linear)}.x-pagination--item-disabled,.x-pagination--item-disabled:hover{color:var(--x-pagination-color-item-text_disabled);background-color:var(--x-pagination-color-bg-item_disabled);border-color:var(--x-pagination-color-item-border_disabled);cursor:not-allowed}.x-pagination--item-previous,.x-pagination--item-next{color:var(--x-pagination-color-icon-arrow);font-size:var(--x-pagination-size-icon-arrow-default);background-color:var(--x-pagination-color-icon-arrow-bg)}.x-pagination--item-previous:not(.x-pagination--item-disabled):hover,.x-pagination--item-next:not(.x-pagination--item-disabled):hover{color:var(--x-pagination-color-icon-arrow-text_hover);background-color:var(--x-pagination-color-icon-arrow-bg_hover)}.x-pagination--item-previous svg,.x-pagination--item-next svg{display:block;width:1em;height:1em}.x-pagination--item-previous.x-pagination--item-disabled,.x-pagination--item-next.x-pagination--item-disabled{color:var(--x-pagination-color-icon-arrow-text_disabled);background-color:var(--x-pagination-color-icon-arrow-bg_disabled)}.x-pagination--item-ellipsis{font-size:var(--x-pagination-size-icon-ellipsis)}.x-pagination--jumper{display:flex;align-items:center;margin-left:var(--x-pagination-margin-jumper-left)}.x-pagination--jumper>span{font-size:var(--x-pagination-size-default-font-size);line-height:var(--x-line-height-base)}.x-pagination--jumper-text-goto,.x-pagination--jumper--prepend,.x-pagination--jumper--append{color:var(--x-pagination-color-jumper-goto);white-space:nowrap}.x-pagination--jumper--prepend{margin-right:var(--x-pagination-item-spacing)}.x-pagination--jumper--append{margin-left:var(--x-pagination-item-spacing)}.x-pagination--jumper .x-pagination--jumper--input{width:var(--x-pagination-jumper-input-width);padding-right:2px;padding-left:2px}.x-pagination--jumper .x-pagination--jumper--input input{text-align:center}.x-pagination--options{position:relative;display:inline-block;flex:0 0 auto;min-width:0;margin-left:var(--x-pagination-margin-option-left);text-align:center;vertical-align:middle}.x-pagination--options .x-select--view{width:auto}.x-pagination--total{display:inline-block;height:100%;margin-right:var(--x-pagination-margin-total-spacing);color:var(--x-pagination-color-text-total);font-size:var(--x-pagination-size-default-font-size);font-size:var(--x-pagination-size-default-font-size);line-height:var(--x-pagination-size-default);white-space:nowrap}.x-pagination--jumper{flex:0 0 auto}.x-pagination--jumper--separator{padding:0 var(--x-pagination-simple-margin-separator-right) 0 var(--x-pagination-simple-margin-separator-left)}.x-pagination--jumper--total-page{margin-right:calc(var(--x-pagination-simple-margin-next-left) - var(--x-pagination-simple-margin-prev-right))}.x-pagination--simple{display:inline-flex;align-items:center;flex:0 0 auto}.x-pagination--simple>.x-pagination--item{margin:0}.x-pagination--simple .x-pagination--jumper{display:inline-flex;align-items:center;flex:0 0 auto;margin:0 var(--x-pagination-simple-margin-prev-right);color:var(--x-color-text-1)}.x-pagination--simple .x-pagination--jumper .x-pagination--jumper--input{width:var(--x-pagination-simple-input-width);margin-left:0}.x-pagination--simple .x-pagination--item-previous,.x-pagination--simple .x-pagination--item-next{color:var(--x-pagination-simple-color-icon-arrow);background-color:var(--x-pagination-simple-color-icon-arrow-bg)}.x-pagination--simple .x-pagination--item-previous:not(.x-pagination--item-disabled):hover,.x-pagination--simple .x-pagination--item-next:not(.x-pagination--item-disabled):hover{color:var(--x-pagination-simple-color-icon-arrow-text_hover);background-color:var(--x-pagination-simple-color-icon-arrow-bg_hover)}.x-pagination--simple .x-pagination--item-previous.x-pagination--item-disabled,.x-pagination--simple .x-pagination--item-next.x-pagination--item-disabled{color:var(--x-pagination-simple-color-icon-arrow-text_disabled);background-color:var(--x-pagination-simple-color-icon-arrow-bg_disabled)}.x-pagination-disabled{cursor:not-allowed}.x-pagination-disabled .x-pagination--item,.x-pagination-disabled .x-pagination--item:not(.x-pagination--item-disabled):not(.x-pagination--item-active):hover{color:var(--x-pagination-color-item-text_disabled);background-color:var(--x-pagination-color-bg-item_disabled);border-color:var(--x-pagination-color-item-border_disabled);cursor:not-allowed}.x-pagination-disabled .x-pagination--item-active{color:var(--x-pagination-color-item-text_active_disabled);background-color:var(--x-pagination-color-bg-item_active_disabled);border-color:var(--x-pagination-color-item-border_active_disabled)}.x-pagination-size-mini .x-pagination--item{min-width:var(--x-pagination-size-mini);height:var(--x-pagination-size-mini);font-size:var(--x-pagination-size-mini-font-size);line-height:1}.x-pagination-size-mini .x-pagination--item-previous,.x-pagination-size-mini .x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-mini)}.x-pagination-size-mini .x-pagination--total{font-size:var(--x-pagination-size-mini-font-size);line-height:var(--x-pagination-size-mini)}.x-pagination-size-mini .x-pagination--options{height:var(--x-pagination-size-mini);font-size:var(--x-pagination-size-mini-font-size);line-height:0}.x-pagination-size-mini .x-pagination--jumper>span{font-size:var(--x-pagination-size-mini-font-size)}.x-pagination-size-small .x-pagination--item{min-width:var(--x-pagination-size-small);height:var(--x-pagination-size-small);font-size:var(--x-pagination-size-small-font-size);line-height:1}.x-pagination-size-small .x-pagination--item-previous,.x-pagination-size-small .x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-small)}.x-pagination-size-small .x-pagination--total{font-size:var(--x-pagination-size-small-font-size);line-height:var(--x-pagination-size-small)}.x-pagination-size-small .x-pagination--options{height:var(--x-pagination-size-small);font-size:var(--x-pagination-size-small-font-size);line-height:0}.x-pagination-size-small .x-pagination--jumper>span{font-size:var(--x-pagination-size-small-font-size)}.x-pagination-size-large .x-pagination--item{min-width:var(--x-pagination-size-large);height:var(--x-pagination-size-large);font-size:var(--x-pagination-size-large-font-size);line-height:1}.x-pagination-size-large .x-pagination--item-previous,.x-pagination-size-large .x-pagination--item-next{font-size:var(--x-pagination-size-icon-arrow-large)}.x-pagination-size-large .x-pagination--total{font-size:var(--x-pagination-size-large-font-size);line-height:var(--x-pagination-size-large)}.x-pagination-size-large .x-pagination--options{height:var(--x-pagination-size-large);font-size:var(--x-pagination-size-large-font-size);line-height:0}.x-pagination-size-large .x-pagination--jumper>span{font-size:var(--x-pagination-size-large-font-size)}
|
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--column-handle:focus-visible{background-color:var(--x-table-color-border_resizing);outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.x-table .x-spin{display:flex;flex-direction:column;height:100%}.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--col-sorted{background-color:var(--x-table-color-bg-header-sorted-cell)}.x-table .x-table--td.x-table--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 .x-table--th.x-table-col-fixed-left,.x-table .x-table--th.x-table-col-fixed-right{position:sticky}.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 .x-table--expand-btn:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:2px}.x-table .x-table--drag-button{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;color:inherit;background:rgba(0,0,0,0);border:0;border-radius:var(--x-border-radius-small);cursor:grab;touch-action:none}.x-table .x-table--drag-button:active{cursor:grabbing}.x-table .x-table--drag-button:focus-visible,.x-table .x-table--tr[tabindex]:focus-visible,.x-table .x-table--td[tabindex]:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.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--th:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.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{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:first-child .x-icon{color:var(--x-table-color-header-sorter-icon_next)}.x-table--cell-next-descend .x-table--sorter--icon:last-child .x-icon{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{position:absolute;top:50%;left:50%;width:var(--x-table-font-size-header-sorter-icon);height:var(--x-table-font-size-header-sorter-icon);transform:translate(-50%, -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--cell-with-sorter .x-table--sorter--icon-active .x-icon,.x-table--cell-with-sorter:hover .x-table--sorter--icon-active .x-icon{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-empty .x-table--header{overflow-x:auto}.x-table-sticky-header>.x-spin>.x-spin--children>.x-table--container,.x-table-sticky-header>.x-table--container{overflow:visible}.x-table-sticky-header .x-table--content>.x-table--body:last-child,.x-table-sticky-header .x-table--content>.x-table--tfoot:last-child{border-radius:0 0 var(--x-table-border-radius) var(--x-table-border-radius)}.x-table-sticky-header .x-table--body:last-child>.x-scrollbar--container{border-radius:inherit}.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-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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked) .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):not(.x-table--tr-checked) .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):not(.x-table--tr-checked) .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.x-table-type-selection .x-table--tr-checked>.x-table--td{background-color:var(--x-table-color-bg-body-row_active)}.x-table.x-table-type-selection .x-table--tr-checked>.x-table--td::before{background-color:var(--x-color-transparent)}.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:0 0 auto;align-items:center;min-width:0}.x-table-virtualized .x-table--body .x-table--td>.x-table--cell{width:100%;min-width:0}.x-table-virtualized .x-table--body .x-table--tr-expand>.x-table--td,.x-table-virtualized .x-table--body .x-table--tr-empty>.x-table--td{width:100%}.x-table .x-table--header-sticky{position:sticky}.x-table-virtualized .x-virtual-list>.x-table--element{display:block;width:100%}@media(prefers-reduced-motion: reduce){.x-table .x-table--th,.x-table .x-table--td,.x-table .x-table--expand-btn,.x-table .x-table--sorter--icon .x-icon,.x-table .x-table--filters,.x-table .x-table--filters::before,.x-table .x-table-col-fixed-left-last::after,.x-table .x-table-col-fixed-right-first::after,.x-table .x-table--container::before,.x-table .x-table--container::after{transition:none}}.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)}
|
|
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--column-handle:focus-visible{background-color:var(--x-table-color-border_resizing);outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.x-table .x-spin{display:flex;flex-direction:column;height:100%}.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--col-sorted{background-color:var(--x-table-color-bg-header-sorted-cell)}.x-table .x-table--td.x-table--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 .x-table--th.x-table-col-fixed-left,.x-table .x-table--th.x-table-col-fixed-right{position:sticky}.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 .x-table--expand-btn:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:2px}.x-table .x-table--drag-button{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;color:inherit;background:var(--x-color-transparent);border:0;border-radius:var(--x-border-radius-small);cursor:grab;touch-action:none}.x-table .x-table--drag-button:active{cursor:grabbing}.x-table .x-table--drag-button:focus-visible,.x-table .x-table--tr[tabindex]:focus-visible,.x-table .x-table--td[tabindex]:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.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--th:focus-visible{outline:2px solid var(--x-color-primary-6);outline-offset:-2px}.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{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:first-child .x-icon{color:var(--x-table-color-header-sorter-icon_next)}.x-table--cell-next-descend .x-table--sorter--icon:last-child .x-icon{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{position:absolute;top:50%;left:50%;width:var(--x-table-font-size-header-sorter-icon);height:var(--x-table-font-size-header-sorter-icon);transform:translate(-50%, -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--cell-with-sorter .x-table--sorter--icon-active .x-icon,.x-table--cell-with-sorter:hover .x-table--sorter--icon-active .x-icon{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-empty .x-table--header{overflow-x:auto}.x-table-sticky-header>.x-spin>.x-spin--children>.x-table--container,.x-table-sticky-header>.x-table--container{overflow:visible}.x-table-sticky-header .x-table--content>.x-table--body:last-child,.x-table-sticky-header .x-table--content>.x-table--tfoot:last-child{border-radius:0 0 var(--x-table-border-radius) var(--x-table-border-radius)}.x-table-sticky-header .x-table--body:last-child>.x-scrollbar--container{border-radius:inherit}.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-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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked):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):not(.x-table--tr-checked) .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):not(.x-table--tr-checked) .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):not(.x-table--tr-checked) .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.x-table-type-selection .x-table--tr-checked>.x-table--td{background-color:var(--x-table-color-bg-body-row_active)}.x-table.x-table-type-selection .x-table--tr-checked>.x-table--td::before{background-color:var(--x-color-transparent)}.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:0 0 auto;align-items:center;min-width:0}.x-table-virtualized .x-table--body .x-table--td>.x-table--cell{width:100%;min-width:0}.x-table-virtualized .x-table--body .x-table--tr-expand>.x-table--td,.x-table-virtualized .x-table--body .x-table--tr-empty>.x-table--td{width:100%}.x-table .x-table--header-sticky{position:sticky}.x-table-virtualized .x-virtual-list>.x-table--element{display:block;width:100%}@media(prefers-reduced-motion: reduce){.x-table .x-table--th,.x-table .x-table--td,.x-table .x-table--expand-btn,.x-table .x-table--sorter--icon .x-icon,.x-table .x-table--filters,.x-table .x-table--filters::before,.x-table .x-table-col-fixed-left-last::after,.x-table .x-table-col-fixed-right-first::after,.x-table .x-table--container::before,.x-table .x-table--container::after{transition:none}}.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)}
|