@tuya-miniapp/smart-ui 2.3.8-beta-5 → 2.3.8

package/packages/common/style/var.less

@@ -1,813 +0,0 @@
-// Theme Palette
-@M1: var(--app-M1, #3678e3); // 用于按钮、品牌露出
-@M2: var(--app-M2, #f04c4c); // 用于强警告、提示信息
-@M3: var(--app-M3, #2dda86); // 用于成功、开关、推荐等
-@M4: var(--app-M4, #1989fa); // 用于正向引导、按钮文字、链接等
-@M5: var(--app-M5, #ffa000); // 用于轻度警告、提示信息
-@B1: var(--app-B1, #f6f7fb); // 背景色
-@B2: var(--app-B2, #ffffff); // 顶部导航栏
-@B3: var(--app-B3, #ffffff); // 卡片
-@B4: var(--app-B4, #ffffff); // 弹窗
-@B5: var(--app-B5, #ffffff); // 底部导航栏
-@B6: var(--app-B6, #ffffff); // 列表
-@B1-N1: var(--app-B1-N1, rgba(0, 0, 0, 1)); // 背景色 N1 字体色
-@B1-N2: var(--app-B1-N2, rgba(0, 0, 0, 0.7)); // 背景色 N2 字体色
-@B1-N3: var(--app-B1-N3, rgba(0, 0, 0, 0.5)); // 背景色 N3 字体色
-@B1-N4: var(--app-B1-N4, rgba(0, 0, 0, 0.4)); // 背景色 N4 字体色
-@B1-N5: var(--app-B1-N5, rgba(0, 0, 0, 0.3)); // 背景色 N5 字体色
-@B1-N6: var(--app-B1-N6, rgba(0, 0, 0, 0.2)); // 背景色 N6 字体色
-@B1-N7: var(--app-B1-N7, rgba(0, 0, 0, 0.1)); // 背景色 N7 字体色
-@B1-N8: var(--app-B1-N8, rgba(0, 0, 0, 0.4)); // 背景色 N8 字体色
-@B1-N9: var(--app-B1-N9, rgba(0, 0, 0, 0.05)); // 背景色 N9 字体色
-@B2-N1: var(--app-B2-N1, rgba(0, 0, 0, 1)); // 顶部导航栏 N1 字体色
-@B2-N2: var(--app-B2-N2, rgba(0, 0, 0, 0.7)); // 顶部导航栏 N2 字体色
-@B2-N3: var(--app-B2-N3, rgba(0, 0, 0, 0.5)); // 顶部导航栏 N3 字体色
-@B2-N4: var(--app-B2-N4, rgba(0, 0, 0, 0.4)); // 顶部导航栏 N4 字体色
-@B2-N5: var(--app-B2-N5, rgba(0, 0, 0, 0.3)); // 顶部导航栏 N5 字体色
-@B2-N6: var(--app-B2-N6, rgba(0, 0, 0, 0.2)); // 顶部导航栏 N6 字体色
-@B2-N7: var(--app-B2-N7, rgba(0, 0, 0, 0.1)); // 顶部导航栏 N7 字体色
-@B2-N8: var(--app-B2-N8, rgba(0, 0, 0, 0.4)); // 顶部导航栏 N8 字体色
-@B2-N9: var(--app-B2-N9, rgba(0, 0, 0, 0.05)); // 顶部导航栏 N9 字体色
-@B4-N1: var(--app-B4-N1, rgba(0, 0, 0, 1)); // 弹窗 N1 字体色
-@B4-N2: var(--app-B4-N2, rgba(0, 0, 0, 0.7)); // 弹窗 N2 字体色
-@B4-N3: var(--app-B4-N3, rgba(0, 0, 0, 0.5)); // 弹窗 N3 字体色
-@B4-N4: var(--app-B4-N4, rgba(0, 0, 0, 0.4)); // 弹窗 N4 字体色
-@B4-N5: var(--app-B4-N5, rgba(0, 0, 0, 0.3)); // 弹窗 N5 字体色
-@B4-N6: var(--app-B4-N6, rgba(0, 0, 0, 0.2)); // 弹窗 N6 字体色
-@B4-N7: var(--app-B4-N7, rgba(0, 0, 0, 0.1)); // 弹窗 N7 字体色
-@B4-N8: var(--app-B4-N8, rgba(0, 0, 0, 0.4)); // 弹窗 N8 字体色
-@B4-N9: var(--app-B4-N9, rgba(0, 0, 0, 0.05)); // 弹窗 N9 字体色
-@B5: var(--app-B5, #f6f7fb); // 底部导航栏
-@B6: var(--app-B6, #fff); // 列表色
-@B6-N1: var(--app-B6-N1, rgba(0, 0, 0, 1)); // 列表 N1 字体色
-@B6-N2: var(--app-B6-N2, rgba(0, 0, 0, 0.7)); // 列表 N2 字体色
-@B6-N3: var(--app-B6-N3, rgba(0, 0, 0, 0.5)); // 列表 N3 字体色
-@B6-N4: var(--app-B6-N4, rgba(0, 0, 0, 0.4)); // 列表 N4 字体色
-@B6-N5: var(--app-B6-N5, rgba(0, 0, 0, 0.3)); // 列表 N5 字体色
-@B6-N6: var(--app-B6-N6, rgba(0, 0, 0, 0.2)); // 列表 N6 字体色
-@B6-N7: var(--app-B6-N7, rgba(0, 0, 0, 0.1)); // 列表 N7 字体色
-@B6-N8: var(--app-B6-N8, rgba(0, 0, 0, 0.4)); // 列表 N8 字体色
-@B6-N9: var(--app-B6-N9, rgba(0, 0, 0, 0.05)); // 列表 N9 字体色
-
-// Color Palette
-@black: #000;
-@white: #fff;
-@gray-1: #f7f8fa;
-@gray-2: #f2f3f5;
-@gray-3: #ebedf0;
-@gray-4: #dcdee0;
-@gray-5: #c8c9cc;
-@gray-6: #969799;
-@gray-7: #646566;
-@gray-8: #323233;
-@red: #ee0a24;
-@blue: #1989fa;
-@orange: #ff976a;
-@orange-dark: #ed6a0c;
-@orange-light: #fffbe8;
-@green: #07c160;
-
-// Gradient Colors
-@gradient-red: linear-gradient(to right, #ff6034, #ee0a24);
-@gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);
-
-// Component Colors
-@text-color: @gray-8;
-@icon-color: @B4-N2;
-@active-color: @gray-2;
-@active-opacity: 0.7;
-@disabled-opacity: 0.3;
-@background-color: @gray-1;
-@background-color-light: #fafafa;
-@text-link-color: #576b95;
-
-// Padding
-@padding-base: 4px;
-@padding-mb: 2px;
-@padding-xs: 8px;
-@padding-sm: 12px;
-@padding-md: 16px;
-@padding-lg: 24px;
-@padding-xl: 32px;
-
-// Font
-@font-size-xs: 10px;
-@font-size-sm: 12px;
-@font-size-md: 14px;
-@font-size-lg: 16px;
-@font-weight-bold: 500;
-@font-weight-bolder: 700;
-@line-height-xs: 14px;
-@line-height-sm: 18px;
-@line-height-md: 20px;
-@line-height-lg: 22px;
-@base-font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Segoe UI, Arial,
-  Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
-@price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;
-
-// Animation
-@animation-duration-base: 0.3s;
-@animation-duration-fast: 0.2s;
-
-// Border
-@border-color: @B6-N7;
-@border-width-base: 1px;
-@border-radius-sm: 2px;
-@border-radius-md: 4px;
-@border-radius-lg: 10px;
-@border-radius-max: 999px;
-
-// ActionSheet
-@action-sheet-width: calc(100% - 32px);
-@action-sheet-left: 16px; // 一般需要和 action-sheet-width 一起配合使用
-@action-sheet-max-height: 90%;
-@action-sheet-margin: 0 0 16px;
-@action-sheet-active-color: @B1;
-@action-sheet-active-icon-color: @M1;
-@action-sheet-item-disabled-opacity: @disabled-opacity;
-@action-sheet-header-border-color: @B4-N7;
-@action-sheet-header-height: 56px;
-@action-sheet-header-color: @B4-N3;
-@action-sheet-header-font-size: @font-size-lg;
-@action-sheet-header-font-weight: normal;
-@action-sheet-description-color: @B4-N3;
-@action-sheet-description-font-size: @font-size-md;
-@action-sheet-description-line-height: 20px;
-@action-sheet-item-background: @B4;
-@action-sheet-item-border-radius: 0;
-@action-sheet-item-icon-margin: 16px 16px 0 0;
-@action-sheet-item-icon-color: @M1;
-@action-sheet-item-icon-size: 28px;
-@action-sheet-item-font-size: @font-size-lg;
-@action-sheet-item-font-weight: normal;
-@action-sheet-item-line-height: 24px;
-@action-sheet-item-text-color: @B4-N1;
-@action-sheet-subname-color: @B4-N3;
-@action-sheet-subname-font-size: @font-size-sm;
-@action-sheet-subname-line-height: 20px;
-@action-sheet-confirm-text-color: @B4-N1;
-@action-sheet-confirm-font-weight: @font-weight-bold;
-@action-sheet-cancel-text-color: @B4-N3;
-@action-sheet-footer-padding-top: @padding-xs;
-@action-sheet-footer-padding-color: @B4-N9;
-
-// BottomSheet
-@bottom-sheet-width: 100%;
-@bottom-sheet-min-height: auto;
-@bottom-sheet-max-height: 50%;
-@bottom-sheet-padding: 0 16px;
-@bottom-sheet-icon-margin: 16px 16px 0 0;
-@bottom-sheet-header-height: 56px;
-@bottom-sheet-header-color: @B4-N1;
-@bottom-sheet-header-font-size: 17px;
-@bottom-sheet-header-font-weight: 600;
-@bottom-sheet-font-color: @B4-N1;
-
-// Button
-@button-mini-height: 22px;
-@button-mini-min-width: 50px;
-@button-mini-font-size: @font-size-xs;
-@button-small-height: 30px;
-@button-small-font-size: @font-size-sm;
-@button-small-min-width: 60px;
-@button-normal-font-size: @font-size-md;
-@button-large-height: 48px;
-@button-default-color: @B1-N1;
-@button-default-height: 48px;
-@button-default-font-size: @font-size-lg;
-@button-default-background-color: @B3;
-@button-default-border-color: @border-color;
-@button-primary-color: @white;
-@button-primary-background-color: @M3;
-@button-primary-border-color: @M3;
-@button-info-color: @white;
-@button-info-background-color: @M4;
-@button-info-border-color: @M4;
-@button-danger-color: @white;
-@button-danger-background-color: @M2;
-@button-danger-border-color: @M2;
-@button-warning-color: @white;
-@button-warning-background-color: @M5;
-@button-warning-border-color: @M5;
-@button-line-height: 20px;
-@button-border-width: 1px;
-@button-border-radius: @border-radius-lg;
-@button-round-border-radius: @border-radius-max;
-@button-plain-background-color: @white;
-@button-disabled-opacity: @disabled-opacity;
-@button-font-weight: normal;
-@button-primary-font-weight: 600;
-
-// Calendar
-@calendar-background-color: @B6;
-@calendar-popup-height: 90%;
-@calendar-header-box-shadow: 0 2px 10px rgba(125, 126, 128, 0.16);
-@calendar-header-title-height: 44px;
-@calendar-header-title-font-size: @font-size-lg;
-@calendar-header-title-font-color: @B4-N1;
-@calendar-header-subtitle-font-size: @font-size-md;
-@calendar-weekdays-height: 30px;
-@calendar-weekdays-font-size: 12px;
-@calendar-weekdays-font-color: @B4-N1;
-@calendar-month-title-font-size: @font-size-md;
-@calendar-month-mark-color: fade(@gray-4, 60%);
-@calendar-month-mark-font-size: 160px;
-@calendar-day-height: 100rpx;
-@calendar-cell-item-font-size: 15px;
-@calendar-cell-item-width: 104rpx;
-@calendar-cell-item-height: 104rpx;
-@calendar-cell-item-font-color: @B4-N1;
-@calendar-cell-item-border-radius: 104rpx;
-@calendar-day-font-weight: 500;
-@calendar-day-select-border-radius: 34rpx;
-@calendar-range-edge-color: @white;
-@calendar-range-edge-background-color: #3678e3;
-@calendar-range-middle-color: #fff;
-@calendar-range-middle-background-opacity: 0.1;
-@calendar-selected-day-size: 34px;
-@calendar-selected-day-color: @white;
-@calendar-info-font-size: @font-size-xs;
-@calendar-info-line-height: 14px;
-@calendar-selected-day-background-color: #3678e3;
-@calendar-day-disabled-color: @gray-5;
-@calendar-confirm-button-height: 36px;
-@calendar-confirm-button-margin: 7px 0;
-@calendar-confirm-button-line-height: 34px;
-@calendar-text-color: @black;
-@calendar-header-save-color: #1989fa;
-@calendar-header-icon-bg-color: @B2-N9;
-
-// Cell
-@cell-font-size: @font-size-lg;
-@cell-line-height: 24px;
-@cell-vertical-padding: 16px;
-@cell-horizontal-padding: @padding-md;
-@cell-text-color: @B6-N1;
-@cell-background-color: @B6;
-@cell-active-color: @B1;
-@cell-required-color: @M2;
-@cell-label-color: @B6-N3;
-@cell-label-font-size: @font-size-md;
-@cell-label-line-height: 18px;
-@cell-label-margin-top: 3px;
-@cell-value-color: @B6-N3;
-@cell-icon-size: 24px;
-@cell-right-icon-color: @B6-N6;
-@cell-border-color: var(--cell-border-color, @border-color);
-@cell-border-left-position: var(--cell-border-left-position, @padding-md);
-@cell-border-right-position: var(--cell-border-right-position, @padding-md);
-
-// CellGroup
-@cell-group-background-color: @B6;
-@cell-group-title-color: @B6-N3;
-@cell-group-title-padding: @padding-md @padding-md @padding-xs;
-@cell-group-title-font-size: @font-size-lg;
-@cell-group-title-line-height: 16px;
-@cell-group-inset-padding: 0 @padding-md;
-@cell-group-inset-border-radius: 16px;
-@cell-group-inset-title-padding: @padding-md @padding-md @padding-xs @padding-xl;
-
-// Checkbox
-@checkbox-size: 24px;
-@checkbox-border-color: @B6-N6;
-@checkbox-border-radius: 4px;
-@checkbox-transition-duration: 0.2s;
-@checkbox-label-size: 12px;
-@checkbox-label-margin: 10px;
-@checkbox-label-color: @B6-N1;
-@checkbox-checked-icon-color: @M4;
-@checkbox-disabled-label-color: @B6-N1;
-@checkbox-disabled-opacity: @disabled-opacity;
-
-// Circle
-@circle-text-color: @text-color;
-
-// Collapse
-@collapse-item-transition-duration: 0.3s;
-@collapse-item-content-padding: 15px;
-@collapse-item-content-font-size: 13px;
-@collapse-item-content-line-height: 1.5;
-@collapse-item-content-text-color: @gray-6;
-@collapse-item-content-background-color: @B6;
-@collapse-item-title-disabled-color: @gray-5;
-
-// CountDown
-@count-down-text-color: @B6-N2;
-@count-down-font-size: @font-size-md;
-@count-down-line-height: 20px;
-
-// Dialog
-@dialog-width: 311px;
-@dialog-small-screen-width: 90%;
-@dialog-font-size: @font-size-lg;
-@dialog-border-radius: 16px;
-@dialog-background-color: @B4;
-@dialog-header-font-color: @B4-N1;
-@dialog-header-font-weight: 400;
-@dialog-header-line-height: 24px;
-@dialog-header-padding-top: @padding-lg;
-@dialog-header-padding: 0;
-@dialog-header-isolated-padding: @padding-lg 0;
-@dialog-message-padding: @padding-lg;
-@dialog-message-font-size: @font-size-lg;
-@dialog-message-line-height: 20px;
-@dialog-message-max-height: 60vh;
-@dialog-message-text-color: @B4-N1;
-@dialog-has-title-message-font-size: @font-size-md;
-@dialog-has-title-message-text-color: @B4-N3;
-@dialog-has-title-message-padding-top: @padding-xs;
-// @dialog-header-icon-color: @M2;
-@dialog-header-icon-size: 39px;
-@dialog-input-height: 40px;
-@dialog-input-background-color: @B4-N9;
-@dialog-input-margin: 0 16px 24px;
-@dialog-input-padding: 0 10px;
-@dialog-input-border-radius: 10px;
-@dialog-input-font-size: 14px;
-@dialog--round-button-border-radius: 20px;
-
-// Field
-@field-label-color: @B6-N1;
-@field-input-text-color: @B6-N1;
-@field-input-error-text-color: @M2;
-@field-placeholder-text-color: @B6-N4;
-@field-icon-size: @font-size-lg;
-@field-clear-icon-size: @font-size-lg;
-@field-clear-icon-color: @B6-N4;
-@field-icon-container-color: @gray-6;
-@field-error-message-color: @M2;
-@field-error-message-text-font-size: @font-size-md;
-@field-disabled-opacity: 0.7;
-@field-input-text-font-size: @font-size-lg;
-@field-label-font-size: @font-size-lg;
-@field-label-line-height: @line-height-sm;
-@field-sub-label-font-size: @font-size-md;
-@field-sub-label-line-height: 16px;
-@field-error-message-text-line-height: 18px;
-@field-subtitle-text-color: @B6-N3;
-@field-left-icon-margin-right: 10px;
-@field-left-body-padding-right: 16px;
-
-@field-card-border-radius: 8px;
-@field-card-background: @B6-N7;
-@field-card-width: 105px;
-@field-card-height: 38px;
-@field-card-padding: 0 10px;
-
-@field-textarea-background: @B3;
-@field-textarea-border-radius: 8px;
-@field-textarea-padding: 12px 8px;
-@field-textarea-limit-padding-bottom: 20px;
-@field-textarea-min-height: 130px;
-@field-word-limit-color: @B6-N4;
-@field-word-limit-font-size: @font-size-xs;
-@field-word-limit-line-height: 14px;
-@field-word-num-full-color: @M2;
-
-// GoodsAction
-@goods-action-background-color: @B4;
-@goods-action-height: 50px;
-@goods-action-icon-width: 48px;
-@goods-action-icon-height: @goods-action-height;
-@goods-action-icon-color: @text-color;
-@goods-action-icon-size: 18px;
-@goods-action-icon-font-size: @font-size-xs;
-@goods-action-icon-text-color: @gray-7;
-@goods-action-button-height: 40px;
-@goods-action-button-line-height: @button-line-height;
-@goods-action-button-border-radius: @border-radius-max;
-@goods-action-button-warning-color: @gradient-orange;
-@goods-action-button-danger-color: @gradient-red;
-@goods-action-button-plain-color: @B4;
-
-// Image
-@image-placeholder-text-color: @gray-6;
-@image-placeholder-font-size: @font-size-md;
-@image-placeholder-background-color: @background-color;
-@image-loading-icon-size: 32px;
-@image-loading-icon-color: @gray-4;
-@image-error-size: 32px;
-
-// Info
-@info-size: 12px;
-@info-color: @white;
-@info-padding: 0 4px;
-@info-font-size: 11px;
-@info-font-weight: 600;
-@info-border-width: 0;
-@info-background-color: @M2;
-@info-dot-color: @M2;
-@info-dot-size: 8px;
-@info-font-family: -apple-system-font, PingFang SC, Helvetica Neue, Arial, sans-serif;
-
-// Loading
-@loading-text-color: @gray-6;
-@loading-text-font-size: @font-size-md;
-@loading-text-line-height: 20px;
-@loading-spinner-color: @gray-5;
-@loading-spinner-size: 30px;
-@loading-spinner-animation-duration: 0.8s;
-
-// NavBar
-@nav-bar-height: 46px;
-@nav-bar-round-border-radius: 16px 16px 0px 0px;
-@nav-bar-round-min-height: 56px;
-@nav-bar-background-color: @B2;
-@nav-bar-arrow-color: @B2-N1;
-@nav-bar-icon-size: 32px;
-@nav-bar-icon-color: @B2-N1;
-@nav-bar-icon-margin: 0;
-@nav-bar-text-color: @B2-N1;
-@nav-bar-text-font-size: @font-size-lg;
-@nav-bar-title-font-size: @font-size-lg;
-@nav-bar-title-font-weight: 600;
-@nav-bar-title-text-color: @B2-N1;
-@nav-bar-home-font-size: 22px;
-@nav-bar-home-font-weight: 600;
-@nav-bar-home-text-color: @B2-N1;
-
-// NoticeBar
-@notice-bar-height: 40px;
-@notice-bar-padding: 0 @padding-md;
-@notice-bar-wrapable-padding: @padding-xs @padding-md;
-@notice-bar-font-size: @font-size-sm;
-@notice-bar-text-color: @B6-N3;
-@notice-bar-line-height: 14px;
-@notice-bar-background-color: #e7f3fe;
-@notice-bar-background-warning-color: #fff5e5;
-@notice-bar-background-error-color: #fdeded;
-@notice-bar-right-icon-color: rgba(0, 0, 0, 0.2);
-@notice-bar-info-color: #1989fa;
-@notice-bar-warning-color: #ffa000;
-@notice-bar-error-color: #f04c4c;
-@notice-bar-icon-size: 16px;
-@notice-bar-btn-color: @M4;
-@notice-bar-left-icon-margin-right: 8px;
-@notice-bar-right-icon-margin-left: 8px;
-
-// Notify
-@notify-padding: 6px 15px;
-@notify-font-size: 14px;
-@notify-line-height: 20px;
-@notify-primary-background-color: @blue;
-@notify-success-background-color: @green;
-@notify-danger-background-color: @red;
-@notify-warning-background-color: @orange;
-
-// Overlay
-@overlay-background-color: rgba(0, 0, 0, 0.7);
-
-// Picker
-@picker-background-color: @B4;
-@picker-padding: @padding-md;
-@picker-toolbar-height: 44px;
-@picker-title-font-size: @font-size-lg;
-@picker-action-padding: 0 @padding-md;
-@picker-action-font-size: @font-size-md;
-@picker-confirm-action-color: @text-link-color;
-@picker-cancel-action-color: @gray-6;
-@picker-option-font-size: @font-size-lg;
-@picker-option-unit-font-size: @font-size-sm;
-@picker-option-text-color: @B6-N3;
-@picker-option-unit-text-color: @B6-N4;
-@picker-loading-icon-color: @blue;
-@picker-loading-mask-color: @picker-background-color;
-@picker-option-disabled-opacity: 0.3;
-@picker-option-selected-text-color: @B6-N1;
-
-// Popup
-@popup-background-color: @B4;
-@popup-round-border-radius: 16px;
-@popup-close-icon-size: 24px;
-@popup-close-icon-color: @gray-6;
-@popup-close-icon-margin: 12px;
-@popup-close-icon-z-index: 1;
-
-// Progress
-@progress-height: 4px;
-@progress-background-color: @gray-3;
-@progress-pivot-padding: 0 5px;
-@progress-color: @blue;
-@progress-pivot-font-size: @font-size-xs;
-@progress-pivot-line-height: 1.6;
-@progress-pivot-background-color: @blue;
-@progress-pivot-text-color: @white;
-
-// Radio
-@radio-size: 24px;
-@radio-border-color: @B6-N6;
-@radio-border-radius: 4px;
-@radio-transition-duration: 0.2s;
-@radio-label-size: 12px;
-@radio-label-margin: 10px;
-@radio-label-color: @B6-N1;
-@radio-checked-icon-color: @M4;
-@radio-disabled-label-color: @B6-N5;
-@radio-disabled-opacity: @disabled-opacity;
-
-// Rate
-@rate-horizontal-padding: 2px;
-@rate-icon-size: 20px;
-@rate-icon-void-color: @gray-5;
-@rate-icon-full-color: @red;
-@rate-icon-disabled-color: @gray-5;
-@rate-icon-gutter: @padding-base;
-
-// Switch width height必须使用em单位，不能用px，switch内部宽高为计算得出
-@switch-width: 1.5338em;
-@switch-height: 0.867em;
-@switch-node-size: 0.867em;
-@switch-node-z-index: 1;
-@switch-node-background-color: @white;
-@switch-node-box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1),
-  0 3px 3px 0 rgba(0, 0, 0, 0.05);
-@switch-background-color: @B4-N6;
-@switch-on-background-color: @blue;
-@switch-transition-duration: 0.3s;
-@switch-disabled-opacity: 0.4;
-@switch-border: 0.08em solid rgba(0, 0, 0, 0.1);
-
-// Search
-@search-background-color: @B3;
-@search-body-background-color: @B4-N9;
-@search-padding: 12px @padding-md;
-@search-input-height: 24px;
-@search-label-padding: 0 5px;
-@search-label-color: @B4-N1;
-@search-label-font-size: @font-size-md;
-@search-value-font-size: @font-size-md;
-@search-left-icon-color: @B4-N4;
-@search-action-padding: 0 @padding-md 0 @padding-sm;
-@search-action-text-color: @B4-N3;
-@search-action-font-size: @font-size-md;
-@search-submit-font-size: @font-size-md;
-@search-submit-color: @M1;
-@search-btn-hover-color: @B4-N9;
-@search-submit-line-width: 1px;
-@search-submit-line-height: 12px;
-@search-btn-hover-opacity: 0.4;
-
-// Sidebar
-@sidebar-width: 80px;
-
-// SidebarItem
-@sidebar-font-size: @font-size-md;
-@sidebar-line-height: 20px;
-@sidebar-text-color: @B6-N1;
-@sidebar-disabled-text-color: @B6-N5;
-@sidebar-padding: 20px @padding-sm 20px @padding-xs;
-@sidebar-active-color: @B6;
-@sidebar-background-color: @B1;
-@sidebar-selected-font-weight: @font-weight-bold;
-@sidebar-selected-text-color: @B6-N1;
-@sidebar-selected-border-color: @red;
-@sidebar-selected-background-color: @B6;
-
-// Slider
-@slider-active-background-color: @blue;
-@slider-inactive-background-color: @gray-3;
-@slider-disabled-opacity: @disabled-opacity;
-@slider-bar-height: 2px;
-@slider-button-width: 24px;
-@slider-button-height: 24px;
-@slider-button-border-radius: 50%;
-@slider-button-background-color: @white;
-@slider-button-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
-@slider-thumb-color: @B3;
-
-// Step
-@step-text-color: @gray-6;
-@step-process-text-color: @text-color;
-@step-font-size: @font-size-md;
-@step-line-color: @border-color;
-@step-finish-line-color: @green;
-@step-finish-text-color: @text-color;
-@step-icon-size: 12px;
-@step-circle-size: 5px;
-@step-circle-color: @gray-6;
-@step-horizontal-title-font-size: @font-size-sm;
-@stepper-container-background-color: @B6-N9;
-// Steps
-@steps-background-color: @B3;
-
-// Stepper
-@stepper-background-border-radius: @border-radius-lg;
-@stepper-padding: 2px;
-@stepper-active-color: #e8e8e8;
-@stepper-background-color: @B6;
-@stepper-button-icon-color: @B6-N3;
-@stepper-button-border: 0;
-@stepper-button-disabled-color: none;
-@stepper-button-disabled-icon-color: @B6-N7;
-@stepper-button-round-theme-color: @red;
-@stepper-btn-width: 44px;
-@stepper-btn-height: 28px;
-@stepper-input-width: 50px;
-@stepper-input-height: 28px;
-@stepper-input-font-size: @font-size-lg;
-@stepper-input-line-height: normal;
-@stepper-input-text-color: @B6-N1;
-@stepper-input-disabled-text-color: @B6-N7;
-// @stepper-input-disabled-background-color: @active-color;
-@stepper-border-radius: 8px;
-@stepper-button-icon-font-size: 22px;
-
-// Tabbar
-@tabbar-height: 55px;
-@tabbar-background-color: @B5;
-@tabbar-border-color: @B6-N7;
-
-// TabbarItem
-@tabbar-item-font-size: @font-size-sm;
-@tabbar-item-disabled-opacity: 0.7;
-@tabbar-item-text-color: @B6-N5;
-@tabbar-item-active-color: @M1;
-@tabbar-item-line-height: 1;
-@tabbar-item-icon-size: 22px;
-@tabbar-item-margin-bottom: 4px;
-
-// Tab
-@tab-panel-background-color: var(--app-B3);
-@tab-panel-text-color: var(--app-B3-N1);
-@tab-text-color: @B6-N3;
-@tab-active-text-color: @B6-N1;
-@tab-disabled-text-color: @B6-N7;
-@tab-font-size: 13px;
-
-// Tabs
-@tabs-card-background-color: @B6-N9;
-@tabs-background-color: @B3;
-@tabs-default-color: @M4;
-@tabs-line-height: 32px;
-@tabs-sub-line-height: 64px;
-@tabs-bottom-bar-height: 3px;
-@tabs-bottom-bar-color: @tabs-default-color;
-@tabs-card-text-color: @B6-N3;
-@tabs-card-text-active-color: @B6-N1;
-@tabs-card-height: 32px;
-@tabs-card-border-radius: 8px;
-@tabs-card-active-border-radius: 6px;
-@tabs-card-active-background-color: @B3;
-@tabs-card-active-top: 0;
-@tabs-card-active-left: 0;
-@tabs-card-padding: 2px;
-
-// Tag
-@tag-padding: @padding-mb @padding-xs;
-@tag-text-color: @white;
-@tag-border-radius: 4px;
-@tag-line-height: 17px;
-@tag-medium-line-height: 20px;
-@tag-large-line-height: 22px;
-@tag-font-size: @font-size-sm;
-@tag-medium-font-size: @font-size-md;
-@tag-large-font-size: @font-size-lg;
-@tag-round-border-radius: @border-radius-max;
-@tag-danger-color: @red;
-@tag-primary-color: @blue;
-@tag-success-color: @green;
-@tag-warning-color: @orange;
-@tag-default-color: @gray-6;
-@tag-plain-background-color: transparent;
-
-// Toast
-@toast-max-width: 70%;
-@toast-font-size: 14px;
-@toast-text-color: @white;
-@toast-line-height: 20px;
-@toast-border-radius: @border-radius-lg;
-@toast-background-color: fade(@black, 70%);
-@toast-icon-size: 36px;
-@toast-text-min-width: 96px;
-@toast-text-padding: @padding-xs @padding-sm;
-@toast-default-padding: @padding-md;
-@toast-default-width: 88px;
-@toast-default-min-height: 88px;
-
-// GridItem
-@grid-item-content-padding: @padding-md @padding-xs;
-@grid-item-content-background-color: @B3;
-@grid-item-content-active-color: @active-color;
-@grid-item-icon-size: 26px;
-@grid-item-text-color: @B6-N2;
-@grid-item-text-font-size: @font-size-sm;
-
-// Divider
-@divider-margin: @padding-md 0;
-@divider-text-color: @gray-6;
-@divider-font-size: @font-size-md;
-@divider-line-height: 24px;
-@divider-border-color: @border-color;
-@divider-content-padding: @padding-md;
-@divider-content-left-width: 10%;
-@divider-content-right-width: 10%;
-
-// Empty
-@empty-image-height: 180px;
-@empty-image-width: 180px;
-@empty-title-color: @B6-N1;
-@empty-title-font-weight: normal;
-@empty-title-font-size: 16px;
-@empty-title-line-height: 24px;
-@empty-title-margin-top: 7px;
-@empty-description-color: @B4-N3;
-@empty-description-font-size: 14px;
-@empty-description-font-weight: normal;
-@empty-description-line-height: 20px;
-@empty-description-margin-top: @padding-base;
-@empty-bottom-margin-top: 24px;
-
-// TreeSelect
-@tree-select-font-color: @B6-N1;
-@tree-select-font-size: @font-size-md;
-@tree-select-nav-background-color: @B3;
-@tree-select-content-background-color: @B3;
-@tree-select-nav-item-padding: @padding-sm @padding-xs @padding-sm @padding-sm;
-@tree-select-item-height: 44px;
-@tree-select-item-active-color: @red;
-@tree-select-item-disabled-color: @B6-N4;
-
-// DropdownMenu
-@dropdown-menu-height: 46px;
-@dropdown-menu-background-color: @B3;
-@dropdown-menu-title-font-size: 14px;
-@dropdown-menu-title-triangle-size: 12px;
-@dropdown-menu-title-triangle-margin-left: 4px;
-@dropdown-menu-item-title-font-size: 14px;
-@dropdown-menu-item-title-font-weight: normal;
-@dropdown-menu-item-title-line-height: 28px;
-@dropdown-menu-item-line-color: @border-color;
-@dropdown-menu-item-first-line-color: rgba(0, 0, 0, 0.08);
-@dropdown-menu-item-line-width: @border-width-base;
-@dropdown-menu-item-icon-font-size: 28px;
-@dropdown-menu-item-title-active-font-weight: @font-weight-bold;
-@dropdown-menu-title-text-color: @B6-N1;
-@dropdown-menu-title-active-text-color: @M1;
-@dropdown-menu-title-disabled-text-color: @B6-N4;
-@dropdown-menu-title-padding: 0 @padding-lg 0 @padding-xs;
-@dropdown-menu-title-line-height: 18px;
-@dropdown-menu-option-active-color: @M1;
-
-// IndexAnchor
-@index-anchor-padding: 0 @padding-md;
-@index-anchor-text-color: @B6-N1;
-@index-anchor-font-weight: 500;
-@index-anchor-font-size: @font-size-md;
-@index-anchor-line-height: 32px;
-@index-anchor-background-color: transparent;
-@index-anchor-active-background-color: @B3;
-@index-anchor-active-text-color: @M1;
-
-// IndexBar
-@index-bar-index-font-size: @font-size-xs;
-@index-bar-index-line-height: 14px;
-
-// skeleton
-@skeleton-padding: 0 @padding-md;
-@skeleton-row-height: 16px;
-@skeleton-row-background-color: @B3;
-@skeleton-row-margin-top: @padding-sm;
-@skeleton-avatar-background-color: @B3;
-@skeleton-animation-duration: 1.2s;
-
-// Cascader
-@cascader-header-height: 48px;
-@cascader-header-padding: 0 16px;
-@cascader-title-font-size: 16px;
-@cascader-title-line-height: 20px;
-@cascader-close-icon-size: 22px;
-@cascader-close-icon-color: #c8c9cc;
-@cascader-selected-icon-size: 18px;
-@cascader-tabs-height: 48px;
-@cascader-active-color: @blue;
-@cascader-options-height: 384px;
-@cascader-option-disabled-color: #c8c9cc;
-@cascader-tab-color: @B6-N1;
-@cascader-unselected-tab-color: #969799;
-@cascader-tab-inactive-color: @B6-N5;
-@cascader-text-color: @B6-N5;
-
-// CustomKeyboard
-@custom-keyboard-bg-color: @B6;
-@custom-keyboard-text-color: @B6-N2;
-@custom-keyboard-border-color: @B6-N7;
-@custom-keyboard-placeholder-color: @B6-N6;
-@custom-keyboard-popup-bg-color: @B6-N6;
-@custom-keyboard-popup-item-color: @B6;
-@custom-keyboard-popup-confirm-color: @M3;
-@custom-keyboard-popup-text-color: @B6-N2;
-@custom-keyboard-popup-hover-color: @B6-N7;
-
-@hairline-top-width: 1px;
-@hairline-left-width: 1px;
-@hairline-right-width: 1px;
-@hairline-bottom-width: 1px;
-@hairline-surround-width: 1px;
-@hairline-top-bottom-width: 1px 0;
-@hairline-color: var(--hairline-color, @B6-N7);
-
-// Popover
-@popover-background-color: @B4;
-@popover-box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.1);
-@popover-padding: 12px;
-@popover-border-radius: 12px;