diff --git a/packages/theme/src/action-menu/vars.less b/packages/theme/src/action-menu/vars.less index 4ad2e1c195..d9df05c754 100644 --- a/packages/theme/src/action-menu/vars.less +++ b/packages/theme/src/action-menu/vars.less @@ -12,13 +12,13 @@ .component-css-vars-action-menu() { // 按钮文本字重 - --ti-action-menu-font-weight: var(--ti-common-font-weight-normal); + --ti-action-menu-font-weight: var(--ti-common-font-weight-normal, 400); // 按钮文本装饰 --ti-action-menu-hover-text-decoration: underline; // 更多...图标的宽度 - --ti-action-menu-more-icon-width: var(--ti-common-size-4x); + --ti-action-menu-more-icon-width: var(--ti-common-size-4x, 16px); // 更多...图标的高度 - --ti-action-menu-more-icon-height: var(--ti-common-size-4x); + --ti-action-menu-more-icon-height: var(--ti-common-size-4x, 16px); // 更多...图标的右边外边距 --ti-action-menu-more-icon-margin-right: var(--ti-common-space-0, 0px); // 下拉触发源文本颜色 @@ -30,11 +30,11 @@ // 分割线颜色 --ti-action-menu-item-line-bg-color: transparent; // 分割线宽度 - --ti-action-menu-item-line-width: var(--ti-common-space-0); + --ti-action-menu-item-line-width: var(--ti-common-space-0, 0px); // 下拉菜单项悬浮背景色 --ti-action-menu-item-hover-bg-color: transparent; // 下拉菜单项文本悬浮色 - --ti-action-menu-item-hover-text-color: var(--ti-common-color-text-link); + --ti-action-menu-item-hover-text-color: var(--ti-common-color-text-link, #1476ff); // 下拉菜单项图标悬浮色 --ti-action-menu-item-hover-icon-color: var(--ti-common-color-text-link-hover, #1476ff); // 没有这个颜色的图标色 // 下拉菜单项图标顶部内边距 @@ -46,7 +46,7 @@ // 下拉菜单项图标左侧内边距 --ti-action-menu-item-svg-margin-left: var(--ti-common-space-0, 0px); // 下拉菜单卡片模式字体颜色 - --ti-action-menu-item-card-text-color: var(--ti-common-color-text-primary); + --ti-action-menu-item-card-text-color: var(--ti-common-color-text-primary, #191919); // 下拉菜单卡片模式字体颜色 - --ti-action-menu-item-card-hover-text-color: var(--ti-common-color-text-primary); + --ti-action-menu-item-card-hover-text-color: var(--ti-common-color-text-primary, #191919); } diff --git a/packages/theme/src/alert/vars.less b/packages/theme/src/alert/vars.less index f20133283f..4a7bc37908 100644 --- a/packages/theme/src/alert/vars.less +++ b/packages/theme/src/alert/vars.less @@ -23,31 +23,31 @@ 'Microsoft JhengHei' ); // 边框厚度(new) - --ti-alert-border-weight: var(--ti-common-size-0); + --ti-alert-border-weight: var(--ti-common-size-0, 0px); // 描述字号 - --ti-alert-description-font-size: var(--ti-common-font-size-base, 12px); + --ti-alert-description-font-size: var(--ti-common-font-size-base, 14px); // 默认关闭图标固定定位顶部距离(hide) - --ti-alert-close-position-top: var(--ti-common-space-3x); + --ti-alert-close-position-top: var(--ti-common-space-3x, 12px); // 默认关闭图标字号 - --ti-alert-close-font-size: var(--ti-common-font-size-2); + --ti-alert-close-font-size: var(--ti-common-font-size-2, 16px); // 自定义关闭文字字号 - --ti-alert-close-text-font-size: var(--ti-common-font-size-base, 12px); + --ti-alert-close-text-font-size: var(--ti-common-font-size-base, 14px); // 组件圆角 - --ti-alert-border-radius: var(--ti-common-border-radius-4); + --ti-alert-border-radius: var(--ti-common-border-radius-4, 8px); // 标题文本色 - --ti-alert-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-alert-title-text-color: var(--ti-common-color-text-primary, #191919); // success类型标题文本色 - --ti-alert-success-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-alert-success-title-text-color: var(--ti-common-color-text-primary, #191919); // info类型标题文本色 - --ti-alert-info-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-alert-info-title-text-color: var(--ti-common-color-text-primary, #191919); // warning类型标题文本色 - --ti-alert-warning-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-alert-warning-title-text-color: var(--ti-common-color-text-primary, #191919); // error类型标题文本色 - --ti-alert-error-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-alert-error-title-text-color: var(--ti-common-color-text-primary, #191919); // simple类型标题文本色 - --ti-alert-simple-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-alert-simple-title-text-color: var(--ti-common-color-text-primary, #191919); // 标题字号 - --ti-alert-title-font-size: var(--ti-common-font-size-2); + --ti-alert-title-font-size: var(--ti-common-font-size-2, 16px); // 标题图标字号 --ti-alert-icon-font-size: var(--ti-common-font-size-2, 16px); // 描述内容行高 @@ -57,100 +57,100 @@ // 描述内容水平内边距 --ti-alert-normal-content-padding-horizontal: var(--ti-common-space-2x, 8px); // 描述内容提示内容顶部外边距 - --ti-alert-description-margin-top: var(--ti-common-space-base); + --ti-alert-description-margin-top: var(--ti-common-space-base, 4px); // 描述内容提示内容底部外边距 - --ti-alert-description-margin-bottom: var(--ti-common-space-0); + --ti-alert-description-margin-bottom: var(--ti-common-space-0, 0px); // 描述默认文本色 - --ti-alert-description-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-alert-description-text-color: var(--ti-common-color-text-secondary, #595959); // 默认顶部内边距 - --ti-alert-normal-padding-top: calc(var(--ti-common-space-2x) + 1.5px); + --ti-alert-normal-padding-top: calc(var(--ti-common-space-2x, 8px) + 1.5px); // 默认右内边距 - --ti-alert-normal-padding-right: var(--ti-common-space-4x); + --ti-alert-normal-padding-right: var(--ti-common-space-4x, 16px); // 默认底部内边距 - --ti-alert-normal-padding-bottom: calc(var(--ti-common-space-2x) + 1.5px); + --ti-alert-normal-padding-bottom: calc(var(--ti-common-space-2x, 8px) + 1.5px); // 默认左内边距 --ti-alert-normal-padding-left: var(--ti-common-space-4x, 16px); // 默认垂直外边距 - --ti-alert-normal-margin-vertical: var(--ti-common-space-4x); + --ti-alert-normal-margin-vertical: var(--ti-common-space-4x, 16px); // 默认水平外边距 --ti-alert-normal-margin-horizontal: var(--ti-common-space-0, 0px); // large尺寸顶部内边距 - --ti-alert-large-padding-top: var(--ti-common-space-4x); + --ti-alert-large-padding-top: var(--ti-common-space-4x, 16px); // large尺寸底部内边距 - --ti-alert-large-padding-bottom: var(--ti-common-space-4x); + --ti-alert-large-padding-bottom: var(--ti-common-space-4x, 16px); // large尺寸左内边距 --ti-alert-large-padding-left: var(--ti-common-space-4x, 16px); // large尺寸右内边距 - --ti-alert-large-padding-right: var(--ti-common-space-4x); + --ti-alert-large-padding-right: var(--ti-common-space-4x, 16px); // large尺寸操作文本色 - --ti-alert-opration-text-color: var(--ti-common-color-text-highlight, #526ecc); + --ti-alert-opration-text-color: var(--ti-common-color-text-highlight, #1476ff); // large尺寸操作字号 - --ti-alert-opration-font-size: var(--ti-common-font-size-base, 12px); + --ti-alert-opration-font-size: var(--ti-common-font-size-base, 14px); // large尺寸图标字号 - --ti-alert-large-icon-font-size: var(--ti-common-font-size-4, 24px); + --ti-alert-large-icon-font-size: var(--ti-common-font-size-4, 20px); // large尺寸描述内容左内边距 - --ti-alert-large-content-padding-left: var(--ti-common-space-2x); + --ti-alert-large-content-padding-left: var(--ti-common-space-2x, 8px); // 大尺寸关闭图标字号 --ti-alert-large-close-font-size: var(--ti-alert-close-font-size); // warning类型边框色 - --ti-alert-warning-border-color: var(--ti-common-color-warn-border, #ffd0a6); + --ti-alert-warning-border-color: var(--ti-common-color-warn-border, #ffebd1); // warning类型图标色 - --ti-alert-warning-icon-color: var(--ti-common-color-warn, #fa9841); + --ti-alert-warning-icon-color: var(--ti-common-color-warn, #ff8800); // warning类型链接色(hide) - --ti-alert-warning-link-text-color: var(--ti-common-color-warn-text, #e37d29); + --ti-alert-warning-link-text-color: var(--ti-common-color-warn-text, #ff8800); // warning类型背景色 - --ti-alert-warning-bg-color: var(--ti-common-color-warn-bg, #fff3e8); + --ti-alert-warning-bg-color: var(--ti-common-color-warn-bg, #ffebd1); // warning类型关闭图标色 - --ti-alert-warning-close-icon-color: var(--ti-common-color-text-weaken); + --ti-alert-warning-close-icon-color: var(--ti-common-color-text-weaken, #808080); // warning类型悬浮关闭图标色 - --ti-alert-warning-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover); + --ti-alert-warning-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover, #7693f5); // error类型边框色 - --ti-alert-error-border-color: var(--ti-common-color-error-border-secondary, #ffbcba); + --ti-alert-error-border-color: var(--ti-common-color-error-border-secondary, #fce3e1); // error类型图标色 - --ti-alert-error-icon-color: var(--ti-common-color-error, #f66f6a); + --ti-alert-error-icon-color: var(--ti-common-color-error, #f23030); // error类型链接色(hide) - --ti-alert-error-link-text-color: var(--ti-common-color-error-text, #de504e); + --ti-alert-error-link-text-color: var(--ti-common-color-error-text, #f23030); // error类型背景色 - --ti-alert-error-bg-color: var(--ti-common-color-error-bg, #ffeeed); + --ti-alert-error-bg-color: var(--ti-common-color-error-bg, #fce3e1); // error类型关闭图标色 - --ti-alert-error-close-icon-color: var(--ti-common-color-text-weaken); + --ti-alert-error-close-icon-color: var(--ti-common-color-text-weaken, #808080); // error类型悬浮关闭图标色 - --ti-alert-error-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover); + --ti-alert-error-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover, #7693f5); // success类型边框色 - --ti-alert-success-border-color: var(--ti-common-color-success-border, #acf2dc); + --ti-alert-success-border-color: var(--ti-common-color-success-border, #e6f2d5); // success类型图标色 - --ti-alert-success-icon-color: var(--ti-common-color-success, #50d4ab); + --ti-alert-success-icon-color: var(--ti-common-color-success, #5cb300); // success类型链接色(hide) - --ti-alert-success-link-text-color: var(--ti-common-color-text-success, #3ac295); + --ti-alert-success-link-text-color: var(--ti-common-color-text-success, #5cb300); // success类型背景色 - --ti-alert-success-bg-color: var(--ti-common-color-success-bg, #edfff9); + --ti-alert-success-bg-color: var(--ti-common-color-success-bg, #e6f2d5); // success类型关闭图标色 - --ti-alert-success-close-icon-color: var(--ti-common-color-text-weaken); + --ti-alert-success-close-icon-color: var(--ti-common-color-text-weaken, #808080); // success类型悬浮关闭图标色 - --ti-alert-success-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover); + --ti-alert-success-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover, #7693f5); // info类型边框色 - --ti-alert-info-border-color: var(--ti-common-color-prompt-border, #beccfa); + --ti-alert-info-border-color: var(--ti-common-color-prompt-border, #deecff); // info类型图标色 - --ti-alert-info-icon-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-alert-info-icon-color: var(--ti-common-color-prompt, #1476ff); // info类型链接色(hide) - --ti-alert-info-link-text-color: var(--ti-common-color-prompt-text, #526ecc); + --ti-alert-info-link-text-color: var(--ti-common-color-prompt-text, #1476ff); // info类型背景色 - --ti-alert-info-bg-color: var(--ti-common-color-prompt-bg, #ebf6ff); + --ti-alert-info-bg-color: var(--ti-common-color-prompt-bg, #deecff); // info类型关闭图标色 - --ti-alert-info-close-icon-color: var(--ti-common-color-text-weaken); + --ti-alert-info-close-icon-color: var(--ti-common-color-text-weaken, #808080); // info类型悬浮关闭图标色 - --ti-alert-info-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover); + --ti-alert-info-close-hover-icon-color: var(--ti-common-color-icon-darkbg-hover, #7693f5); // simple类型边框色 --ti-alert-simple-border-color: var(--ti-common-color-info-border, #d3d4d6); // simple类型图标色 --ti-alert-simple-icon-color: #808080; // simple类型链接色(hide) - --ti-alert-simple-link-text-color: var(--ti-common-color-primary-active, #7693f5); + --ti-alert-simple-link-text-color: var(--ti-common-color-primary-active, #595959); // simple类型背景色 - --ti-alert-simple-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-alert-simple-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // simple类型关闭图标色 --ti-alert-simple-close-icon-color: var(--ti-alert-simple-icon-color); // simple类型悬浮关闭图标色 diff --git a/packages/theme/src/amount/vars.less b/packages/theme/src/amount/vars.less index 9bd82922cd..7be9b76293 100644 --- a/packages/theme/src/amount/vars.less +++ b/packages/theme/src/amount/vars.less @@ -11,6 +11,6 @@ */ .component-css-vars-amount() { - --ti-amount-icon-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-amount-icon-color: var(--ti-base-color-brand-6, #191919); --ti-amount-icon-font-size: var(--ti-common-font-size-1, 14px); } diff --git a/packages/theme/src/autocomplete/vars.less b/packages/theme/src/autocomplete/vars.less index 313490dd8d..6ffab3ca9a 100644 --- a/packages/theme/src/autocomplete/vars.less +++ b/packages/theme/src/autocomplete/vars.less @@ -12,31 +12,31 @@ .component-css-vars-autocomplete() { // 下拉框边框圆角 - --ti-autocomplete-suggestion-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-autocomplete-suggestion-border-radius: var(--ti-common-border-radius-normal, 6px); // 下拉框边框色 --ti-autocomplete-suggestion-border-color: var(--ti-common-color-transparent, transparent); // 下拉框背景色 - --ti-autocomplete-suggestion-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-autocomplete-suggestion-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 下拉框列表项横向填充长度 - --ti-autocomplete-li-padding-horizontal: var(--ti-common-size-4x); + --ti-autocomplete-li-padding-horizontal: var(--ti-common-size-4x, 16px); // 下拉框列表项竖向填充长度 --ti-autocomplete-li-padding-vertical: 5px; // 下拉框列表项的文本色 - --ti-autocomplete-li-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-autocomplete-li-text-color: var(--ti-common-color-text-primary, #191919); // 下拉框列表项字号 - --ti-autocomplete-li-font-size: var(--ti-common-font-size-base, 12px); + --ti-autocomplete-li-font-size: var(--ti-common-font-size-base, 14px); // 下拉框列表项的悬浮背景色 - --ti-autocomplete-li-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-autocomplete-li-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); // 下拉框列表选中项的背景色 - --ti-autocomplete-li-select-bg-color: var(--ti-common-color-selected-background, #5e7ce0); + --ti-autocomplete-li-select-bg-color: var(--ti-common-color-selected-background, #f5f5f5); // 下拉框列表选中项的文本色 - --ti-autocomplete-li-selected-text-color: var(--ti-common-color-selected-text-color, #fff); + --ti-autocomplete-li-selected-text-color: var(--ti-common-color-selected-text-color, #191919); // 每项的分配者的边框色（没有效果） --ti-autocomplete-li-divider-border-color: var(--ti-common-color-dark, #000); // 下拉框列表项行高 --ti-autocomplete-li-height: 22px; // 加载图标色（没有效果 - --ti-autocomplete-loading-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-autocomplete-loading-text-color: var(--ti-common-color-placeholder, #808080); // 下拉框面板与输入框的间隙 - --ti-autocomplete-dropdown-gap: var(--ti-common-dropdown-gap); + --ti-autocomplete-dropdown-gap: var(--ti-common-dropdown-gap, 4px); } diff --git a/packages/theme/src/badge/vars.less b/packages/theme/src/badge/vars.less index 3218707dde..5af728ee94 100644 --- a/packages/theme/src/badge/vars.less +++ b/packages/theme/src/badge/vars.less @@ -11,21 +11,21 @@ */ .component-css-vars-badge() { - --ti-badge-size: var(--ti-common-font-size-2); - --ti-badge-font-size: var(--ti-common-font-size-0); - --ti-badge-line-height: calc(var(--ti-common-line-height-base) - 4px); - --ti-badge-font-weight: var(--ti-common-font-weight-normal); - --ti-badge-border-radius: var(--ti-common-border-radius-4); - --ti-badge-text-color: var(--ti-base-color-bg-7); - --ti-badge-bg-color: var(--ti-base-color-error); - --ti-badge-link-hover-text-color: var(--ti-common-color-light, #fff); - --ti-badge-active-text-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-badge-active-bg-color: var(--ti-common-color-light, #fff); - --ti-badge-primary-bg-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-badge-success-bg-color: var(--ti-common-color-success-normal, #50d4ab); - --ti-badge-warning-bg-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-badge-size: var(--ti-common-font-size-2, 16px); + --ti-badge-font-size: var(--ti-common-font-size-0, 12px); + --ti-badge-line-height: calc(var(--ti-common-line-height-base, 18px) - 4px); + --ti-badge-font-weight: var(--ti-common-font-weight-normal, 400); + --ti-badge-border-radius: var(--ti-common-border-radius-4, 8px); + --ti-badge-text-color: var(--ti-base-color-bg-7, #ffffff); + --ti-badge-bg-color: var(--ti-base-color-error, #f23030); + --ti-badge-link-hover-text-color: var(--ti-common-color-light, #ffffff); + --ti-badge-active-text-color: var(--ti-base-color-brand-6, #191919); + --ti-badge-active-bg-color: var(--ti-common-color-light, #ffffff); + --ti-badge-primary-bg-color: var(--ti-base-color-brand-6, #191919); + --ti-badge-success-bg-color: var(--ti-common-color-success-normal, #5cb300); + --ti-badge-warning-bg-color: var(--ti-common-color-warning-normal, #ff8800); --ti-badge-danger-bg-color: var(--ti-base-color-error-3, #f66f6a); - --ti-badge-info-bg-color: var(--ti-common-color-info-normal, #252b3a); - --ti-badge-border: var(--ti-common-border-weight-normal); + --ti-badge-info-bg-color: var(--ti-common-color-info-normal, #191919); + --ti-badge-border: var(--ti-common-border-weight-normal, 1px); --ti-badge-margin-left: 0; } diff --git a/packages/theme/src/base-select/vars.less b/packages/theme/src/base-select/vars.less index f8c3f6449a..dfbb89f783 100644 --- a/packages/theme/src/base-select/vars.less +++ b/packages/theme/src/base-select/vars.less @@ -12,31 +12,31 @@ .component-css-vars-select() { // 输入框悬浮时的边框色(hide) - --ti-select-inner-border-color-active: var(--ti-common-color-line-active, #5e7ce0); + --ti-select-inner-border-color-active: var(--ti-common-color-line-active, #191919); // 可搜索输入框文本色 - --ti-select-input-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-select-input-text-color: var(--ti-common-color-text-primary, #191919); // 选择器输入框字号(hide) - --ti-select-input-font-size: var(--ti-common-font-size-base, 12px); + --ti-select-input-font-size: var(--ti-common-font-size-base, 14px); // 选择器尾部图标距离输入框的垂直距离 - --ti-select-input-icon-top: var(--ti-common-space-4x); + --ti-select-input-icon-top: var(--ti-common-space-4x, 16px); // 中型选择器尾部图标距离输入框的垂直距离 --ti-select-input-icon-top-medium: var(--ti-common-space-5x, 20px); // 小型选择器尾部图标距离输入框的垂直距离 - --ti-select-input-icon-top-small: var(--ti-common-space-4x); + --ti-select-input-icon-top-small: var(--ti-common-space-4x, 16px); // 迷你型选择器尾部图标距离输入框的垂直距离 - --ti-select-input-icon-top-mini: var(--ti-common-space-3x); + --ti-select-input-icon-top-mini: var(--ti-common-space-3x, 12px); // 选择器输入框尾部图标的颜色 - --ti-select-input-caret-icon-color: var(--ti-common-color-icon-normal); + --ti-select-input-caret-icon-color: var(--ti-common-color-icon-normal, #808080); // 选择器输入框尾部图标悬浮时的颜色 - --ti-select-input-caret-hover-icon-color: var(--ti-common-color-icon-graybg-hover); + --ti-select-input-caret-hover-icon-color: var(--ti-common-color-icon-graybg-hover, #191919); // 选择器输入框尾部图标的尺寸 - --ti-select-input-caret-font-size: var(--ti-common-font-size-2); + --ti-select-input-caret-font-size: var(--ti-common-font-size-2, 16px); // 选择器输入框尾部关闭图标右侧外边距 --ti-select-input-icon-close-margin-right: var(--ti-common-space-0, 0px); // 选择器输入框尾部图标禁用时的颜色（hide） - --ti-select-input-disabled-caret-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-select-input-disabled-caret-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 输入框禁用且悬浮时的边框色 - --ti-select-input-disabled-hover-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-select-input-disabled-hover-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 选择器输入框高度（hide） --ti-select-input-height: var(--ti-common-size-6x, 24px); // 迷你型选择器输入框高度（hide） @@ -46,23 +46,23 @@ // 中型选择器输入框高度（hide） --ti-select-input-medium-height: var(--ti-common-size-42); // 选择器多选标签容器的左侧内边距 - --ti-select-tags-wrap-padding-left: var(--ti-common-space-2); + --ti-select-tags-wrap-padding-left: var(--ti-common-space-2, 2px); // 选择器多选标签容器的顶部内边距 - --ti-select-tags-wrap-padding-top: var(--ti-common-space-2); + --ti-select-tags-wrap-padding-top: var(--ti-common-space-2, 2px); // 选择器多选标签容器的底部内边距 - --ti-select-tags-wrap-padding-bottom: var(--ti-common-space-2); + --ti-select-tags-wrap-padding-bottom: var(--ti-common-space-2, 2px); // 选择器多选标签容器的右侧内边距 --ti-select-tags-wrap-padding-right: var(--ti-common-space-0, 0px); // 选择器多选标签顶部外边距 - --ti-select-tags-margin-top: var(--ti-common-space-2); + --ti-select-tags-margin-top: var(--ti-common-space-2, 2px); // 选择器多选标签右侧外边距 - --ti-select-tags-margin-right: var(--ti-common-space-2); + --ti-select-tags-margin-right: var(--ti-common-space-2, 2px); // 选择器多选标签底部外边距 - --ti-select-tags-margin-bottom: var(--ti-common-space-2); + --ti-select-tags-margin-bottom: var(--ti-common-space-2, 2px); // 选择器多选标签左侧外边距 - --ti-select-tags-margin-left: var(--ti-common-space-2); + --ti-select-tags-margin-left: var(--ti-common-space-2, 2px); // 选择器多选标签单行的高度 - --ti-select-tags-height: var(--ti-common-space-8x); + --ti-select-tags-height: var(--ti-common-space-8x, 32px); // 选择器多选标签最大高度 --ti-select-tags-max-height: none; // 选择器后缀图标显示状态 @@ -70,11 +70,11 @@ // 选择器右侧图标间距 --ti-select-suffix-icon-margin-right: var(--ti-common-space-base, 4px); // 选择器suffix字号 - --ti-select-suffix-font-size: var(--ti-common-font-size-base, 12px); + --ti-select-suffix-font-size: var(--ti-common-font-size-base, 14px); // 收起按钮文本与图标色(hide) - --ti-select-collapse-button-text-icon-color: var(--ti-common-color-text-link); + --ti-select-collapse-button-text-icon-color: var(--ti-common-color-text-link, #1476ff); // 收起按钮图标左边距(hide) --ti-select-collapse-button-icon-margin-left: var(--ti-common-space-2, 2px); // 收起按钮字号(hide) - --ti-select-collapse-button-font-size: var(--ti-common-font-size-base, 12px); + --ti-select-collapse-button-font-size: var(--ti-common-font-size-base, 14px); } diff --git a/packages/theme/src/breadcrumb/vars.less b/packages/theme/src/breadcrumb/vars.less index 9007a52464..7c4723f9f8 100644 --- a/packages/theme/src/breadcrumb/vars.less +++ b/packages/theme/src/breadcrumb/vars.less @@ -12,7 +12,7 @@ .component-css-vars-breadcrumb() { // 字号 - --ti-breadcrumb-font-size: var(--ti-common-font-size-base); + --ti-breadcrumb-font-size: var(--ti-common-font-size-base, 14px); // 文本行高 --ti-breadcrumb-text-line-height: 22px; // 文本色 @@ -20,21 +20,21 @@ // 字族 --ti-breadcrumb-font-family: var(--ti-common-font-family, 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei'); // 分隔符填充色 - --ti-breadcrumb-separator-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-breadcrumb-separator-text-color: var(--ti-common-color-placeholder, #808080); // 分割箭头宽度 - --ti-breadcrumb-separator-width: var(--ti-common-size-4x); + --ti-breadcrumb-separator-width: var(--ti-common-size-4x, 16px); // 分隔图标的垂直外边距 --ti-breadcrumb-separator-margin-vertical: var(--ti-common-space-0, 0px); // 分隔图标的水平外边距 --ti-breadcrumb-separator-margin-horizontal: var(--ti-common-space-base, 4px); // 悬浮文本色 - --ti-breadcrumb-hover-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-breadcrumb-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 悬浮文本下划线 --ti-breadcrumb-hover-text-decoration: underline; // 当前节点字重 --ti-breadcrumb-text-font-weight: var(--ti-common-font-weight-7, bold); // 当前节点文本色 - --ti-breadcrumb-selected-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-breadcrumb-selected-text-color: var(--ti-common-color-text-primary, #191919); // 当前节点悬浮文本色 --ti-breadcrumb-selected-hover-text-color: var(--ti-breadcrumb-selected-text-color); } diff --git a/packages/theme/src/bulletin-board/vars.less b/packages/theme/src/bulletin-board/vars.less index 082681a63d..5c22573589 100644 --- a/packages/theme/src/bulletin-board/vars.less +++ b/packages/theme/src/bulletin-board/vars.less @@ -13,30 +13,30 @@ .component-css-vars-bulletin-board() { --ti-bulletin-board-title-font-size: var(--ti-common-font-size-3, 18px); --ti-bulletin-board-title-font-weight: var(--ti-common-font-weight-7, bold); - --ti-bulletin-board-title-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-bulletin-board-item-title-text-color: var(--ti-common-color-text-primary); - --ti-bulletin-board-item-title-text-margin-bottom: var(--ti-common-space-2x); - --ti-bulletin-board-tabs-item-hover-text-font-weight: var(--ti-common-font-weight-bold); - --ti-bulletin-board-item-title-font-weight: var(--ti-common-font-weight-bold); - --ti-bulletin-board-tabs-item-text-padding-right: var(--ti-common-space-0); - --ti-bulletin-board-contentr-padding-right: var(--ti-common-space-0); - --ti-bulletin-board-contentr-padding-button: var(--ti-common-space-0); - --ti-bulletin-board-new-padding-left: var(--ti-common-size-base); - --ti-bulletin-board-new-margin-left: var(--ti-common-space-6); + --ti-bulletin-board-title-text-color: var(--ti-common-color-info-normal, #191919); + --ti-bulletin-board-item-title-text-color: var(--ti-common-color-text-primary, #191919); + --ti-bulletin-board-item-title-text-margin-bottom: var(--ti-common-space-2x, 8px); + --ti-bulletin-board-tabs-item-hover-text-font-weight: var(--ti-common-font-weight-bold, 600); + --ti-bulletin-board-item-title-font-weight: var(--ti-common-font-weight-bold, 600); + --ti-bulletin-board-tabs-item-text-padding-right: var(--ti-common-space-0, 0px); + --ti-bulletin-board-contentr-padding-right: var(--ti-common-space-0, 0px); + --ti-bulletin-board-contentr-padding-button: var(--ti-common-space-0, 0px); + --ti-bulletin-board-new-padding-left: var(--ti-common-size-base, 4px); + --ti-bulletin-board-new-margin-left: var(--ti-common-space-6, 6px); --ti-bulletin-board-new-font-family: PingFangSC ,PingFangSC-Regular; - --ti-bulletin-board-item-margin-bottom: var(--ti-common-space-6x); - --ti-bulletin-board-item-date-text-color: var(--ti-common-color-placeholder, #adb0b8); - --ti-bulletin-board-item-date-font-size: var(--ti-common-font-size-base, 12px); - --ti-bulletin-board-new-bg-color: var(--ti-common-color-error-border-secondary); - --ti-bulletin-board-new-text-color: var(--ti-common-color-error-border); - --ti-bulletin-board-new-border-radius: var(--ti-common-border-radius-1); - --ti-bulletin-board-more-text-color: var(--ti-common-color-text-primary); - --ti-bulletin-board-more-hover-text-color: var(--ti-base-color-brand-5, #7693f5); - --ti-bulletin-board-more-font-size: var(--ti-common-font-size-base, 12px); + --ti-bulletin-board-item-margin-bottom: var(--ti-common-space-6x, 24px); + --ti-bulletin-board-item-date-text-color: var(--ti-common-color-placeholder, #808080); + --ti-bulletin-board-item-date-font-size: var(--ti-common-font-size-base, 14px); + --ti-bulletin-board-new-bg-color: var(--ti-common-color-error-border-secondary, #fce3e1); + --ti-bulletin-board-new-text-color: var(--ti-common-color-error-border, #f23030); + --ti-bulletin-board-new-border-radius: var(--ti-common-border-radius-1, 2px); + --ti-bulletin-board-more-text-color: var(--ti-common-color-text-primary, #191919); + --ti-bulletin-board-more-hover-text-color: var(--ti-base-color-brand-5, #c2c2c2); + --ti-bulletin-board-more-font-size: var(--ti-common-font-size-base, 14px); --ti-bulletin-board-more-icon-font-size: var(--ti-common-font-size-1, 14px); - --ti-bulletin-board-new-font-size: var(--ti-common-font-size-0); - --ti-bulletin-board-tabs-item-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-bulletin-board-tabs-item-hover-text-color: var(--ti-common-color-text-primary); - --ti-bulletin-board-tabs-item-disabled-text-color: var(--ti-common-color-placeholder, #adb0b8); - --ti-bulletin-board-tabs-header-border-color: var(--ti-common-color-border, #adb0b8); + --ti-bulletin-board-new-font-size: var(--ti-common-font-size-0, 12px); + --ti-bulletin-board-tabs-item-text-color: var(--ti-common-color-info-normal, #191919); + --ti-bulletin-board-tabs-item-hover-text-color: var(--ti-common-color-text-primary, #191919); + --ti-bulletin-board-tabs-item-disabled-text-color: var(--ti-common-color-placeholder, #808080); + --ti-bulletin-board-tabs-header-border-color: var(--ti-common-color-border, #999999); } diff --git a/packages/theme/src/button-group/vars.less b/packages/theme/src/button-group/vars.less index b625e78e60..7c070fa8c1 100644 --- a/packages/theme/src/button-group/vars.less +++ b/packages/theme/src/button-group/vars.less @@ -12,79 +12,79 @@ .component-css-vars-button-group() { // 按钮组边框色 - --ti-button-group-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-button-group-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 按钮组边框厚度 --ti-button-group-border-weight: var(--ti-common-size-0, 0px); // 按钮组圆角 - --ti-button-group-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-button-group-border-radius: var(--ti-common-border-radius-normal, 6px); // 小尺寸按钮组左右端侧圆角 --ti-button-group-mini-side-border-radius: var(--ti-button-group-mini-border-radius); // 按钮组第一个按钮右侧圆角 - --ti-button-group-right-border-radius: var(--ti-common-border-radius-normal); + --ti-button-group-right-border-radius: var(--ti-common-border-radius-normal, 6px); // 小尺寸按钮组第一个按钮右侧圆角 --ti-button-group-mini-right-border-radius: var(--ti-button-group-mini-border-radius, 0px); // 按钮组中间按钮圆角 - --ti-button-group-middle-border-radius: var(--ti-common-border-radius-normal); + --ti-button-group-middle-border-radius: var(--ti-common-border-radius-normal, 6px); // 按钮组最后一个按钮左侧圆角 - --ti-button-group-left-border-radius: var(--ti-common-border-radius-normal); + --ti-button-group-left-border-radius: var(--ti-common-border-radius-normal, 6px); // 小尺寸按钮组最后一个按钮左侧圆角 --ti-button-group-mini-left-border-radius: var(--ti-button-group-mini-border-radius, 0px); // 默认插槽尾部按钮的左边框色 - --ti-button-group-hover-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-button-group-hover-border-color: var(--ti-common-color-line-active, #191919); // 默认插槽按钮间分割线颜色 - --ti-button-group-info-border-color: var(--ti-common-color-light, #fff); + --ti-button-group-info-border-color: var(--ti-common-color-light, #ffffff); // 禁用色（没有使用） - --ti-button-group-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-button-group-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 默认按钮未选中项背景色 - --ti-button-group-item-bg-color: var(--ti-common-color-bg-normal); + --ti-button-group-item-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 按钮非选中项文本色 - --ti-button-group-item-btn-text-color: var(--ti-common-color-text-secondary); + --ti-button-group-item-btn-text-color: var(--ti-common-color-text-secondary, #595959); // 按钮项宽度 - --ti-button-group-item-btn-width: var(--ti-common-size-auto); + --ti-button-group-item-btn-width: var(--ti-common-size-auto, auto); // 未指定尺寸的按钮项高度 - --ti-button-group-item-btn-height: var(--ti-common-size-height-normal, 28px); + --ti-button-group-item-btn-height: var(--ti-common-size-height-normal, 32px); // 按钮组默认字号 - --ti-button-group-item-btn-font-size: var(--ti-common-font-size-base, 12px); + --ti-button-group-item-btn-font-size: var(--ti-common-font-size-base, 14px); // 按钮项禁用背景色 --ti-button-group-item-btn-disabled-bg-color: #F0F0F0; // 按钮项禁用边框色 - --ti-button-group-item-btn-disabled-border-color: var(--ti-common-color-border, #adb0b8); + --ti-button-group-item-btn-disabled-border-color: var(--ti-common-color-border, #999999); // 按钮项禁用文本色 - --ti-button-group-item-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-button-group-item-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 按钮选中项禁用文本色(new) - --ti-button-group-item-active-disabled-text-color: var(--ti-common-color-text-weaken); + --ti-button-group-item-active-disabled-text-color: var(--ti-common-color-text-weaken, #808080); // 默认按钮项悬浮背景色 --ti-button-group-item-btn-hover-bg-color: #DEECFF; // 按钮项悬浮边框色 - --ti-button-group-item-btn-hover-border-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-button-group-item-btn-hover-border-color: var(--ti-common-color-primary-hover, #595959); // 默认按钮非选中项悬浮文本色 - --ti-button-group-item-btn-hover-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-button-group-item-btn-hover-text-color: var(--ti-common-color-text-primary, #191919); // 朴素按钮非选中项悬浮文本色 - --ti-button-group-item-btn-plain-text-color: var(--ti-common-color-text-link-hover, #344899); + --ti-button-group-item-btn-plain-text-color: var(--ti-common-color-text-link-hover, #1476ff); // 朴素按钮项悬浮背景色 - --ti-button-group-item-btn-plain-bg-color: var(--ti-common-color-prompt-bg, #ebf6ff); + --ti-button-group-item-btn-plain-bg-color: var(--ti-common-color-prompt-bg, #deecff); // 朴素按钮非选中项悬浮边框色 - --ti-button-group-item-btn-plain-border-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-button-group-item-btn-plain-border-color: var(--ti-common-color-bg-emphasize, #191919); // 默认按钮选中项背景色 - --ti-button-group-item-active-bg-color: var(--ti-common-color-prompt); + --ti-button-group-item-active-bg-color: var(--ti-common-color-prompt, #1476ff); // 默认按钮选中项悬浮背景色 - --ti-button-group-item-btn-active-hover-bg-color: var(--ti-common-color-prompt); + --ti-button-group-item-btn-active-hover-bg-color: var(--ti-common-color-prompt, #1476ff); // 朴素按钮选中项文本颜色 - --ti-button-group-plain-active-text-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-button-group-plain-active-text-color: var(--ti-common-color-bg-emphasize, #191919); // 默认按钮选中项禁用时背景色 - --ti-button-group-item-active-disabled-bg-color: var(--ti-common-color-bg-dark-disabled); + --ti-button-group-item-active-disabled-bg-color: var(--ti-common-color-bg-dark-disabled, #dbdbdb); // 默认按钮选中项文本色 - --ti-button-group-item-active-text-color: var(--ti-common-color-light, #fff); + --ti-button-group-item-active-text-color: var(--ti-common-color-light, #ffffff); // 默认按钮右侧外边距 --ti-button-group-item-li-margin-right: calc(var(--ti-common-space-base, 4px) / 2); // 默认按钮下侧外边距 - --ti-button-group-item-li-margin-bottom: var(--ti-common-space-2); + --ti-button-group-item-li-margin-bottom: var(--ti-common-space-2, 2px); // 默认按钮选中边框色 - --ti-button-group-item-active-border-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-button-group-item-active-border-color: var(--ti-common-color-bg-emphasize, #191919); // 默认按钮选中边框色 - --ti-button-group-active-hover-border-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-button-group-active-hover-border-color: var(--ti-common-color-primary-hover, #595959); // 默认按钮内间距 - --ti-button-group-btn-padding-horizontal: var(--ti-common-space-6x); + --ti-button-group-btn-padding-horizontal: var(--ti-common-space-6x, 24px); // 按钮组按钮上间距 --ti-button-group-margin-top: var(--ti-common-space-0, 0px); // 按钮组各个按钮的上间距 @@ -94,27 +94,27 @@ // 小尺寸按钮组按钮字号 --ti-button-group-mini-font-size: calc(var(--ti-common-font-size-1, 14px) - 2px); // 无边框按钮悬浮按钮组背景色 - --ti-button-group-no-border-hover-bg-color: var(--ti-common-color-bg-light-emphasize, #beccfa); + --ti-button-group-no-border-hover-bg-color: var(--ti-common-color-bg-light-emphasize, #b3d6ff); // 无边框按钮组按钮选中态悬浮背景色 - --ti-button-group-no-border-active-hover-bg-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-button-group-no-border-active-hover-bg-color: var(--ti-common-color-primary-hover, #595959); // 无边框按钮组按钮禁用状态下背景色 --ti-button-group-no-border-disabled-bg-color: var(--ti-common-color-light, #ffffff); // 小尺寸按钮内间距 - --ti-button-group-mini-padding-horizontal: var(--ti-common-space-4x); + --ti-button-group-mini-padding-horizontal: var(--ti-common-space-4x, 16px); // 小尺寸按钮圆角 - --ti-button-group-mini-border-radius: calc(var(--ti-common-border-radius-normal, 2px) - 2px); + --ti-button-group-mini-border-radius: calc(var(--ti-common-border-radius-normal, 6px) - 2px); // 无边框按钮悬浮边框色 --ti-button-group-no-border-hover-border-color: var(--ti-common-color-transparent, transparent); // 选中按钮组按钮悬浮边框色 --ti-button-group-no-border-border-color: var(--ti-common-color-transparent, transparent); // 按钮角标高度 - --ti-button-group-item-sup-height: var(--ti-common-line-height-base); + --ti-button-group-item-sup-height: var(--ti-common-line-height-base, 18px); // 按钮角标上边距(hide) - --ti-button-group-item-sup-position-top: var(--ti-common-space-0); + --ti-button-group-item-sup-position-top: var(--ti-common-space-0, 0px); // 按钮角标字体颜色 --ti-button-group-item-sup-font-color: var(--ti-common-color-text-white, #fff); // 按钮角标字体大小 - --ti-button-group-item-sup-font-size: var(--ti-common-font-size-base, 12px); + --ti-button-group-item-sup-font-size: var(--ti-common-font-size-base, 14px); // icon角标 --ti-button-group-sup-icon-line-height: 22px; // 尺寸大小 diff --git a/packages/theme/src/calendar-view/vars.less b/packages/theme/src/calendar-view/vars.less index 4c30b6506a..ee8cce3e1b 100644 --- a/packages/theme/src/calendar-view/vars.less +++ b/packages/theme/src/calendar-view/vars.less @@ -12,38 +12,38 @@ .component-css-vars-calendar-view() { // header下边距 - --ti-calendar-view-header-margin-bottom: var(--ti-common-space-8x); + --ti-calendar-view-header-margin-bottom: var(--ti-common-space-8x, 32px); // 占位 --ti-calendar-view-tool-first-display: flex; --ti-calendar-view-tool-display: none; // radio 填充 - --ti-calendar-view-radio-active-fill: var(--ti-common-color-text-primary); - --ti-calendar-view-radio-active-inner: var(--ti-common-color-bg-white-normal); - --ti-calendar-view-radio-active-inner-hover: var(--ti-common-color-bg-white-normal); + --ti-calendar-view-radio-active-fill: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-radio-active-inner: var(--ti-common-color-bg-white-normal, #ffffff); + --ti-calendar-view-radio-active-inner-hover: var(--ti-common-color-bg-white-normal, #ffffff); --ti-calendar-view-radio-button-inner: #ebebeb; - --ti-calendar-view-header-main-text-color: var(--ti-common-color-text-weaken); + --ti-calendar-view-header-main-text-color: var(--ti-common-color-text-weaken, #808080); //选中 --ti-calendar-view-day-selected-border-radius: unset; --ti-calendar-view-day-selected-svg-right: unset; --ti-calendar-view-day-selected-svg-top: unset; // 提示 - --ti-calendar-view-tooltip-title-font-size: var(--ti-common-font-size-2); - --ti-calendar-view-tooltip-title-font-weight: var(--ti-common-font-weight-bold); - --ti-calendar-view-tooltip-date-text-color: var(--ti-common-color-text-secondary); - --ti-calendar-view-tooltip-content-text-color: var(--ti-common-color-text-primary); + --ti-calendar-view-tooltip-title-font-size: var(--ti-common-font-size-2, 16px); + --ti-calendar-view-tooltip-title-font-weight: var(--ti-common-font-weight-bold, 600); + --ti-calendar-view-tooltip-date-text-color: var(--ti-common-color-text-secondary, #595959); + --ti-calendar-view-tooltip-content-text-color: var(--ti-common-color-text-primary, #191919); // 箭头 --ti-calendar-view-header-left-svg-fill: #D8D8D8; --ti-calendar-view-header-right-svg-fill: #D8D8D8; // 日程 - --ti-calendar-view-events-item-font-size: var(--ti-common-font-size-1); - --ti-calendar-view-events-item-font-weight: var(--ti-common-font-weight-bold); - --ti-calendar-view-events-blue-item-color: var(--ti-common-color-text-primary); - --ti-calendar-view-events-green-item-color: var(--ti-common-color-text-primary); - --ti-calendar-view-events-red-item-color: var(--ti-common-color-text-primary); - --ti-calendar-view-events-yellow-item-color: var(--ti-common-color-text-primary); - --ti-calendar-view-events-purple-item-color: var(--ti-common-color-text-primary); - --ti-calendar-view-events-cyan-item-color: var(--ti-common-color-text-primary); - --ti-calendar-view-events-grey-item-color: var(--ti-common-color-text-primary); + --ti-calendar-view-events-item-font-size: var(--ti-common-font-size-1, 14px); + --ti-calendar-view-events-item-font-weight: var(--ti-common-font-weight-bold, 600); + --ti-calendar-view-events-blue-item-color: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-events-green-item-color: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-events-red-item-color: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-events-yellow-item-color: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-events-purple-item-color: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-events-cyan-item-color: var(--ti-common-color-text-primary, #191919); + --ti-calendar-view-events-grey-item-color: var(--ti-common-color-text-primary, #191919); --ti-calendar-view-is-selected-hover-color: rgba(240,248,255,0.7); --ti-calendar-view-not-selected-hover-color: rgba(240,248,255,0.5); } diff --git a/packages/theme/src/calendar/vars.less b/packages/theme/src/calendar/vars.less index 9d98c65ff5..8255e06514 100644 --- a/packages/theme/src/calendar/vars.less +++ b/packages/theme/src/calendar/vars.less @@ -11,28 +11,28 @@ */ .component-css-vars-calendar() { - --ti-calendar-bg-color: var(--ti-common-color-light, #fff); - --ti-calendar-list-item-selected-text-color: var(--ti-common-color-light, #fff); - --ti-calendar-hover-text-color: var(--ti-base-color-brand-5, #7693f5); - --ti-calendar-border-color: var(--ti-common-color-border, #adb0b8); + --ti-calendar-bg-color: var(--ti-common-color-light, #ffffff); + --ti-calendar-list-item-selected-text-color: var(--ti-common-color-light, #ffffff); + --ti-calendar-hover-text-color: var(--ti-base-color-brand-5, #c2c2c2); + --ti-calendar-border-color: var(--ti-common-color-border, #999999); --ti-calendar-text-color-primary: #1890ff; --ti-calendar-background-color-primary: rgba(24, 144, 255, 0.1); - --ti-calendar-bg-color-success: var(--ti-common-color-success-normal, #50d4ab); - --ti-calendar-bg-color-warning: var(--ti-common-color-warning-normal, #fa9841); + --ti-calendar-bg-color-success: var(--ti-common-color-success-normal, #5cb300); + --ti-calendar-bg-color-warning: var(--ti-common-color-warning-normal, #ff8800); --ti-calendar-bg-color-danger: var(--ti-base-color-bg-8, #c7000b); - --ti-calendar-text-color-info: var(--ti-common-color-info-normal, #252b3a); - --ti-calendar-tool-width: var(--ti-common-size-width-normal, 80px); + --ti-calendar-text-color-info: var(--ti-common-color-info-normal, #191919); + --ti-calendar-tool-width: var(--ti-common-size-width-normal, 104px); --ti-calendar-content-heard-font-size: var(--ti-common-font-size-1, 14px); - --ti-calendar-input-height: var(--ti-common-size-height-normal, 28px); - --ti-calendar-selected-border-radius: var(--ti-common-border-radius-normal, 2px); - --ti-calendar-input-border-radius: var(--ti-common-border-radius-normal, 2px); - --ti-calendar-input-font-size: var(--ti-common-font-size-base, 12px); - --ti-calendar-list-item-height: var(--ti-common-size-height-normal, 28px); - --ti-calendar-list-item-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); - --ti-calendar-list-item-selected-bg-color: var(--ti-common-color-selected-background, #5e7ce0); - --ti-calendar-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); - --ti-calendar-disabled-info-bg-color: var(--ti-base-color-bg-5, #f5f5f6); - --ti-calendar-disabled-success-bg-color: var(--ti-base-color-bg-5, #f5f5f6); - --ti-calendar-disabled-warning-bg-color: var(--ti-base-color-bg-5, #f5f5f6); - --ti-calendar-disabled-error-bg-color: var(--ti-base-color-bg-5, #f5f5f6); + --ti-calendar-input-height: var(--ti-common-size-height-normal, 32px); + --ti-calendar-selected-border-radius: var(--ti-common-border-radius-normal, 6px); + --ti-calendar-input-border-radius: var(--ti-common-border-radius-normal, 6px); + --ti-calendar-input-font-size: var(--ti-common-font-size-base, 14px); + --ti-calendar-list-item-height: var(--ti-common-size-height-normal, 32px); + --ti-calendar-list-item-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); + --ti-calendar-list-item-selected-bg-color: var(--ti-common-color-selected-background, #f5f5f5); + --ti-calendar-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); + --ti-calendar-disabled-info-bg-color: var(--ti-base-color-bg-5, #ffffff); + --ti-calendar-disabled-success-bg-color: var(--ti-base-color-bg-5, #ffffff); + --ti-calendar-disabled-warning-bg-color: var(--ti-base-color-bg-5, #ffffff); + --ti-calendar-disabled-error-bg-color: var(--ti-base-color-bg-5, #ffffff); } diff --git a/packages/theme/src/card-item/vars.less b/packages/theme/src/card-item/vars.less index bfbe6808bb..6fa8e93e05 100644 --- a/packages/theme/src/card-item/vars.less +++ b/packages/theme/src/card-item/vars.less @@ -11,7 +11,7 @@ */ .component-css-vars-card-item() { - --ti-card-item-bg-color: var(--ti-common-color-light, #fff); + --ti-card-item-bg-color: var(--ti-common-color-light, #ffffff); --ti-card-item-border-color: #ccc; --ti-card-item-placeholder-bg-color: rgba(0, 0, 0, 0.05); --ti-card-item-placeholder-border-color: rgba(0, 0, 0, 0.2); @@ -23,5 +23,5 @@ --ti-card-item-header-font-size: var(--ti-common-font-size-1, 14px); --ti-card-item-header-text-color: #444; --ti-card-item-header-height: var(--ti-common-size-10x, 40px); - --ti-card-item-header-title-border-color: var(--ti-common-color-bg-dark-deep, #464c59); + --ti-card-item-header-title-border-color: var(--ti-common-color-bg-dark-deep, #fff); } diff --git a/packages/theme/src/card-layout/vars.less b/packages/theme/src/card-layout/vars.less index a234c867c3..8497c1fb6e 100644 --- a/packages/theme/src/card-layout/vars.less +++ b/packages/theme/src/card-layout/vars.less @@ -11,6 +11,6 @@ */ .component-css-vars-card-layout() { - --ti-card-bg-color: var(--ti-common-color-light, #fff); - --ti-card-drop-border-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-card-bg-color: var(--ti-common-color-light, #ffffff); + --ti-card-drop-border-color: var(--ti-base-color-brand-6, #191919); } diff --git a/packages/theme/src/card-template/vars.less b/packages/theme/src/card-template/vars.less index 24f1061fdf..b980805760 100644 --- a/packages/theme/src/card-template/vars.less +++ b/packages/theme/src/card-template/vars.less @@ -11,20 +11,20 @@ */ .component-css-vars-card-template() { - --ti-card-bg-color: var(--ti-common-color-light, #fff); + --ti-card-bg-color: var(--ti-common-color-light, #ffffff); --ti-card-tool-icon-size: 16px; - --ti-card-tool-icon-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-card-tool-hover-icon-color: var(--ti-base-color-brand-5, #7693f5); - --ti-card-tool-active-icon-color: var(--ti-common-color-primary-active, #7693f5); + --ti-card-tool-icon-color: var(--ti-base-color-brand-6, #191919); + --ti-card-tool-hover-icon-color: var(--ti-base-color-brand-5, #c2c2c2); + --ti-card-tool-active-icon-color: var(--ti-common-color-primary-active, #595959); --ti-card-tool-selector-height: var(--ti-common-size-10x, 40px); - --ti-card-tool-selector-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-card-tool-selector-hover-text-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-card-tool-selector-hover-bg-color: var(--ti-common-color-selected-background, #5e7ce0); - --ti-card-tool-selector-active-text-color: var(--ti-common-color-primary-active, #7693f5); - --ti-card-tool-selector-active-bg-color: var(--ti-common-color-selected-background, #5e7ce0); + --ti-card-tool-selector-text-color: var(--ti-common-color-info-normal, #191919); + --ti-card-tool-selector-hover-text-color: var(--ti-base-color-brand-6, #191919); + --ti-card-tool-selector-hover-bg-color: var(--ti-common-color-selected-background, #f5f5f5); + --ti-card-tool-selector-active-text-color: var(--ti-common-color-primary-active, #595959); + --ti-card-tool-selector-active-bg-color: var(--ti-common-color-selected-background, #f5f5f5); --ti-card-header-height: 46px; - --ti-card-header-border-color: var(--ti-common-color-border, #adb0b8); + --ti-card-header-border-color: var(--ti-common-color-border, #999999); --ti-card-header-title-font-weight: var(--ti-common-font-weight-7, bold); --ti-card-header-title-font-size: var(--ti-common-font-size-1, 14px); - --ti-card-header-title-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-card-header-title-text-color: var(--ti-common-color-info-normal, #191919); } diff --git a/packages/theme/src/card/vars.less b/packages/theme/src/card/vars.less index 02df58bd33..da80600c2e 100644 --- a/packages/theme/src/card/vars.less +++ b/packages/theme/src/card/vars.less @@ -12,76 +12,76 @@ .component-css-vars-amount() { // 卡片背景色 - --ti-card-bg-color: var(--ti-common-color-bg-navigation); + --ti-card-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 卡片阴影 --ti-card-box-shadow: none; // 卡片最小宽度 - --ti-card-min-width: var(--ti-common-size-auto); + --ti-card-min-width: var(--ti-common-size-auto, auto); // 大尺寸卡片的宽度 - --ti-card-large-width: calc(var(--ti-common-size-base) * 144); + --ti-card-large-width: calc(var(--ti-common-size-base, 4px) * 144); // 中尺寸卡片的宽度 - --ti-card-medium-width: calc(var(--ti-common-size-base) * 96); + --ti-card-medium-width: calc(var(--ti-common-size-base, 4px) * 96); // 小尺寸卡片的宽度 - --ti-card-small-width: calc(var(--ti-common-size-base) * 72); + --ti-card-small-width: calc(var(--ti-common-size-base, 4px) * 72); // 迷你尺寸卡片的宽度 - --ti-card-mini-width: calc(var(--ti-common-size-base) * 54); + --ti-card-mini-width: calc(var(--ti-common-size-base, 4px) * 54); // 大尺寸卡片的圆角 - --ti-card-large-border-radius: var(--ti-common-border-radius-4); + --ti-card-large-border-radius: var(--ti-common-border-radius-4, 8px); // 中尺寸卡片的圆角 - --ti-card-medium-border-radius: var(--ti-common-border-radius-2); + --ti-card-medium-border-radius: var(--ti-common-border-radius-2, 4px); // 小尺寸卡片的圆角 - --ti-card-small-border-radius: var(--ti-common-border-radius-2); + --ti-card-small-border-radius: var(--ti-common-border-radius-2, 4px); // 迷你尺寸卡片的圆角 - --ti-card-mini-border-radius: var(--ti-common-border-radius-1); + --ti-card-mini-border-radius: var(--ti-common-border-radius-1, 2px); // 成功状态的卡片的边框颜色 - --ti-card-success-border-color: var(--ti-base-color-success-4); + --ti-card-success-border-color: var(--ti-base-color-success-4, #3ac295); // 警告状态的卡片的边框颜色 - --ti-card-warning-border-color: var(--ti-base-color-warn-5); + --ti-card-warning-border-color: var(--ti-base-color-warn-5, #e37d29); // 报警状态的卡片的边框颜色 - --ti-card-alerting-border-color: var(--ti-base-color-warn-3); + --ti-card-alerting-border-color: var(--ti-base-color-warn-3, #fac20a); // 危险状态的卡片的边框颜色 - --ti-card-danger-border-color: var(--ti-base-color-error-4); + --ti-card-danger-border-color: var(--ti-base-color-error-4, #de504e); // 默认状态的卡片的边框颜色 - --ti-card-default-border-color: var(--ti-common-color-light); + --ti-card-default-border-color: var(--ti-common-color-light, #ffffff); // 选中状态的卡片的边框颜色 - --ti-card-checked-border-color: var(--ti-common-color-text-highlight); + --ti-card-checked-border-color: var(--ti-common-color-text-highlight, #1476ff); // 禁用状态的卡片的背景颜色 - --ti-card-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-card-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 大尺寸卡片的logo状态下，body区域的padding值 - --ti-card-large-body-padding: var(--ti-common-space-6x); + --ti-card-large-body-padding: var(--ti-common-space-6x, 24px); // 中尺寸卡片的logo状态下，body区域的padding值 - --ti-card-medium-body-padding: var(--ti-common-space-6x); + --ti-card-medium-body-padding: var(--ti-common-space-6x, 24px); // 小尺寸卡片的logo状态下，body区域的padding值 - --ti-card-small-body-padding: var(--ti-common-space-4x); + --ti-card-small-body-padding: var(--ti-common-space-4x, 16px); // 迷你尺寸卡片的logo状态下，body区域的padding值 - --ti-card-mini-body-padding: var(--ti-common-space-3x); + --ti-card-mini-body-padding: var(--ti-common-space-3x, 12px); // 卡片的标题的字体大小 - --ti-card-title-font-size: var(--ti-common-font-size-2); + --ti-card-title-font-size: var(--ti-common-font-size-2, 16px); // 卡片的标题的字体颜色 - --ti-card-title-text-color: var(--ti-common-color-selected-text-color); + --ti-card-title-text-color: var(--ti-common-color-selected-text-color, #191919); // 卡片的标题的字重 --ti-card-title-font-weight: bold; // 卡片的正文的字体大小 - --ti-card-main-font-size: var(--ti-common-font-size-1); + --ti-card-main-font-size: var(--ti-common-font-size-1, 14px); // 卡片的正文的字体颜色 - --ti-card-main-text-color: var(--ti-common-color-text-weaken); + --ti-card-main-text-color: var(--ti-common-color-text-weaken, #808080); // 卡片的选项的文本色 - --ti-card-option-text-color: var(--ti-common-color-selected-text-color); + --ti-card-option-text-color: var(--ti-common-color-selected-text-color, #191919); // 卡片的选项的文本大小 - --ti-card-option-font-size: var(--ti-common-font-size-2); + --ti-card-option-font-size: var(--ti-common-font-size-2, 16px); // 卡片的选项的文本大小 - --ti-card-option-top-border-color: var(--ti-common-color-primary-disabled); + --ti-card-option-top-border-color: var(--ti-common-color-primary-disabled, #f0f0f0); // 卡片的选项禁用时的文本色 - --ti-card-option-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-card-option-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 卡片的'更多'的字体颜色 - --ti-card-footer-more-text-color: var(--ti-base-color-common-9); + --ti-card-footer-more-text-color: var(--ti-base-color-common-9, #181818); // 卡片标题下边距 - --ti-card-title-mg-bottom: var(--ti-common-space-4x); + --ti-card-title-mg-bottom: var(--ti-common-space-4x, 16px); } diff --git a/packages/theme/src/carousel-item/vars.less b/packages/theme/src/carousel-item/vars.less index b2cacfedba..c0e33c1924 100644 --- a/packages/theme/src/carousel-item/vars.less +++ b/packages/theme/src/carousel-item/vars.less @@ -11,9 +11,9 @@ */ .component-css-vars-carousel-item() { - --ti-carousel-item-title-height: var(--ti-common-size-height-medium); - --ti-carousel-item-title-text-color: var(--ti-common-color-light); - --ti-carousel-item-title-bg-color: var(--ti-common-color-bg-primary); - --ti-carousel-item-title-span-font-size: var(--ti-common-font-size-base, 12px); - --ti-carousel-mask-bg-color: var(--ti-common-color-light, #fff); + --ti-carousel-item-title-height: var(--ti-common-size-height-medium, 40px); + --ti-carousel-item-title-text-color: var(--ti-common-color-light, #ffffff); + --ti-carousel-item-title-bg-color: var(--ti-common-color-bg-primary, #191919); + --ti-carousel-item-title-span-font-size: var(--ti-common-font-size-base, 14px); + --ti-carousel-mask-bg-color: var(--ti-common-color-light, #ffffff); } diff --git a/packages/theme/src/carousel/vars.less b/packages/theme/src/carousel/vars.less index 46db45235b..d111873bcf 100644 --- a/packages/theme/src/carousel/vars.less +++ b/packages/theme/src/carousel/vars.less @@ -12,11 +12,11 @@ .component-css-vars-carousel() { // 箭头按钮背景高度 - --ti-carousel-arrow-height: var(--ti-common-size-8x); + --ti-carousel-arrow-height: var(--ti-common-size-8x, 32px); // 箭头按钮背景宽度 - --ti-carousel-arrow-width: var(--ti-common-size-8x); + --ti-carousel-arrow-width: var(--ti-common-size-8x, 32px); // 左右箭头的字号 - --ti-carousel-arrow-font-size: var(--ti-common-font-size-2); + --ti-carousel-arrow-font-size: var(--ti-common-font-size-2, 16px); // 左右箭头按钮悬浮背景色 --ti-carousel-arrow-hover-bg-color: #E6E6E6; // 左右箭头按钮背景色 @@ -24,9 +24,9 @@ // 左右箭头阴影(hide) --ti-carousel-arrow-box-shadow: var(--ti-common-shadow-none, none); // 箭头正常颜色 - --ti-carousel-arrow-text-color: var(--ti-common-color-text-weaken); + --ti-carousel-arrow-text-color: var(--ti-common-color-text-weaken, #808080); // 箭头点击瞬间文本色(hide) - --ti-carousel-arrow-active-text-color: var(--ti-common-color-light, #fff); + --ti-carousel-arrow-active-text-color: var(--ti-common-color-light, #ffffff); // 指示器盒子的背景色 --ti-carousel-indicators-bg-color: none; // 指示器盒子的圆角大小 @@ -36,9 +36,9 @@ // 指示器圆角的背景色(hide) --ti-carousel-indicators-radius-bg-color: rgba(0, 0, 0, 0.3); // 幻灯片内的当前指示器图标色 - --ti-carousel-indicator-active-text-color: var(--ti-common-color-icon-normal); + --ti-carousel-indicator-active-text-color: var(--ti-common-color-icon-normal, #808080); // 幻灯片内的悬浮指示器图标色 - --ti-carousel-indicator-hover-text-color: var(--ti-common-color-primary-normal); + --ti-carousel-indicator-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 指示器按钮宽度 --ti-carousel-indicator-button-width: var(--ti-common-size-2x, 8px); // 指示器按钮高度 @@ -46,41 +46,41 @@ // 非当前指示器背景色 --ti-carousel-indicator-button-bg-color: #e6e6e6; // 指示器项右外边距 - --ti-carousel-indicator-margin-right: var(--ti-common-space-3x); + --ti-carousel-indicator-margin-right: var(--ti-common-space-3x, 12px); // 当前指示器右边距 - --ti-carousel-indicator-active-width: var(--ti-common-size-3x); + --ti-carousel-indicator-active-width: var(--ti-common-size-3x, 12px); // 指示器项垂直内边距(hide) --ti-carousel-indicator-padding-vertical: var(--ti-common-space-0, 0px); // 指示器项水平内边距 - --ti-carousel-indicator-padding-horizontal: var(--ti-common-space-0); + --ti-carousel-indicator-padding-horizontal: var(--ti-common-space-0, 0px); // 当前指示器动画属性(hide) --ti-carousel-indicator-active-transition-property: none; // 当前指示器背景色 - --ti-carousel-indicator-active-background-color: var(--ti-common-color-primary-active); + --ti-carousel-indicator-active-background-color: var(--ti-common-color-primary-active, #595959); // 当前指示器的宽度 - --ti-carousel-indicator-active-button-width: var(--ti-common-size-3x); + --ti-carousel-indicator-active-button-width: var(--ti-common-size-3x, 12px); // 当前指示器圆角 - --ti-carousel-indicator-active-border-radius: var(--ti-common-space-base); + --ti-carousel-indicator-active-border-radius: var(--ti-common-space-base, 4px); // 幻灯片外的指示器动画(hide) --ti-carousel-indicator-active-transition: none; // 幻灯片外的指示器默认背景色 --ti-carousel-outside-button-bg-color: var(--ti-common-color-dark, #000); // 幻灯片外的当前指示器背景色 - --ti-carousel-outside-button-active-bg-color: var(--ti-common-color-text-secondary); + --ti-carousel-outside-button-active-bg-color: var(--ti-common-color-text-secondary, #595959); // 标签按钮的字号(hide) - --ti-carousel-labels-button-font-size: var(--ti-common-font-size-base, 12px); + --ti-carousel-labels-button-font-size: var(--ti-common-font-size-base, 14px); // 正常透明度颜色 --ti-carousel-opacity: 0.5; // 幻灯片悬浮时的透明度(hide) --ti-carousel-hover-opacity: 0.8; // 箭头悬浮文本颜色(hide) - --ti-carousel-arrow-hover-text-color: var(--ti-common-color-text-primary); + --ti-carousel-arrow-hover-text-color: var(--ti-common-color-text-primary, #191919); // 左侧箭头背景色 - --ti-carousel-arrow-left-bg-color: var(--ti-common-color-bg-normal); + --ti-carousel-arrow-left-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 右侧箭头背景色 - --ti-carousel-arrow-right-bg-color: var(--ti-common-color-bg-normal); + --ti-carousel-arrow-right-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 按钮禁用色 - --ti-carousel-arrow-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-carousel-arrow-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 按钮禁用色 - --ti-carousel-arrow-disabled-color: var(--ti-common-color-primary-disabled-text); + --ti-carousel-arrow-disabled-color: var(--ti-common-color-primary-disabled-text, #c2c2c2); } \ No newline at end of file diff --git a/packages/theme/src/cascader-menu/vars.less b/packages/theme/src/cascader-menu/vars.less index aba30be204..9095ddb470 100644 --- a/packages/theme/src/cascader-menu/vars.less +++ b/packages/theme/src/cascader-menu/vars.less @@ -12,13 +12,13 @@ .component-css-vars-cascader-menu() { // 下拉菜单文本色 - --ti-cascader-menu-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-cascader-menu-text-color: var(--ti-common-color-text-primary, #191919); // 下拉菜单边框色 --ti-cascader-menu-border-color: #f5f5f5; // 下拉菜单为空时的文本色 - --ti-cascader-menu-empty-text-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-cascader-menu-empty-text-color: var(--ti-common-color-text-weaken, #808080); // 下拉菜单列表垂直方向的内边距 - --ti-cascader-menu-list-padding-vertical: var(--ti-common-space-2x); + --ti-cascader-menu-list-padding-vertical: var(--ti-common-space-2x, 8px); // 下拉菜单列表水平方向的内边距 --ti-cascader-menu-list-padding-horizontal: var(--ti-common-space-0, 0px); // 下拉菜单的宽度 diff --git a/packages/theme/src/cascader-node/vars.less b/packages/theme/src/cascader-node/vars.less index f8eb848ea9..d32cfb3373 100644 --- a/packages/theme/src/cascader-node/vars.less +++ b/packages/theme/src/cascader-node/vars.less @@ -12,41 +12,41 @@ .component-css-vars-cascader-node() { // 下拉列表子项的背景色 - --ti-cascader-node-hover-bg-color: var(--ti-common-color-bg-white-emphasize, #f2f5fc); + --ti-cascader-node-hover-bg-color: var(--ti-common-color-bg-white-emphasize, #f0f0f0); // 下拉列表子项悬浮时的文本色 - --ti-cascader-node-hover-text-color: var(--ti-common-color-primary-normal); + --ti-cascader-node-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 下拉列表子项的文本色 - --ti-cascader-node-text-color: var(--ti-common-color-primary-normal); + --ti-cascader-node-text-color: var(--ti-common-color-primary-normal, #191919); // 下拉列表子项选中后悬浮时的背景色 - --ti-cascader-node-selectable-hover-bg-color: var(--ti-common-color-selected-background, #5e7ce0); + --ti-cascader-node-selectable-hover-bg-color: var(--ti-common-color-selected-background, #f5f5f5); // 下拉列表子项选中时的文本色 - --ti-cascader-node-selectable-text-color: var(--ti-common-color-text-primary); + --ti-cascader-node-selectable-text-color: var(--ti-common-color-text-primary, #191919); // 下拉列表子项禁用状态时的文本色 - --ti-cascader-node-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-cascader-node-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 下拉列表子项禁用状态时的背景色 - --ti-cascader-node-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-cascader-node-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 下拉列表子项的icon图标的字体大小 - --ti-cascader-node-icon-font-size: var(--ti-common-font-size-0); + --ti-cascader-node-icon-font-size: var(--ti-common-font-size-0, 12px); // 下拉列表子项的icon图标的色 - --ti-cascader-node-icon-color: var(--ti-common-color-icon-normal); + --ti-cascader-node-icon-color: var(--ti-common-color-icon-normal, #808080); // 下拉列表子项禁用时的icon图标的色 - --ti-cascader-node-disabled-icon-color: var(--ti-common-color-text-link-darkbg-hover); + --ti-cascader-node-disabled-icon-color: var(--ti-common-color-text-link-darkbg-hover, #c2c2c2); // 下拉列表子项的选中时icon图标的色 - --ti-cascader-node-active-icon-color: var(--ti-common-color-primary-normal); + --ti-cascader-node-active-icon-color: var(--ti-common-color-primary-normal, #191919); // 下拉列表子项的前缀display --ti-cascader-node-prefix-display: none; // 下拉列表子项的标签的垂直方向的内边距 --ti-cascader-node-label-padding-vertical: var(--ti-common-space-0, 0px); // 下拉列表子项的标签的水平方向的内边距 - --ti-cascader-node-label-padding-horizontal: var(--ti-common-space-0); + --ti-cascader-node-label-padding-horizontal: var(--ti-common-space-0, 0px); // 下拉列表子项的单选按钮右侧外边距 --ti-cascader-node-radio-margin-right: var(--ti-common-space-base, 4px); // 下拉列表子项聚焦时的背景色 - --ti-cascader-node-selectable-active-bg-color: var(--ti-common-color-bg-navigation); + --ti-cascader-node-selectable-active-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 下拉列表子项icon距离右侧距离 - --ti-cascader-node-postfix-right: var(--ti-common-space-4x); + --ti-cascader-node-postfix-right: var(--ti-common-space-4x, 16px); // 下拉列表子项最大宽度 - --ti-cascader-node-label-max-width: calc(var(--ti-common-space-2) * 53 + 1px); + --ti-cascader-node-label-max-width: calc(var(--ti-common-space-2, 2px) * 53 + 1px); // 下拉列表子项高亮时字重 - --ti-cascader-node-active-font-weight: var(--ti-common-font-weight-normal); + --ti-cascader-node-active-font-weight: var(--ti-common-font-weight-normal, 400); } diff --git a/packages/theme/src/cascader-panel/vars.less b/packages/theme/src/cascader-panel/vars.less index 0a3b0ca20d..9f04673666 100644 --- a/packages/theme/src/cascader-panel/vars.less +++ b/packages/theme/src/cascader-panel/vars.less @@ -12,13 +12,13 @@ .component-css-vars-cascader-panel() { // 下拉菜单面板的边框圆角 - --ti-cascader-panel-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-cascader-panel-border-radius: var(--ti-common-border-radius-normal, 6px); // 下拉菜单面板的边框色 - --ti-cascader-panel-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-cascader-panel-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 下拉菜单面板的字体大小 - --ti-cascader-panel-font-size: var(--ti-common-font-size-base, 12px); + --ti-cascader-panel-font-size: var(--ti-common-font-size-base, 14px); // 下拉菜单面板子项的高度 - --ti-cascader-panel-node-height: var(--ti-common-size-height-normal, 28px); + --ti-cascader-panel-node-height: var(--ti-common-size-height-normal, 32px); // 下拉菜单面板中子项的顶部外边距 --ti-cascader-panel-node-margin-top: var(--ti-common-space-0, 0px); // 下拉菜单面板中子项的垂直方向的外边距 diff --git a/packages/theme/src/cascader/vars.less b/packages/theme/src/cascader/vars.less index db7a3f8532..9de0989ead 100644 --- a/packages/theme/src/cascader/vars.less +++ b/packages/theme/src/cascader/vars.less @@ -16,13 +16,13 @@ // 输入框图标字体大小 --ti-cascader-input-icon-font-size: calc(var(--ti-common-font-size-1, 14px) - 4px); // 悬浮时显示的边框色 - --ti-cascader-hover-border-color: var(--ti-common-color-line-hover, #575d6c); + --ti-cascader-hover-border-color: var(--ti-common-color-line-hover, #191919); // 聚焦时显示的边框色 - --ti-cascader-focus-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-cascader-focus-border-color: var(--ti-common-color-line-active, #191919); // 边框圆角 --ti-cascader-border-radius: 6px; // icon图标色 - --ti-cascader-icon-color: var(--ti-common-color-icon-graybg-normal, #adb0b8); + --ti-cascader-icon-color: var(--ti-common-color-icon-graybg-normal, #808080); // medium尺寸时的字体大小 --ti-cascader-medium-font-size: var(--ti-common-font-size-1, 14px); // medium尺寸时的行高 @@ -34,35 +34,35 @@ // small尺寸时的字体大小 --ti-cascader-small-font-size: var(--ti-common-font-size-bas); // mini尺寸时的字体大小 - --ti-cascader-mini-font-size: var(--ti-common-font-size-base, 12px); + --ti-cascader-mini-font-size: var(--ti-common-font-size-base, 14px); // 禁用状态时的文本色 - --ti-cascader-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-cascader-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 下拉框背景色 - --ti-cascader-dropdown-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-cascader-dropdown-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 输入框标签背景色 - --ti-cascader-tag-bg-color: var(--ti-common-color-bg-white-emphasize, #f2f5fc); + --ti-cascader-tag-bg-color: var(--ti-common-color-bg-white-emphasize, #f0f0f0); // 输入框标签的icon图标背景色 - --ti-cascader-tag-icon-bg-color: var(--ti-common-color-icon-graybg-disabled, #dfe1e6); + --ti-cascader-tag-icon-bg-color: var(--ti-common-color-icon-graybg-disabled, #c2c2c2); // 输入框标签的icon图标色 --ti-cascader-tag-icon-color: var(--ti-common-color-icon-white, #fff); // 输入框标签的icon图标悬浮时显示的背景色 - --ti-cascader-tag-icon-hover-bg-color: var(--ti-common-color-icon-graybg-normal, #adb0b8); + --ti-cascader-tag-icon-hover-bg-color: var(--ti-common-color-icon-graybg-normal, #808080); // 下拉列表的文本色（没有生效） --ti-cascader-list-text-color: #191919; // 下拉列表子项的高度（没有生效） - --ti-cascader-item-height: var(--ti-common-size-height-normal, 28px); + --ti-cascader-item-height: var(--ti-common-size-height-normal, 32px); // 下拉列表子项悬浮时的背景色（没有生效） --ti-cascader-item-hover-bg-color: #f5f7fa; // 下拉列表子项选中时的文本色（没有生效） --ti-cascader-item-checked-text-color: var(--ti-base-color-primary-active); // 搜索后下拉列表无匹配数据的文本色 - --ti-cascader-empty-text-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-cascader-empty-text-color: var(--ti-common-color-text-weaken, #808080); // 搜索框的文本色（没有生效） - --ti-cascader-search-input-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-cascader-search-input-text-color: var(--ti-common-color-info-normal, #191919); // 搜索框的占位符的文本色（没有生效） - --ti-cascader-search-input-placeholder-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-cascader-search-input-placeholder-text-color: var(--ti-common-color-placeholder, #808080); // 下拉框的阴影 - --ti-cascader-dropdown-box-shadow: var(--ti-common-shadow-3-left); + --ti-cascader-dropdown-box-shadow: var(--ti-common-shadow-3-left, -4px 0 16px 0 rgba(0, 0, 0, 0.08)); // 多选模式输入框宽度 --ti-cascader-width: '100%'; // 下拉框的左侧外边距 @@ -110,9 +110,9 @@ // 搜索框的左侧内边距（没有生效） --ti-cascader-search-input-padding-left: var(--ti-common-space-2x, 8px); // 下拉列表子项的字体大小 - --ti-cascader-item-font-size: var(--ti-common-font-size-base, 12px); + --ti-cascader-item-font-size: var(--ti-common-font-size-base, 14px); // 搜索框的字体大小（没有生效） - --ti-cascader-search-input-font-size: var(--ti-common-font-size-base, 12px); + --ti-cascader-search-input-font-size: var(--ti-common-font-size-base, 14px); // 输入框关闭图标hover时的颜色 --ti-cascader-close-hover-icon-color: #191919; } diff --git a/packages/theme/src/collapse-item/vars.less b/packages/theme/src/collapse-item/vars.less index 369976b2d0..1f9e736370 100644 --- a/packages/theme/src/collapse-item/vars.less +++ b/packages/theme/src/collapse-item/vars.less @@ -12,13 +12,13 @@ .component-css-vars-collapse-item() { // 面板默认文本色 - --ti-collapse-item-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-collapse-item-text-color: var(--ti-common-color-text-primary, #191919); // 面板背景色 - --ti-collapse-item-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-collapse-item-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 面板边框色 --ti-collapse-item-border-color: transparent; // 面板边大小 - --ti-collapse-item-border-length: var(--ti-common-border-radius-0); + --ti-collapse-item-border-length: var(--ti-common-border-radius-0, 0); // 面板左边框色 --ti-collapse-item-border-color-left: var(--ti-collapse-item-border-color); // 面板右边框色 @@ -34,29 +34,29 @@ // 面板圆角 --ti-collapse-item-border-radius: 0; // 面板顶部外边距 - --ti-collapse-item-margin-top: calc(var(--ti-common-space-0) - 2px ); + --ti-collapse-item-margin-top: calc(var(--ti-common-space-0, 0px) - 2px ); // 面板头部最小高度 - --ti-collapse-item-header-min-height: var(--ti-common-size-height-medium); + --ti-collapse-item-header-min-height: var(--ti-common-size-height-medium, 40px); // 面板头部向下箭头图标色 --ti-collapse-item-icon-color: #808080; // 面板内容背景色 - --ti-collapse-item-wrap-bg-color: var(--ti-common-bg-minor); + --ti-collapse-item-wrap-bg-color: var(--ti-common-bg-minor, #fafafa); // 面板禁用文本色 - --ti-collapse-item-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-collapse-item-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 面板禁用背景色 - --ti-collapse-item-disabled-header-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-collapse-item-disabled-header-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 面板头部字号 - --ti-collapse-item-header-font-size: var(--ti-common-font-size-base, 12px); + --ti-collapse-item-header-font-size: var(--ti-common-font-size-base, 14px); // 面板头部字重 --ti-collapse-item-header-font-weight: var(--ti-common-font-weight-4, normal); // 面板头部的聚焦文本色(hide) - --ti-collapse-item-header-focus-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-collapse-item-header-focus-text-color: var(--ti-common-color-text-primary, #191919); // 面板头部箭头尺寸(hide) - --ti-collapse-item-arrow-font-size: var(--ti-common-font-size-base, 12px); + --ti-collapse-item-arrow-font-size: var(--ti-common-font-size-base, 14px); // 面板头部箭头右外边距 - --ti-collapse-item-arrow-margin-right: var(--ti-common-space-3x); + --ti-collapse-item-arrow-margin-right: var(--ti-common-space-3x, 12px); // 面板头部向上箭头图标色|箭头悬浮色 - --ti-collapse-item-arrow-hover-text-color: var(--ti-base-color-brand); + --ti-collapse-item-arrow-hover-text-color: var(--ti-base-color-brand, #191919); // 面板头部箭头尺寸 --ti-collapse-item-icon-font-size: var(--ti-common-font-size-2, 16px); // 面板头部箭头旋转角度 @@ -66,35 +66,35 @@ // 面板展开头部箭头图标色 --ti-collapse-item-is-active-arrow-text-color: var(--ti-collapse-item-icon-color); // 面板头部垂直内边距 - --ti-collapse-item-header-padding-vertical: var(--ti-common-size-3x); + --ti-collapse-item-header-padding-vertical: var(--ti-common-size-3x, 12px); // 面板头部水平内边距 - --ti-collapse-item-header-padding-horizontal: var(--ti-common-space-5x); + --ti-collapse-item-header-padding-horizontal: var(--ti-common-space-5x, 20px); // 面板头部背景色 - --ti-collapse-item-header-bg-color: var(--ti-common-color-bg-white-normal); + --ti-collapse-item-header-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 面板头部边框色 - --ti-collapse-item-header-border-color: var(--ti-base-color-common-5); + --ti-collapse-item-header-border-color: var(--ti-base-color-common-5, #f0f0f0); // 面板头部左边框色 - --ti-collapse-item-header-border-color-left: var(--ti-common-color-light); + --ti-collapse-item-header-border-color-left: var(--ti-common-color-light, #ffffff); // 面板头部右边框色 - --ti-collapse-item-header-border-color-right: var(--ti-common-color-light); + --ti-collapse-item-header-border-color-right: var(--ti-common-color-light, #ffffff); // 面板内容边框色 - --ti-collapse-item-content-border-color: var(--ti-common-color-light); + --ti-collapse-item-content-border-color: var(--ti-common-color-light, #ffffff); // 面板内容左边框色 --ti-collapse-item-content-border-color-left: var(--ti-collapse-item-content-border-color); // 面板内容右边框色 --ti-collapse-item-content-border-color-right: var(--ti-collapse-item-content-border-color); // 面板内容顶部边框色 - --ti-collapse-item-content-border-color-top: var(--ti-common-color-light); + --ti-collapse-item-content-border-color-top: var(--ti-common-color-light, #ffffff); // 面板内容顶部内边距 - --ti-collapse-item-content-padding-top: var(--ti-common-space-6x); + --ti-collapse-item-content-padding-top: var(--ti-common-space-6x, 24px); // 面板内容左内边距 - --ti-collapse-item-content-padding-left: var(--ti-common-space-5x); + --ti-collapse-item-content-padding-left: var(--ti-common-space-5x, 20px); // 面板内容右内边距 - --ti-collapse-item-content-padding-right: var(--ti-common-space-5x); + --ti-collapse-item-content-padding-right: var(--ti-common-space-5x, 20px); // 面板内容底部内边距 - --ti-collapse-item-content-padding-bottom: var(--ti-common-space-6x); + --ti-collapse-item-content-padding-bottom: var(--ti-common-space-6x, 24px); // 面板内容字号 - --ti-collapse-item-content-font-size: var(--ti-common-font-size-base, 12px); + --ti-collapse-item-content-font-size: var(--ti-common-font-size-base, 14px); // 面板右侧标题颜色 --ti-collapse-item-title-right-color: #1476ff; // 面板右侧图标颜色 diff --git a/packages/theme/src/color-picker/vars.less b/packages/theme/src/color-picker/vars.less index 90afce4d07..99706da58d 100644 --- a/packages/theme/src/color-picker/vars.less +++ b/packages/theme/src/color-picker/vars.less @@ -2,15 +2,15 @@ // 默认按钮背景色(hide) --ti-color-picker-bg-color: var(--ti-common-color-transparent, transparent); // 按钮边框色 - --ti-color-picker-border-color: var(--ti-base-color-common-2, #adb0b8); + --ti-color-picker-border-color: var(--ti-base-color-common-2, #808080); // 按钮边框厚度 --ti-color-picker-border-weight: var(--ti-common-border-weight-normal, 1px); // 没用(hide) - --ti-color-picker-border-radius-xs: var(--ti-common-border-radius-normal, 2px); + --ti-color-picker-border-radius-xs: var(--ti-common-border-radius-normal, 6px); // 按钮边框圆角 - --ti-color-picker-border-radius-sm: var(--ti-common-border-radius-1, 4px); + --ti-color-picker-border-radius-sm: var(--ti-common-border-radius-1, 2px); // 没用(hide) - --ti-color-picker-border-radius: var(--ti-common-border-radius-2, 8px); + --ti-color-picker-border-radius: var(--ti-common-border-radius-2, 4px); // 按钮垂直内边距 --ti-color-picker-padding-vertical: var(--ti-common-space-base, 4px); // 按钮水平内边距 @@ -22,7 +22,7 @@ // 没用(hide) --ti-color-picker__select__wrapper-zindex: 1000; // 没用(hide) - --ti-color-picker__wrapper-bg: var(--ti-common-color-bg-white-emphasize, #f2f5fc); + --ti-color-picker__wrapper-bg: var(--ti-common-color-bg-white-emphasize, #f0f0f0); // 超大尺寸高度 --ti-color-picker-size-large-height: var(--ti-common-size-16x, 64px); diff --git a/packages/theme/src/color-select-panel/vars.less b/packages/theme/src/color-select-panel/vars.less index 7d3d48ad9b..3f7d821331 100644 --- a/packages/theme/src/color-select-panel/vars.less +++ b/packages/theme/src/color-select-panel/vars.less @@ -2,15 +2,15 @@ // 弹出框背景色(hide) --ti-color-select-panel-bg-color: var(--ti-common-color-transparent, transparent); // 弹出框边框色(hide) - --ti-color-select-panel-border-color: var(--ti-base-color-common-2, #adb0b8); + --ti-color-select-panel-border-color: var(--ti-base-color-common-2, #808080); // 弹出框边框厚度(hide) --ti-color-select-panel-border-weight: var(--ti-common-border-weight-normal, 1px); // 弹出框右侧色调框圆角 - --ti-color-select-panel-border-radius-xs: var(--ti-common-border-radius-4); + --ti-color-select-panel-border-radius-xs: var(--ti-common-border-radius-4, 8px); // 历史记录展开框颜色块圆角 - --ti-color-select-panel-border-radius-sm: var(--ti-common-border-radius-2); + --ti-color-select-panel-border-radius-sm: var(--ti-common-border-radius-2, 4px); // 无用(hide) - --ti-color-select-panel-border-radius: var(--ti-common-border-radius-2, 8px); + --ti-color-select-panel-border-radius: var(--ti-common-border-radius-2, 4px); // 弹出框各元素快间隙(hide) --ti-color-select-panel-gap: var(--ti-common-space-base, 4px); // 弹出框垂直内边距 @@ -24,15 +24,15 @@ // 弹出框元素层级(hide) --ti-color-select-panel__wrapper-zindex: 10; // 弹出框背景色 - --ti-color-select-panel-bg-color: var(--ti-common-color-light); + --ti-color-select-panel-bg-color: var(--ti-common-color-light, #ffffff); // 弹窗按钮颜色 - --ti-color-select-panel-btn-border-color: var(--ti-common-color-line-normal); + --ti-color-select-panel-btn-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 弹窗按钮悬浮颜色 - --ti-color-select-panel-btn-border-hover-color: var(--ti-common-color-border-hover); + --ti-color-select-panel-btn-border-hover-color: var(--ti-common-color-border-hover, #191919); // 颜色工具栏高度 - --ti-color-select-panel-tools-line-height: var(--ti-common-size-height-medium); + --ti-color-select-panel-tools-line-height: var(--ti-common-size-height-medium, 40px); // 弹窗按钮外边距 --ti-color-select-panel-btn-margin: 8px; // 弹窗折叠字体颜色 - --ti-color-select-panel-collapse-color: var(--ti-common-color-primary-normal); + --ti-color-select-panel-collapse-color: var(--ti-common-color-primary-normal, #191919); } \ No newline at end of file diff --git a/packages/theme/src/crop/vars.less b/packages/theme/src/crop/vars.less index 1e7d3799a1..1fd9392f25 100644 --- a/packages/theme/src/crop/vars.less +++ b/packages/theme/src/crop/vars.less @@ -14,7 +14,7 @@ // 弹窗蒙层的背景色，实际为该值的0.5的透明度 --ti-crop-modal-bg-color: var(--ti-common-color-dark, #000); // 设置裁剪框在图片正中心加号背景色 - --ti-crop-center-bg-color: var(--ti-common-color-icon-graybg-disabled, #dfe1e6); + --ti-crop-center-bg-color: var(--ti-common-color-icon-graybg-disabled, #c2c2c2); // 弹窗裁剪框的背景色，实际为该值的0.1透明度 - --ti-crop-face-bg-color: var(--ti-common-color-light, #fff); + --ti-crop-face-bg-color: var(--ti-common-color-light, #ffffff); } diff --git a/packages/theme/src/date-panel/vars.less b/packages/theme/src/date-panel/vars.less index 53fdcd627d..385b574544 100644 --- a/packages/theme/src/date-panel/vars.less +++ b/packages/theme/src/date-panel/vars.less @@ -11,20 +11,20 @@ */ .component-css-vars-picker-panel() { - --ti-picker-panel-line-height: var(--ti-common-size-height-normal, 28px); + --ti-picker-panel-line-height: var(--ti-common-size-height-normal, 32px); --ti-picker-panel-shortcut-font-size: var(--ti-common-font-size-1, 14px); - --ti-picker-panel-icon-color-btn: var(--ti-common-color-icon-normal, #575d6c); - --ti-picker-panel-icon-color-btn-hover: var(--ti-common-color-icon-hover, #5e7ce0); - --ti-picker-panel-icon-color-btn-disabled: var(--ti-common-color-icon-disabled, #adb0b8); + --ti-picker-panel-icon-color-btn: var(--ti-common-color-icon-normal, #808080); + --ti-picker-panel-icon-color-btn-hover: var(--ti-common-color-icon-hover, #191919); + --ti-picker-panel-icon-color-btn-disabled: var(--ti-common-color-icon-disabled, #c2c2c2); --ti-picker-panel-box-shadow: 2px 3px 7px rgba(0, 0, 0, 0.15); - --ti-picker-panel-font-size: var(--ti-common-font-size-2); - --ti-picker-panel-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-picker-panel-bg-color: var(--ti-common-color-light, #fff); + --ti-picker-panel-font-size: var(--ti-common-font-size-2, 16px); + --ti-picker-panel-text-color: var(--ti-common-color-info-normal, #191919); + --ti-picker-panel-bg-color: var(--ti-common-color-light, #ffffff); --ti-picker-panel-selected-bg-color: #f2f2f3; - --ti-picker-panel-border-radius: var(--ti-common-border-radius-normal, 2px); - --ti-picker-panel-border-color: var(--ti-common-color-line-dividing, #dfe1e6); - --ti-picker-panel-hover-bg-color: var(--ti-common-color-selected-background, #5e7ce0); - --ti-picker-panel-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-picker-panel-border-radius: var(--ti-common-border-radius-normal, 6px); + --ti-picker-panel-border-color: var(--ti-common-color-line-dividing, #f0f0f0); + --ti-picker-panel-hover-bg-color: var(--ti-common-color-selected-background, #f5f5f5); + --ti-picker-panel-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); --ti-picker-panel-content-border-color: var(--ti-base-color-common-5, #f0f0f0); --ti-picker-panel-content-padding-top: 12px; --ti-picker-panel-content-padding-left: 16px; @@ -32,17 +32,17 @@ --ti-picker-panel-icon-btn-line-height: 20px; --ti--picker-panel-footer-padding-verticals: 6px; // 无用(hide) - --ti-picker-panel-shortcut-selected-text-color: var(--ti-common-color-selected-text-color, #fff); + --ti-picker-panel-shortcut-selected-text-color: var(--ti-common-color-selected-text-color, #191919); // 无用(hide) - --ti-picker-panel-shortcut-selected-bg-color: var(--ti-common-color-selected-background, #5e7ce0); + --ti-picker-panel-shortcut-selected-bg-color: var(--ti-common-color-selected-background, #f5f5f5); // svg - --ti-picker-panel-svg-fill: var(--ti-common-color-text-weaken); - --ti--picker-panel-svg-hover-fill: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-picker-panel-svg-fill: var(--ti-common-color-text-weaken, #808080); + --ti--picker-panel-svg-hover-fill: var(--ti-common-color-icon-hover, #191919); // footer btn --ti-picker-panel-footer-padding-verticals: 16px; - --ti-picker-panel-link-btn-bg-color: var(--ti-common-color-bg-minor); - --ti-picker-panel-link-btn-text-color: var(--ti-common-color-text-primary); - --ti-picker-panel-link-btn-border-color: var(--ti-common-color-bg-primary-hover); - --ti-picker-panel-link-btn-hover-bg-color: var(--ti-common-color-bg-minor-hover); - --ti-picker-panel-link-btn-hover-border-color: var(--ti-common-color-line-normal); + --ti-picker-panel-link-btn-bg-color: var(--ti-common-color-bg-minor, #ffffff); + --ti-picker-panel-link-btn-text-color: var(--ti-common-color-text-primary, #191919); + --ti-picker-panel-link-btn-border-color: var(--ti-common-color-bg-primary-hover, #595959); + --ti-picker-panel-link-btn-hover-bg-color: var(--ti-common-color-bg-minor-hover, #595959); + --ti-picker-panel-link-btn-hover-border-color: var(--ti-common-color-line-normal, #c2c2c2); } diff --git a/packages/theme/src/date-picker/vars.less b/packages/theme/src/date-picker/vars.less index 792cb9c0e2..91f9bf0d3a 100644 --- a/packages/theme/src/date-picker/vars.less +++ b/packages/theme/src/date-picker/vars.less @@ -12,22 +12,22 @@ .component-css-vars-date-picker() { --ti-date-picker-width: 284px; - --ti-date-picker-font-size: var(--ti-common-font-size-base, 12px); - --ti-date-picker-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-date-picker-bg-color: var(--ti-common-color-light, #fff); - --ti-date-picker-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-date-picker-font-size: var(--ti-common-font-size-base, 14px); + --ti-date-picker-text-color: var(--ti-common-color-info-normal, #191919); + --ti-date-picker-bg-color: var(--ti-common-color-light, #ffffff); + --ti-date-picker-border-radius: var(--ti-common-border-radius-normal, 6px); --ti-date-picker-border-color: transparent; - --ti-date-picker-hover-bg-color: var(--ti-base-color-brand-2, #e9edfa); - --ti-date-picker-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); - --ti-date-picker-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-date-picker-hover-bg-color: var(--ti-base-color-brand-2, #1476ff); + --ti-date-picker-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); + --ti-date-picker-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); --ti-date-picker-selected-bg-color: #f2f2f3; --ti-date-picker-icon-font-size: var(--ti-common-font-size-1, 14px); - --ti-date-picker-current-select-bg-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-date-picker-current-border-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-date-picker-current-select-bg-color: var(--ti-base-color-brand-6, #191919); + --ti-date-picker-current-border-color: var(--ti-base-color-brand-6, #191919); --ti-date-picker-current-border-radius: 0; - --ti-date-picker-range-bg-color: var(--ti-base-color-brand-2, #e9edfa); - --ti-date-picker-range-hover-bg-color: var(--ti-base-color-brand-2, #e9edfa); - --ti-date-picker-header-label-hover-text-color: var(--ti-base-color-brand-2); + --ti-date-picker-range-bg-color: var(--ti-base-color-brand-2, #1476ff); + --ti-date-picker-range-hover-bg-color: var(--ti-base-color-brand-2, #1476ff); + --ti-date-picker-header-label-hover-text-color: var(--ti-base-color-brand-2, #1476ff); --ti-date-picker-header-line-height: 20px; - --ti-date-picker-header-margin-horizontals: var(--ti-common-space-4x); + --ti-date-picker-header-margin-horizontals: var(--ti-common-space-4x, 16px); } diff --git a/packages/theme/src/date-range/vars.less b/packages/theme/src/date-range/vars.less index 3ee4029369..6126ef31f9 100644 --- a/packages/theme/src/date-range/vars.less +++ b/packages/theme/src/date-range/vars.less @@ -14,7 +14,7 @@ --ti-date-range-picker-header-font-size: var(--ti-common-font-size-2, 16px); --ti-date-range-picker-time-header-icon-color: #303133; // header 高度 - --ti-date-range-picker-header-height: calc(var(--ti-common-size-height-normal) + 2px); - --ti-date-range-picker-header-line-height: var(--ti-common-line-height-1); - --ti-date-range-picker-header-margin-bottom: var(--ti-common-space-3x); + --ti-date-range-picker-header-height: calc(var(--ti-common-size-height-normal, 32px) + 2px); + --ti-date-range-picker-header-line-height: var(--ti-common-line-height-1, 22px); + --ti-date-range-picker-header-margin-bottom: var(--ti-common-space-3x, 12px); } diff --git a/packages/theme/src/date-table/vars.less b/packages/theme/src/date-table/vars.less index 7801afed7a..7de60c7ac0 100644 --- a/packages/theme/src/date-table/vars.less +++ b/packages/theme/src/date-table/vars.less @@ -17,30 +17,30 @@ --ti-date-table-td-padding-horizontal: 0; --ti-date-table-td-span-width: 28px; --ti-date-table-td-span-height: 28px; - --ti-date-table-th-text-color: var(--ti-base-color-common-2, #adb0b8); + --ti-date-table-th-text-color: var(--ti-base-color-common-2, #808080); --ti-date-table-td-border-radius: 14px; - --ti-date-table-td-pre-month-text-color: var(--ti-base-color-common-2, #adb0b8); + --ti-date-table-td-pre-month-text-color: var(--ti-base-color-common-2, #808080); // 选中日期文本色 - --ti-date-table-td-normal-text-color: var(--ti-common-color-light, #fff); + --ti-date-table-td-normal-text-color: var(--ti-common-color-light, #ffffff); --ti-date-table-td-range-bg-color: #f2f6fc; --ti-date-table-td-today-border-color: transparent; - --ti-date-table-td-today-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-date-table-week-bg-color-current-select: var(--ti-base-color-brand-8); - --ti-date-table-week-bg-color-current-hover: var(--ti-base-color-brand-8); - --ti-date-table-font-size: var(--ti-common-font-size-base, 12px); - --ti-date-table-hover-bg-color: var(--ti-base-color-brand-8); - --ti-date-table-current-border-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-date-table-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); - --ti-date-table-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); - --ti-date-table-range-bg-color: var(--ti-base-color-brand-8); - --ti-date-table-range-hover-bg-color: var(--ti-base-color-brand-8); - --ti-date-table-bg-color-current-select: var(--ti-base-color-brand-2); - --ti-date-table-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-date-table-td-today-text-color: var(--ti-common-color-info-normal, #191919); + --ti-date-table-week-bg-color-current-select: var(--ti-base-color-brand-8, #deecff); + --ti-date-table-week-bg-color-current-hover: var(--ti-base-color-brand-8, #deecff); + --ti-date-table-font-size: var(--ti-common-font-size-base, 14px); + --ti-date-table-hover-bg-color: var(--ti-base-color-brand-8, #deecff); + --ti-date-table-current-border-color: var(--ti-base-color-brand-6, #191919); + --ti-date-table-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); + --ti-date-table-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); + --ti-date-table-range-bg-color: var(--ti-base-color-brand-8, #deecff); + --ti-date-table-range-hover-bg-color: var(--ti-base-color-brand-8, #deecff); + --ti-date-table-bg-color-current-select: var(--ti-base-color-brand-2, #1476ff); + --ti-date-table-text-color: var(--ti-common-color-info-normal, #191919); --ti-date-table-border-radius-current-select: 14px; - --ti-date-table-td-today-width: calc(var(--ti-common-size-width-mini) + 4px); - --ti-date-table-td-today-height: calc(var(--ti-common-size-height-mini) + 4px); + --ti-date-table-td-today-width: calc(var(--ti-common-size-width-mini, 24px) + 4px); + --ti-date-table-td-today-height: calc(var(--ti-common-size-height-mini, 24px) + 4px); --ti-date-table-td-today-border-radius: 13px; - --ti-date-table-td-today-circle-border-color: var(--ti-base-color-brand); + --ti-date-table-td-today-circle-border-color: var(--ti-base-color-brand, #191919); --ti-date-table-td-today-circle-border-width: 1px; --ti-date-table-td-div-height: 28px; @@ -48,8 +48,8 @@ --ti-date-table-td-span-top: 3px; --ti-date-table-start-date-border-radius: 14px; --ti-date-table-cell-selected-border-radius: 14px; - --ti-date-table-tr-line-height: var(--ti-common-line-height-1); + --ti-date-table-tr-line-height: var(--ti-common-line-height-1, 22px); --ti-date-table-td-disabled-border-radius: 50%; --ti-date-table-td-row-disabled-border-radius: unset; - --ti-date-table-week-height: var(--ti-common-size-height-normal); + --ti-date-table-week-height: var(--ti-common-size-height-normal, 32px); } diff --git a/packages/theme/src/dept/vars.less b/packages/theme/src/dept/vars.less index 9677df60fd..5247957593 100644 --- a/packages/theme/src/dept/vars.less +++ b/packages/theme/src/dept/vars.less @@ -11,10 +11,10 @@ */ .component-css-vars-dept() { - --ti-dept-label-font-size: var(--ti-common-font-size-base, 12px); - --ti-dept-label-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-dept-label-font-size: var(--ti-common-font-size-base, 14px); + --ti-dept-label-text-color: var(--ti-common-color-info-normal, #191919); --ti-dept-label-font-weight: var(--ti-common-font-weight-7, bold); - --ti-dept-selected-info-text-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-dept-selected-info-text-color: var(--ti-base-color-brand-6, #191919); --ti-dept-selected-info-bg-color: #f1f1f1; - --ti-dept-selected-info-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-dept-selected-info-border-radius: var(--ti-common-border-radius-normal, 6px); } diff --git a/packages/theme/src/dialog-box/vars.less b/packages/theme/src/dialog-box/vars.less index 32a77b7819..84fbc21e1a 100644 --- a/packages/theme/src/dialog-box/vars.less +++ b/packages/theme/src/dialog-box/vars.less @@ -12,36 +12,36 @@ .component-css-vars-dialog-box() { // 对话框背景色 - --ti-dialog-box-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-dialog-box-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 对话框圆角 - --ti-dialog-box-border-radius: var(--ti-common-border-radius-4); + --ti-dialog-box-border-radius: var(--ti-common-border-radius-4, 8px); // 对话框阴影 - --ti-dialog-box-shadow: var(--ti-common-shadow-4-down); + --ti-dialog-box-shadow: var(--ti-common-shadow-4-down, 0 8px 24px 0 rgba(0, 0, 0, 0.16)); // 头部边框色(hide) - --ti-dialog-box-head-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-dialog-box-head-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 头部文本色(hide) - --ti-dialog-box-head-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-dialog-box-head-text-color: var(--ti-common-color-text-primary, #191919); // 头部上内边距 --ti-dialog-box-head-padding-top: var(--ti-common-space-8x, 32px); // 头部水平内边距 --ti-dialog-box-head-padding-horizontal: var(--ti-common-space-8x, 32px); // 头部下内边距 - --ti-dialog-box-head-padding-bottom: var(--ti-common-space-6x); + --ti-dialog-box-head-padding-bottom: var(--ti-common-space-6x, 24px); // 头部字号 - --ti-dialog-box-head-title-font-size: var(--ti-common-font-size-4); + --ti-dialog-box-head-title-font-size: var(--ti-common-font-size-4, 20px); // 头部字重 --ti-dialog-box-head-title-font-weight: var(--ti-common-font-weight-7, bold); // 头部文本色 - --ti-dialog-box-head-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-dialog-box-head-title-text-color: var(--ti-common-color-text-primary, #191919); // 头部底边框颜色 --ti-dialog-box-head-border-bottom-color: var(--ti-common-color-transparent, transparent); // 头部字体图标色(hide) - --ti-dialog-box-head-font-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-dialog-box-head-font-icon-color: var(--ti-common-color-icon-normal, #808080); // 头部字体图标悬浮颜色(hide) - --ti-dialog-box-head-font-icon-color-hover: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-dialog-box-head-font-icon-color-hover: var(--ti-common-color-icon-hover, #191919); // 头部主体色(hide) - --ti-dialog-box-head-body-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-dialog-box-head-body-text-color: var(--ti-common-color-text-primary, #191919); // 头部主体字号(hide) --ti-dialog-box-head-body-font-size: var(--ti-common-font-size-1, 14px); @@ -50,13 +50,13 @@ // 关闭按钮高度 --ti-dialog-box-btn-height: var(--ti-dialog-box-btn-width); // 关闭按钮圆角 - --ti-dialog-box-btn-border-radius: var(--ti-common-border-radius-1, 4px); + --ti-dialog-box-btn-border-radius: var(--ti-common-border-radius-1, 2px); // 关闭按钮图标尺寸 - --ti-dialog-box-close-icon-size: var(--ti-common-font-size-5); + --ti-dialog-box-close-icon-size: var(--ti-common-font-size-5, 24px); // 关闭按钮图标色 - --ti-dialog-box-close-icon-color: var(--ti-common-color-icon-normal); + --ti-dialog-box-close-icon-color: var(--ti-common-color-icon-normal, #808080); // 关闭按钮悬浮图标色 - --ti-dialog-box-close-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-dialog-box-close-icon-color-hover: var(--ti-common-color-icon-hover, #191919); // 关闭按钮悬浮背景色 --ti-dialog-box-btn-background-color-hover: none; // 关闭按钮与上边框的距离(hide) @@ -65,22 +65,22 @@ --ti-dialog-box-btn-position-right: var(--ti-common-space-5x, 20px); // 内容字号 - --ti-dialog-box-body-font-size: var(--ti-common-font-size-base, 12px); + --ti-dialog-box-body-font-size: var(--ti-common-font-size-base, 14px); // 内容字体色 - --ti-dialog-box-body-text-color: var(--ti-common-color-text-secondary); + --ti-dialog-box-body-text-color: var(--ti-common-color-text-secondary, #595959); // 右侧弹窗内容字体色 - --ti-dialog-box-drawer-body-color: var(--ti-common-color-text-primary); + --ti-dialog-box-drawer-body-color: var(--ti-common-color-text-primary, #191919); // 内容垂直内边距 --ti-dialog-box-body-padding-vertical: var(--ti-common-space-0, 0px); // 内容水平内边距 --ti-dialog-box-body-padding-horizontal: var(--ti-common-space-8x, 32px); // 底部上内边距 - --ti-dialog-box-footer-padding-top: var(--ti-common-space-6x); + --ti-dialog-box-footer-padding-top: var(--ti-common-space-6x, 24px); // 底部水平内边距 --ti-dialog-box-footer-padding-horizontal: var(--ti-common-space-8x, 32px); // 底部下内边距 - --ti-dialog-box-footer-margin-bottom: var(--ti-common-space-8x); + --ti-dialog-box-footer-margin-bottom: var(--ti-common-space-8x, 32px); // 抽屉最小宽度 --ti-dialog-box-drawer-min-width: calc(var(--ti-common-space-10, 10px) * 50); @@ -89,7 +89,7 @@ // 抽屉左内边距 --ti-dialog-box-drawer-padding-left: var(--ti-common-space-8x, 32px); // 抽屉右内边距 - --ti-dialog-box-drawer-padding-right: var(--ti-common-space-8x); + --ti-dialog-box-drawer-padding-right: var(--ti-common-space-8x, 32px); // 抽屉头部上内边距 --ti-dialog-box-drawer-header-padding-top: var(--ti-common-space-8x, 32px); // 抽屉头部下内边距 @@ -97,19 +97,19 @@ // 抽屉头部左内边距 --ti-dialog-box-drawer-header-padding-left: var(--ti-common-space-0, 0px); // 抽屉头部右内边距 - --ti-dialog-box-drawer-body-padding-right: var(--ti-common-space-8x); + --ti-dialog-box-drawer-body-padding-right: var(--ti-common-space-8x, 32px); // 抽屉内容上内边距 --ti-dialog-box-drawer-body-padding-top: var(--ti-common-space-0, 0px); // 抽屉内容下内边距 --ti-dialog-box-drawer-body-padding-bottom: var(--ti-common-space-0, 0px); // 抽屉内容左内边距 - --ti-dialog-box-drawer-body-padding-left: var(--ti-common-space-8x); + --ti-dialog-box-drawer-body-padding-left: var(--ti-common-space-8x, 32px); // 抽屉内容右内边距 --ti-dialog-box-drawer-header-padding-right: var(--ti-common-space-0, 0px); // 抽屉底部文本对齐方式 --ti-dialog-box-drawer-footer-text-align: right; // 抽屉底部上内边距 - --ti-dialog-box-drawer-footer-padding-top: var(--ti-common-space-6x); + --ti-dialog-box-drawer-footer-padding-top: var(--ti-common-space-6x, 24px); // 抽屉底部下内边距 --ti-dialog-box-drawer-footer-padding-bottom: var(--ti-common-space-8x, 32px); // 抽屉底部左内边距 @@ -121,9 +121,9 @@ // 抽屉底部右外边距 --ti-dialog-box-drawer-footer-margin-right: var(--ti-common-space-10x, 40px); // 抽屉内容与底部边框颜色 - --ti-dialog-box-drawer-divider-border-color: var(--ti-common-color-line-dividing); + --ti-dialog-box-drawer-divider-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 抽屉头部与底部边框颜色 - --ti-dialog-box-header-divider-border-color: var(--ti-common-color-transparent); + --ti-dialog-box-header-divider-border-color: var(--ti-common-color-transparent, transparent); // 抽屉边框圆角 --ti-dialog-box-drawer-radius: var(--ti-common-space-0, 0px); // 弹窗布局模式(hide) @@ -133,13 +133,13 @@ // 底部布局显示 --ti-dialog-box-footer-align: right; // 缩放按钮 - --ti-dialog-box-resize-icon-color: var(--ti-common-color-icon-normal); + --ti-dialog-box-resize-icon-color: var(--ti-common-color-icon-normal, #808080); // 缩放按钮悬浮状态 - --ti-dialog-box-resize-icon-color-hover: var(--ti-common-color-icon-normal); + --ti-dialog-box-resize-icon-color-hover: var(--ti-common-color-icon-normal, #808080); // 缩放按钮大小 - --ti-dialog-box-resize-icon-size: var(--ti-common-font-size-2); + --ti-dialog-box-resize-icon-size: var(--ti-common-font-size-2, 16px); // 按钮距离顶部距离 - --ti-dialog-box-btn-tools-position-top: var(--ti-common-size-3x); + --ti-dialog-box-btn-tools-position-top: var(--ti-common-size-3x, 12px); // 按钮距离右侧距离 - --ti-dialog-box-btn-tools-position-right: var(--ti-common-size-3x); + --ti-dialog-box-btn-tools-position-right: var(--ti-common-size-3x, 12px); } diff --git a/packages/theme/src/dialog-select/vars.less b/packages/theme/src/dialog-select/vars.less index f2bccd4122..513428f92c 100644 --- a/packages/theme/src/dialog-select/vars.less +++ b/packages/theme/src/dialog-select/vars.less @@ -24,7 +24,7 @@ // 选择主体的边框样式 --ti-dialog-select-body-box-border-style: var(--ti-common-border-style-solid, solid); // 选择主题的边框颜色 - --ti-dialog-select-body-box-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-dialog-select-body-box-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 选择底部的水平方向内边距 --ti-dialog-select-footer-padding-horizontal: var(--ti-common-space-6x, 24px); // 选择底部的垂直方向的内边距 @@ -42,7 +42,7 @@ // 面板分割线的背景色 --ti-dialog-select-split-bg-color: rgba(22, 30, 38, 0.2); // 面板分割线左侧内边距 - --ti-dialog-select-split-simple-padding-left: var(--ti-common-dropdown-gap, 2px); + --ti-dialog-select-split-simple-padding-left: var(--ti-common-dropdown-gap, 4px); // 面板分割线右侧内边距 - --ti-dialog-select-split-simple-padding-right: var(--ti-common-dropdown-gap, 2px); + --ti-dialog-select-split-simple-padding-right: var(--ti-common-dropdown-gap, 4px); } \ No newline at end of file diff --git a/packages/theme/src/divider/vars.less b/packages/theme/src/divider/vars.less index 8ddc05915a..54ad8aee56 100644 --- a/packages/theme/src/divider/vars.less +++ b/packages/theme/src/divider/vars.less @@ -1,10 +1,10 @@ .component-css-vars-divider() { // 不开放(hide) - --ti-divider-dividing-line: var(--ti-common-color-bg-dark-disabled); + --ti-divider-dividing-line: var(--ti-common-color-bg-dark-disabled, #dbdbdb); // 文案背景色 - --ti-divider-text-bg-color: var(--ti-common-color-line-dividing); + --ti-divider-text-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 文案文本色 - --ti-divider-text-color: var(--ti-common-color-text-primary); + --ti-divider-text-color: var(--ti-common-color-text-primary, #191919); //分割线横向透明度 --ti-divider-horizontal-opacity: 1; //分割线纵向透明度 diff --git a/packages/theme/src/drawer/vars.less b/packages/theme/src/drawer/vars.less index 75a40f686d..7e43ff35d8 100644 --- a/packages/theme/src/drawer/vars.less +++ b/packages/theme/src/drawer/vars.less @@ -16,11 +16,11 @@ // 最大宽度 --ti-drawer-max-width: calc(var(--ti-common-space-10, 10px) * 100); // 背景色 - --ti-drawer-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-drawer-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 左内边距 --ti-drawer-padding-left: var(--ti-common-space-8x, 32px); // 右内边距 - --ti-drawer-padding-right: var(--ti-common-space-8x); + --ti-drawer-padding-right: var(--ti-common-space-8x, 32px); // 遮罩层背景色 --ti-drawer-mask-bg-color: rgba(0, 0, 0, 16%); // 阴影 @@ -28,69 +28,69 @@ // 头部与底部边框颜色 --ti-drawer-divider-border-color: transparent; // 边框圆角 - --ti-drawer-radius: var(--ti-common-space-0, 0); + --ti-drawer-radius: var(--ti-common-space-0, 0px); // 遮罩层背景色 --ti-drawer-mask-bg-color: var(--ti-mobile-color-bg-mask); // 头部上内边距 --ti-drawer-header-padding-top: var(--ti-common-space-8x, 32px); // 头部下内边距 - --ti-drawer-header-padding-bottom: var(--ti-common-space-6x); + --ti-drawer-header-padding-bottom: var(--ti-common-space-6x, 24px); // 头部左内边距 - --ti-drawer-header-padding-left: var(--ti-common-space-0, 0); + --ti-drawer-header-padding-left: var(--ti-common-space-0, 0px); // 头部右内边距 - --ti-drawer-body-padding-right: var(--ti-common-space-0, 0); + --ti-drawer-body-padding-right: var(--ti-common-space-0, 0px); // 头部字号 - --ti-drawer-head-title-font-size: var(--ti-common-font-size-4); + --ti-drawer-head-title-font-size: var(--ti-common-font-size-4, 20px); // 头部文本色(hide) - --ti-drawer-head-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-drawer-head-text-color: var(--ti-common-color-text-primary, #191919); // 头部标题字重 --ti-drawer-head-title-font-weight: var(--ti-common-font-weight-7, bold); // 头部标题字体色 - --ti-drawer-head-title-text-color: var(--ti-common-color-text-gray); + --ti-drawer-head-title-text-color: var(--ti-common-color-text-gray, #191919); // 关闭按钮宽度 - --ti-drawer-btn-width: var(--ti-common-size-width-mini); + --ti-drawer-btn-width: var(--ti-common-size-width-mini, 24px); // 关闭按钮高度 - --ti-drawer-btn-height: var(--ti-common-size-width-mini); + --ti-drawer-btn-height: var(--ti-common-size-width-mini, 24px); // 关闭按钮图标尺寸 - --ti-drawer-close-icon-size: var(--ti-common-font-size-5); + --ti-drawer-close-icon-size: var(--ti-common-font-size-5, 24px); // 关闭按钮圆角 - --ti-drawer-btn-border-radius: var(--ti-common-border-radius-1, 4px); + --ti-drawer-btn-border-radius: var(--ti-common-border-radius-1, 2px); // 关闭按钮图标色 - --ti-drawer-close-icon-color: var(--ti-common-color-icon-normal); + --ti-drawer-close-icon-color: var(--ti-common-color-icon-normal, #808080); // 关闭按钮悬浮图标色 - --ti-drawer-close-icon-color-hover: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-drawer-close-icon-color-hover: var(--ti-common-color-icon-hover, #191919); // 关闭按钮与上边框的距离(hide) - --ti-drawer-btn-position-top: var(--ti-common-space-5x); + --ti-drawer-btn-position-top: var(--ti-common-space-5x, 20px); // 关闭按钮与右边框的距离(hide) - --ti-drawer-btn-position-right: var(--ti-common-space-5x); + --ti-drawer-btn-position-right: var(--ti-common-space-5x, 20px); // 标题与帮助图标间距 --ti-drawer-help-icon-margin-left: var(--ti-common-space-2x, 8px); // 帮助图标宽高 --ti-drawer-help-icon-width-height: var(--ti-common-space-4x, 16px); // 帮助图标色 - --ti-drawer-help-icon-color: var(--ti-common-color-icon); + --ti-drawer-help-icon-color: var(--ti-common-color-icon, #191919); // 内容上内边距 - --ti-drawer-body-padding-top: var(--ti-common-space-0, 0); + --ti-drawer-body-padding-top: var(--ti-common-space-0, 0px); // 内容下内边距 - --ti-drawer-body-padding-bottom: var(--ti-common-space-0, 0); + --ti-drawer-body-padding-bottom: var(--ti-common-space-0, 0px); // 内容左内边距 - --ti-drawer-body-padding-left: var(--ti-common-space-0, 0); + --ti-drawer-body-padding-left: var(--ti-common-space-0, 0px); // 内容右内边距 - --ti-drawer-header-padding-right: var(--ti-common-space-0, 0); + --ti-drawer-header-padding-right: var(--ti-common-space-0, 0px); // 内容底部边框色(hide) - --ti-drawer-divider-body-border-color: var(--ti-common-color-line-dividing); + --ti-drawer-divider-body-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 底部按钮对齐方式 --ti-drawer-footer-justify-content: flex-end; // 底部上内边距 - --ti-drawer-footer-padding-top: var(--ti-common-space-6x); + --ti-drawer-footer-padding-top: var(--ti-common-space-6x, 24px); // 底部下内边距 --ti-drawer-footer-padding-bottom: var(--ti-common-space-8x, 32px); // 底部左内边距 - --ti-drawer-footer-padding-left: var(--ti-common-space-0, 0); + --ti-drawer-footer-padding-left: var(--ti-common-space-0, 0px); // 底部右内边距 - --ti-drawer-footer-padding-right: var(--ti-common-space-0, 0); + --ti-drawer-footer-padding-right: var(--ti-common-space-0, 0px); // 底部左外边距 --ti-drawer-footer-margin-left: var(--ti-common-space-8x, 32px); // 底部右外边距 @@ -98,7 +98,7 @@ // 底部按钮间距 --ti-drawer-divider-footer-button-margin-left: var(--ti-common-space-2x, 8px); // 底部边框色(hide) - --ti-drawer-divider-footer-border-color: var(--ti-common-color-transparent); + --ti-drawer-divider-footer-border-color: var(--ti-common-color-transparent, transparent); // 内容区域上边距 --ti-drawer-padding-top: 0px; // 内容区域下边距 diff --git a/packages/theme/src/drop-times/vars.less b/packages/theme/src/drop-times/vars.less index 75b8e498eb..3ea1f93cb8 100644 --- a/packages/theme/src/drop-times/vars.less +++ b/packages/theme/src/drop-times/vars.less @@ -18,9 +18,9 @@ // 时间选择选项字体字重 --ti-drop-times-item-selected-font-weight: 500; // 时间选择选项字体色(选中项) - --ti-drop-times-item-selected-color: var(--ti-common-color-text-link); + --ti-drop-times-item-selected-color: var(--ti-common-color-text-link, #1476ff); // 时间选择选项悬浮背景色(选中项) - --ti-drop-times-item-select-hover-bg-color: var(--ti-common-color-selected-background); + --ti-drop-times-item-select-hover-bg-color: var(--ti-common-color-selected-background, #f5f5f5); // 时间选择选项悬浮背景色 - --ti-drop-times-item-hover-bg-color: var(--ti-common-color-bg-disabled); + --ti-drop-times-item-hover-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); } \ No newline at end of file diff --git a/packages/theme/src/dropdown-item/vars.less b/packages/theme/src/dropdown-item/vars.less index 04b2029c91..c0dbde4211 100644 --- a/packages/theme/src/dropdown-item/vars.less +++ b/packages/theme/src/dropdown-item/vars.less @@ -12,33 +12,33 @@ .component-css-vars-dropdown-item() { // 下拉菜单项高度 - --ti-dropdown-item-height: var(--ti-common-size-height-normal); + --ti-dropdown-item-height: var(--ti-common-size-height-normal, 32px); // 下拉菜单项悬浮背景色 - --ti-dropdown-item-hover-bg-color: var(--ti-common-color-bg-normal); + --ti-dropdown-item-hover-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 下拉菜单项选中背景色 - --ti-dropdown-item-bg-color-selected: var(--ti-common-color-bg-white-normal); + --ti-dropdown-item-bg-color-selected: var(--ti-common-color-bg-white-normal, #ffffff); // 下拉菜单项选中文本字重 - --ti-dropdown-item-font-weight-selected: var(--ti-common-font-weight-6); + --ti-dropdown-item-font-weight-selected: var(--ti-common-font-weight-6, 600); // 下拉菜单项选中文本色 --ti-dropdown-item-text-color-selected: #1476ff; // 下拉菜单非禁用项悬浮文本色 - --ti-dropdown-item-hover-text-color: var(--ti-common-color-text-primary); + --ti-dropdown-item-hover-text-color: var(--ti-common-color-text-primary, #191919); // 下拉菜单项点击瞬间背景色 - --ti-dropdown-item-active-bg-color: var(--ti-common-color-bg-white-normal); + --ti-dropdown-item-active-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 下拉菜单项点击瞬间文本色 --ti-dropdown-item-active-text-color: #1476ff; // 下拉菜单项禁用文本色 - --ti-dropdown-item-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-dropdown-item-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 下拉菜单项文本色 - --ti-dropdown-item-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-dropdown-item-text-color: var(--ti-common-color-text-primary, #191919); // 下拉菜单项字号 - --ti-dropdown-item-font-size: var(--ti-common-font-size-base, 12px); + --ti-dropdown-item-font-size: var(--ti-common-font-size-base, 14px); // 默认尺寸下拉菜单项的行高 --ti-dropdown-item-line-height: var(--ti-common-line-height-number, 1.5); // 下拉菜单项垂直外边距 - --ti-dropdown-item-margin-vertical: var(--ti-common-space-0); + --ti-dropdown-item-margin-vertical: var(--ti-common-space-0, 0px); // 下拉菜单项水平外边距 - --ti-dropdown-item-margin-horizontal: var(--ti-common-space-4x); + --ti-dropdown-item-margin-horizontal: var(--ti-common-space-4x, 16px); // 拉菜单项底部外边距 --ti-dropdown-item-margin-bottom: var(--ti-common-space-0, 0px); // 拉菜单项左边外边距 @@ -48,25 +48,25 @@ // 拉菜单项顶部外边距 --ti-dropdown-item-margin-top: var(--ti-common-space-0, 0px); // 下拉菜单项边框圆角 - --ti-dropdown-item-border-radius: var(--ti-common-border-radius-0, 0px); + --ti-dropdown-item-border-radius: var(--ti-common-border-radius-0, 0); // 下拉菜单项最大宽度 - --ti-dropdown-item-max-width: var(--ti-common-size-auto); + --ti-dropdown-item-max-width: var(--ti-common-size-auto, auto); // 下拉项图标默认填充色 - --ti-dropdown-item-icon-color: var(--ti-common-color-icon-normal); + --ti-dropdown-item-icon-color: var(--ti-common-color-icon-normal, #808080); //下拉项图标悬浮填充色 - --ti-dropdown-item-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-dropdown-item-icon-color-hover: var(--ti-common-color-icon-hover, #191919); // 下拉项图标激活时填充色 --ti-dropdown-item-icon-color-active: var(--ti-common-color-icon-white, #fff); // 下拉项图标禁用填充色 - --ti-dropdown-item-icon-color-disabled: var(--ti-common-color-icon-disabled, #adb0b8); + --ti-dropdown-item-icon-color-disabled: var(--ti-common-color-icon-disabled, #c2c2c2); // 下拉项展开图标的左侧外边距 - --ti-dropdown-item-expand-svg-margin-left: var(--ti-common-space-0); + --ti-dropdown-item-expand-svg-margin-left: var(--ti-common-space-0, 0px); // 下拉项展开图标的右侧外边距 - --ti-dropdown-item-expand-svg-margin-right: var(--ti-common-space-2x); + --ti-dropdown-item-expand-svg-margin-right: var(--ti-common-space-2x, 8px); // 下拉项内容的左侧外边距 --ti-dropdown-item-content-margin-left: calc(var(--ti-dropdown-item-expand-icon-size) + var(--ti-common-space-2x)); // 下拉项内容悬浮时的字重 - --ti-dropdown-item-content-font-weight-hover: var(--ti-common-font-weight-4); + --ti-dropdown-item-content-font-weight-hover: var(--ti-common-font-weight-4, normal); // 有二级菜单下拉项内容悬浮时的文本色 --ti-dropdown-item-content-text-hover: #1476ff; // 有二级菜单下拉项内容悬浮时的背景色 @@ -76,7 +76,7 @@ // 下拉项分割线样式 --ti-dropdown-item-divided-border-style: var(--ti-common-border-style-solid, solid); // 下拉项分割线颜色 - --ti-dropdown-item-divided-border-color: var(--ti-common-color-line-dividing); + --ti-dropdown-item-divided-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 下拉项前置伪元素的填充色 --ti-dropdown-item-before-bg-color: transparent; // 下拉项前置伪元素的垂直外边距 @@ -98,7 +98,7 @@ // 迷你尺寸下拉项前置伪元素的高度 --ti-dropdown-item-mini-before-height: 3px; // 中尺寸下拉菜单菜单项的行高 - --ti-dropdown-item-medium-line-height: var(--ti-common-size-height-normal, 28px); + --ti-dropdown-item-medium-line-height: var(--ti-common-size-height-normal, 32px); // 中尺寸下拉菜单菜单项的字号 --ti-dropdown-item-medium-font-size: var(--ti-common-font-size-1, 14px); // 中尺寸下拉菜单菜单项的垂直内边距 @@ -108,25 +108,25 @@ // 中尺寸下拉菜单菜单项分割线的顶部外边距 --ti-dropdown-item-medium-divided-margin-top: var(--ti-common-space-6, 6px); // 小尺寸下拉菜单菜单项的行高 - --ti-dropdown-item-small-line-height: var(--ti-common-line-height-5, 24px); + --ti-dropdown-item-small-line-height: var(--ti-common-line-height-5, 36px); // 小尺寸下拉菜单菜单项的垂直内边距 --ti-dropdown-item-small-padding-vertical: var(--ti-common-space-0, 0px); // 小尺寸下拉菜单菜单项的水平内边距 --ti-dropdown-item-small-padding-horizontal: var(--ti-common-space-4x, 16px); // 小尺寸下拉菜单菜单项的字号 - --ti-dropdown-item-small-font-size: var(--ti-common-font-size-base, 12px); + --ti-dropdown-item-small-font-size: var(--ti-common-font-size-base, 14px); // 小尺寸下拉菜单菜单项分割线的顶部外边距 --ti-dropdown-item-small-divided-margin-top: var(--ti-common-space-base, 4px); // 迷你尺寸下拉菜单菜单项的行高 - --ti-dropdown-item-mini-line-height: var(--ti-common-line-height-5, 24px); + --ti-dropdown-item-mini-line-height: var(--ti-common-line-height-5, 36px); // 迷你尺寸下拉菜单菜单项的垂直内边距 --ti-dropdown-item-mini-padding-vertical: var(--ti-common-space-0, 0px); // 迷你尺寸下拉菜单菜单项的水平内边距 --ti-dropdown-item-mini-padding-horizontal: var(--ti-common-space-10, 10px); // 迷你尺寸下拉菜单菜单项的字号 - --ti-dropdown-item-mini-font-size: var(--ti-common-font-size-base, 12px); + --ti-dropdown-item-mini-font-size: var(--ti-common-font-size-base, 14px); // 迷你尺寸下拉菜单菜单项分割线的顶部外边距 --ti-dropdown-item-mini-divided-margin-top: calc(var(--ti-common-space-1, 1px) * 3); // 展开图标尺寸 - --ti-dropdown-item-expand-icon-size: var(--ti-common-font-size-2); + --ti-dropdown-item-expand-icon-size: var(--ti-common-font-size-2, 16px); } diff --git a/packages/theme/src/dropdown-menu/vars.less b/packages/theme/src/dropdown-menu/vars.less index 38c2de5824..3967c2b467 100644 --- a/packages/theme/src/dropdown-menu/vars.less +++ b/packages/theme/src/dropdown-menu/vars.less @@ -14,19 +14,19 @@ // 下拉菜单边框的宽度 --ti-dropdown-menu-border-width: 0; // 下拉菜单边框的颜色 - --ti-dropdown-menu-border-color: var(--ti-common-color-light, #fff); + --ti-dropdown-menu-border-color: var(--ti-common-color-light, #ffffff); // 下拉菜单弹框的阴影 --ti-dropdown-menu-box-shadow: var(--ti-common-shadow-2-down, 0 2px 8px 0 rgba(0, 0, 0, 0.2)); // 下拉菜单弹框的背景色 - --ti-dropdown-menu-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-dropdown-menu-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 下拉菜单弹框的圆角 - --ti-dropdown-menu-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-dropdown-menu-border-radius: var(--ti-common-border-radius-normal, 6px); // 下拉菜单的最小宽度 --ti-dropdown-menu-min-width: 124px; // 下拉菜单弹框与触发按钮的距离 --ti-dropdown-menu-margin-vertical: var(--ti-common-space-base, 4px); // 下拉菜单弹框的垂直内边距 - --ti-dropdown-menu-padding-vertical: var(--ti-common-space-2x); + --ti-dropdown-menu-padding-vertical: var(--ti-common-space-2x, 8px); // 下拉菜单弹框的水平内边距 --ti-dropdown-menu-padding-horizontal: var(--ti-common-space-0, 0px); // 下拉菜单中尺寸的弹框垂直内边距 @@ -40,13 +40,13 @@ // 下拉菜单弹框箭头的尺寸 --ti-dropdown-menu-arrow-border-width: 6px; // 下拉菜单带箭头弹框的底部外边距 - --ti-dropdown-menu-arrow-margin-bottom: var(--ti-common-space-3x); + --ti-dropdown-menu-arrow-margin-bottom: var(--ti-common-space-3x, 12px); // 下拉菜单带箭头弹框的顶部外边距 - --ti-dropdown-menu-arrow-margin-top: var(--ti-common-space-3x); + --ti-dropdown-menu-arrow-margin-top: var(--ti-common-space-3x, 12px); // 下拉菜单弹框箭头的边框色 - --ti-dropdown-menu-arrow-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-dropdown-menu-arrow-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 下拉菜单弹框箭头的颜色 - --ti-dropdown-menu-arrow-after-border-color: var(--ti-common-color-light, #fff); + --ti-dropdown-menu-arrow-after-border-color: var(--ti-common-color-light, #ffffff); // 下拉菜单弹框周边的填充色 --ti-dropdown-menu-arrow-after-default-border-color: var(--ti-common-color-transparent, transparent); } diff --git a/packages/theme/src/espace/vars.less b/packages/theme/src/espace/vars.less index b6576636e4..f8b6b07c99 100644 --- a/packages/theme/src/espace/vars.less +++ b/packages/theme/src/espace/vars.less @@ -12,6 +12,6 @@ .component-css-vars-espace() { --ti-espace-font-size: 26px; - --ti-espace-text-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-espace-hover-text-color: var(--ti-base-color-brand-5, #7693f5); + --ti-espace-text-color: var(--ti-base-color-brand-6, #191919); + --ti-espace-hover-text-color: var(--ti-base-color-brand-5, #c2c2c2); } diff --git a/packages/theme/src/fall-menu/vars.less b/packages/theme/src/fall-menu/vars.less index 2dfb54474e..23d6dc5d96 100644 --- a/packages/theme/src/fall-menu/vars.less +++ b/packages/theme/src/fall-menu/vars.less @@ -14,29 +14,29 @@ // 菜单列表高度 --ti-fall-menu-menu-height: var(--ti-common-size-height-large, 48px); // 菜单背景色 - --ti-fall-menu-bg-color-normal: var(--ti-common-color-bg-navigation); + --ti-fall-menu-bg-color-normal: var(--ti-common-color-bg-navigation, #ffffff); // 菜单项悬浮背景色 - --ti-fall-menu-bg-color-hover: var(--ti-common-color-hover-background); + --ti-fall-menu-bg-color-hover: var(--ti-common-color-hover-background, #f5f5f5); // 左右图标大小 - --ti-fall-menu-icon-font-size: var(--ti-common-font-size-base, 12px); + --ti-fall-menu-icon-font-size: var(--ti-common-font-size-base, 14px); // 菜单项文本色 - --ti-fall-menu-slot-text-color: var(--ti-common-color-text-gray); + --ti-fall-menu-slot-text-color: var(--ti-common-color-text-gray, #191919); // 悬浮下拉框背景色 - --ti-fall-menu-slot-bg-color: var(--ti-common-color-bg-navigation); + --ti-fall-menu-slot-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 菜单项字号 --ti-fall-menu-title-font-size: var(--ti-common-font-size-2, 16px); // 下拉框标题文本色 - --ti-fall-menu-box-title-text-color: var(--ti-common-color-text-gray); + --ti-fall-menu-box-title-text-color: var(--ti-common-color-text-gray, #191919); // 下拉框文本色 - --ti-fall-menu-box-text-color: var(--ti-common-color-text-secondary); + --ti-fall-menu-box-text-color: var(--ti-common-color-text-secondary, #595959); // 下拉框标题字号 --ti-fall-menu-box-font-size: var(--ti-common-font-size-1, 14px); // 下拉框标题高度 - --ti-fall-menu-box-title-height: var(--ti-common-size-height-small, 32px); + --ti-fall-menu-box-title-height: var(--ti-common-size-height-small, 24px); // 下拉框内容高度 --ti-fall-menu-box-content-height: 26px; // 下拉框悬浮文本色 - --ti-fall-menu-box-hover-text-color: var(--ti-common-color-text-gray); + --ti-fall-menu-box-hover-text-color: var(--ti-common-color-text-gray, #191919); // 标签下边框颜色值 - --ti-fall-menu-li-color-hover: var(--ti-common-color-line-active); + --ti-fall-menu-li-color-hover: var(--ti-common-color-line-active, #191919); } diff --git a/packages/theme/src/filter-box/vars.less b/packages/theme/src/filter-box/vars.less index c0554aaa2b..b5bcf23644 100644 --- a/packages/theme/src/filter-box/vars.less +++ b/packages/theme/src/filter-box/vars.less @@ -11,31 +11,31 @@ */ .component-css-vars-filter-box() { // 按钮高度 - --ti-filter-box-btn-height: var(--ti-common-size-height-small); + --ti-filter-box-btn-height: var(--ti-common-size-height-small, 24px); // 按钮背景色 - --ti-filter-box-btn-bg-color: var(--ti-common-color-bg-6); + --ti-filter-box-btn-bg-color: var(--ti-common-color-bg-6, #f5f5f5); // 按钮展开图标尺寸 - --ti-filter-box-btn-hover-bg-color: var(--ti-common-color-bg-6); + --ti-filter-box-btn-hover-bg-color: var(--ti-common-color-bg-6, #f5f5f5); // 按钮水平内边距 - --ti-filter-box-btn-padding-horizontal: var(--ti-common-space-2x); + --ti-filter-box-btn-padding-horizontal: var(--ti-common-space-2x, 8px); // 按钮文本色 - --ti-filter-box-btn-text-color: var(--ti-common-color-text-weaken); + --ti-filter-box-btn-text-color: var(--ti-common-color-text-weaken, #808080); // 按钮悬浮文本色和图标色 - --ti-filter-box-btn-hover-text-color: var(--ti-common-color-text-primary); + --ti-filter-box-btn-hover-text-color: var(--ti-common-color-text-primary, #191919); // 按钮文本字号 --ti-filter-box-btn-font-size: var(--ti-common-font-size-0, 12px); // 按钮文本行高 - --ti-filter-box-btn-title-line-height: var(--ti-common-line-height-number); + --ti-filter-box-btn-title-line-height: var(--ti-common-line-height-number, 1.5); // 按钮问号图标色 - --ti-filter-box-help-btn-icon-color: var(--ti-common-color-text-primary); + --ti-filter-box-help-btn-icon-color: var(--ti-common-color-text-primary, #191919); // 按钮帮助图标右边距 - --ti-filter-box-help-btn-margin-right: var(--ti-common-space-base); + --ti-filter-box-help-btn-margin-right: var(--ti-common-space-base, 4px); // 按钮问号top定位(hide) - --ti-filter-box-help-btn-position-top: var(--ti-common-space-base); + --ti-filter-box-help-btn-position-top: var(--ti-common-space-base, 4px); // 按钮展开图标色 - --ti-filter-box-expand-btn-icon-color: var(--ti-common-color-icon-normal); + --ti-filter-box-expand-btn-icon-color: var(--ti-common-color-icon-normal, #808080); // 按钮展开图标悬浮色 - --ti-filter-box-expand-btn-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-filter-box-expand-btn-icon-color-hover: var(--ti-common-color-icon-hover, #191919); // 按钮展开图标尺寸 - --ti-filter-box-expand-btn-icon-size: var(--ti-common-font-size-2); + --ti-filter-box-expand-btn-icon-size: var(--ti-common-font-size-2, 16px); } diff --git a/packages/theme/src/filter-panel/vars.less b/packages/theme/src/filter-panel/vars.less index 8b5d80bd56..1b8eb28a15 100644 --- a/packages/theme/src/filter-panel/vars.less +++ b/packages/theme/src/filter-panel/vars.less @@ -11,11 +11,11 @@ */ .component-css-vars-filter-panel() { // 面板上外边距 - --ti-filter-panel-margin-top: var(--ti-common-space-2x); + --ti-filter-panel-margin-top: var(--ti-common-space-2x, 8px); // 面板垂直内边距 - --ti-filter-panel-padding-vertical: var(--ti-common-space-6x); + --ti-filter-panel-padding-vertical: var(--ti-common-space-6x, 24px); // 面板水平内边距 - --ti-filter-panel-padding-horizontal: var(--ti-common-space-6x); + --ti-filter-panel-padding-horizontal: var(--ti-common-space-6x, 24px); // 朝下的面板阴影 --ti-filter-panel-bottom-box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.18); // 朝上的面板阴影 diff --git a/packages/theme/src/float-button/vars.less b/packages/theme/src/float-button/vars.less index e8d191d041..70ce9928ee 100644 --- a/packages/theme/src/float-button/vars.less +++ b/packages/theme/src/float-button/vars.less @@ -12,11 +12,11 @@ .component-css-vars-float-button() { // 按钮圆角 - --ti-float-button-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-float-button-border-radius: var(--ti-common-border-radius-normal, 6px); // 按钮字号 - --ti-float-button-font-size: var(--ti-common-font-size-base, 12px); + --ti-float-button-font-size: var(--ti-common-font-size-base, 14px); // 朴素类按钮禁用文本色(非默认) - --ti-float-button-plain-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-plain-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 按钮边框尺寸 --ti-float-button-border-width: var(--ti-common-border-weight-normal, 1px); // 按钮边框样式 @@ -29,7 +29,7 @@ // 默认按钮最大宽度 --ti-float-button-size-normal-max-width: 80px; // 默认按钮的高度 - --ti-float-button-size-normal-height: var(--ti-common-size-height-normal, 28px); + --ti-float-button-size-normal-height: var(--ti-common-size-height-normal, 32px); // 默认按钮水平内边距 --ti-float-button-size-normal-padding-horizontal: var(--ti-common-size-5x, 20px); @@ -56,7 +56,7 @@ --ti-float-button-size-medium-margin-left: 8px; // 小型按钮高度 - --ti-float-button-size-small-height: var(--ti-common-size-height-small, 32px); + --ti-float-button-size-small-height: var(--ti-common-size-height-small, 24px); // 小型按钮字号 --ti-float-button-size-small-font-size: var(--ti-common-font-size-1, 14px); // 小尺寸按钮水平内边距 @@ -69,49 +69,49 @@ // 迷你尺寸按钮高度 --ti-float-button-size-mini-height: var(--ti-common-size-height-mini, 24px); // 迷你尺寸按钮字号 - --ti-float-button-size-mini-font-size: var(--ti-common-font-size-base, 12px); + --ti-float-button-size-mini-font-size: var(--ti-common-font-size-base, 14px); // 迷你尺寸按钮水平内边距 --ti-float-button-size-mini-padding-horizontal: var(--ti-common-size-2x, 8px); // 迷你尺寸按钮最小宽度 --ti-float-button-size-mini-min-width: var(--ti-common-size-5x, 20px); // 默认按钮文本色 - --ti-float-button-normal-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-float-button-normal-text-color: var(--ti-common-color-text-primary, #191919); // 默认按钮边框色 - --ti-float-button-normal-border-color: var(--ti-common-color-border, #adb0b8); + --ti-float-button-normal-border-color: var(--ti-common-color-border, #999999); // 默认按钮背景色 - --ti-float-button-normal-background-color: var(--ti-common-color-light, #fff); + --ti-float-button-normal-background-color: var(--ti-common-color-light, #ffffff); // 默认按钮悬浮文本色 - --ti-float-button-normal-hover-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-normal-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 默认按钮悬浮边框色 - --ti-float-button-normal-hover-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-normal-hover-border-color: var(--ti-common-color-primary-normal, #191919); // 默认按钮悬浮背景色 - --ti-float-button-normal-hover-bg-color: var(--ti-common-color-light, #fff); + --ti-float-button-normal-hover-bg-color: var(--ti-common-color-light, #ffffff); // 默认按钮点击瞬间文本色 - --ti-float-button-normal-active-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-normal-active-text-color: var(--ti-common-color-primary-normal, #191919); // 默认按钮点击瞬间边框色 - --ti-float-button-normal-active-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-normal-active-border-color: var(--ti-common-color-primary-normal, #191919); // 默认按钮点击瞬间背景色 - --ti-float-button-normal-active-bg-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-float-button-normal-active-bg-color: var(--ti-common-color-hover-background, #f5f5f5); // 默认按钮禁用文本色 - --ti-float-button-normal-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-normal-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 默认按钮禁用边框色 - --ti-float-button-normal-disabled-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-float-button-normal-disabled-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 禁用类默认按钮背景色 - --ti-float-button-normal-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-float-button-normal-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 文字按钮文本色 - --ti-float-button-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-text-color: var(--ti-common-color-primary-normal, #191919); // 文字按钮悬浮文本修饰(hide) --ti-float-button-text-hover-text-decoration: none; // 文字按钮悬浮文本色 - --ti-float-button-text-color-hover: var(--ti-common-color-text-link-hover, #344899); + --ti-float-button-text-color-hover: var(--ti-common-color-text-link-hover, #1476ff); // 文字按钮悬浮文本字重 --ti-float-button-text-hover-weight: var(--ti-common-font-weight-4, normal); // 文字按钮点击瞬间文本色 - --ti-float-button-text-color-active: var(--ti-common-color-primary-active, #7693f5); + --ti-float-button-text-color-active: var(--ti-common-color-primary-active, #595959); // 文字按钮禁用文本色 - --ti-float-button-text-color-disabled: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-text-color-disabled: var(--ti-common-color-text-disabled, #c2c2c2); // 文字按钮图标宽度 --ti-float-button-text-svg-width: 1em; // 文字按钮图标高度 @@ -123,261 +123,261 @@ // 文字按钮悬浮圆角 --ti-float-button-text-hover-border-radius: 0px; // 文字按钮图标填充色 - --ti-float-button-text-svg-fill-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-float-button-text-svg-fill-color: var(--ti-common-color-text-secondary, #595959); // 文字按钮图标悬浮填充色 --ti-float-button-text-svg-hover-fill-color: var(--ti-float-button-text-color-hover); // 文字按钮禁用时图标填充色 - --ti-float-button-text-svg-disabled-fill-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-text-svg-disabled-fill-color: var(--ti-common-color-text-disabled, #c2c2c2); // 图标加文字按钮图标右侧外边距 --ti-float-button-text-has-svg-icon-margin-right: var(--ti-common-size-2x, 8px); // 图标加文字按钮字体颜色 - --ti-float-button-text-has-svg-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-float-button-text-has-svg-text-color: var(--ti-common-color-text-primary, #191919); // 图标加文字按钮悬浮时字体颜色 - --ti-float-button-text-has-svg-hover-text-color: var(--ti-common-color-text-link, #526ecc); + --ti-float-button-text-has-svg-hover-text-color: var(--ti-common-color-text-link, #1476ff); // 文字按钮只有svg时水平内边距 --ti-float-button-text-svg-padding-horizontal: var(--ti-common-size-2x, 8px); // 主要按钮的主题类背景色+朴素类文本边框色 - --ti-float-button-primary-normal-bg-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-normal-bg-color: var(--ti-common-color-primary-normal, #191919); // 主要按钮的主题类边框色 - --ti-float-button-primary-normal-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-normal-border-color: var(--ti-common-color-primary-normal, #191919); // 主题类主要按钮悬浮背景色 - --ti-float-button-primary-hover-bg-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-float-button-primary-hover-bg-color: var(--ti-common-color-primary-hover, #595959); // 主题类主要按钮悬浮边框色 - --ti-float-button-primary-hover-border-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-float-button-primary-hover-border-color: var(--ti-common-color-primary-hover, #595959); // 主要按钮点击瞬间背景色 - --ti-float-button-primary-active-bg-color: var(--ti-common-color-primary-active, #7693f5); + --ti-float-button-primary-active-bg-color: var(--ti-common-color-primary-active, #595959); // 主要按钮的禁用主题类背景色+禁用朴素类边框色 - --ti-float-button-primary-disabled-bg-color: var(--ti-common-color-primary-disabled-bgcolor, #f5f5f6); + --ti-float-button-primary-disabled-bg-color: var(--ti-common-color-primary-disabled-bgcolor, #f0f0f0); // 主题类主要按钮文本色 - --ti-float-button-primary-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-primary-text-color: var(--ti-common-color-light, #ffffff); // 禁用主题类主要按钮文本色 - --ti-float-button-primary-disabled-text-color: var(--ti-common-color-primary-disabled-text, #adb0b8); + --ti-float-button-primary-disabled-text-color: var(--ti-common-color-primary-disabled-text, #c2c2c2); // 禁用主题类主要按钮边框色 - --ti-float-button-primary-disabled-border-color: var(--ti-common-color-primary-disabled-border, #dfe1e6); + --ti-float-button-primary-disabled-border-color: var(--ti-common-color-primary-disabled-border, #f0f0f0); // 朴素类主要按钮文本色 - --ti-float-button-primary-plain-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-plain-text-color: var(--ti-common-color-primary-normal, #191919); // 朴素类主要按钮悬浮文本色 - --ti-float-button-primary-plain-hover-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-primary-plain-hover-text-color: var(--ti-common-color-light, #ffffff); // 朴素类主要按钮背景色 - --ti-float-button-primary-plain-bg-color: var(--ti-common-color-prompt-bg, #ebf6ff); + --ti-float-button-primary-plain-bg-color: var(--ti-common-color-prompt-bg, #deecff); // 朴素类主要按钮悬浮背景色 - --ti-float-button-primary-plain-hover-bg-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-plain-hover-bg-color: var(--ti-common-color-primary-normal, #191919); // 朴素类主要按钮边框色 - --ti-float-button-primary-plain-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-plain-border-color: var(--ti-common-color-primary-normal, #191919); // 朴素类主要按钮悬浮边框色 - --ti-float-button-primary-plain-hover-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-plain-hover-border-color: var(--ti-common-color-primary-normal, #191919); // 禁用朴素类主要按钮背景色 --ti-float-button-primary-plain-disabled-bg-color: var(--ti-common-color-primary-plain-disabled-bg-color, rgba(191, 191, 191, 0.1)); // 成功按钮的主题类背景色+朴素类文本边框色 - --ti-float-button-success-normal-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-normal-bg-color: var(--ti-common-color-success-normal, #5cb300); // 成功按钮的主题类边框色 - --ti-float-button-success-normal-border-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-normal-border-color: var(--ti-common-color-success-normal, #5cb300); // 成功按钮悬浮背景色 - --ti-float-button-success-hover-bg-color: var(--ti-common-color-success-hover, #acf2dc); + --ti-float-button-success-hover-bg-color: var(--ti-common-color-success-hover, #b9e683); // 成功按钮悬浮边框色 - --ti-float-button-success-hover-border-color: var(--ti-common-color-success-hover, #acf2dc); + --ti-float-button-success-hover-border-color: var(--ti-common-color-success-hover, #b9e683); // 成功按钮点击瞬间背景色 - --ti-float-button-success-active-bg-color: var(--ti-common-color-success-active, #acf2dc); + --ti-float-button-success-active-bg-color: var(--ti-common-color-success-active, #b9e683); // 成功按钮的禁用主题类背景色+禁用朴素类边框色 - --ti-float-button-success-disabled-bg-color: var(--ti-common-color-success-disabled-bgcolor, #f5f5f6); + --ti-float-button-success-disabled-bg-color: var(--ti-common-color-success-disabled-bgcolor, #f0f0f0); // 成功按钮文本色 - --ti-float-button-success-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-success-text-color: var(--ti-common-color-light, #ffffff); // 禁用主题类成功按钮文本色 - --ti-float-button-success-disabled-text-color: var(--ti-common-color-success-disabled-text, #adb0b8); + --ti-float-button-success-disabled-text-color: var(--ti-common-color-success-disabled-text, #c2c2c2); // 禁用主题类成功按钮边框色 - --ti-float-button-success-disabled-border-color: var(--ti-common-color-success-disabled-border, #dfe1e6); + --ti-float-button-success-disabled-border-color: var(--ti-common-color-success-disabled-border, #f0f0f0); // 朴素类成功按钮文本色 - --ti-float-button-success-plain-text-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-plain-text-color: var(--ti-common-color-success-normal, #5cb300); // 朴素类成功按钮悬浮文本色 - --ti-float-button-success-plain-hover-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-success-plain-hover-text-color: var(--ti-common-color-light, #ffffff); // 朴素类成功按钮背景色 - --ti-float-button-success-plain-bg-color: var(--ti-common-color-success-bg, #edfff9); + --ti-float-button-success-plain-bg-color: var(--ti-common-color-success-bg, #e6f2d5); // 朴素类成功按钮悬浮背景色 - --ti-float-button-success-plain-hover-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-plain-hover-bg-color: var(--ti-common-color-success-normal, #5cb300); // 朴素类成功按钮边框色 - --ti-float-button-success-plain-border-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-plain-border-color: var(--ti-common-color-success-normal, #5cb300); // 朴素类成功按钮悬浮边框色 - --ti-float-button-success-plain-hover-border-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-plain-hover-border-color: var(--ti-common-color-success-normal, #5cb300); // 禁用朴素类成功按钮背景色 --ti-float-button-success-plain-disabled-bg-color: var(--ti-common-color-success-plain-disabled-bg-color, rgba(166, 195, 185, 0.1)); // 警告按钮背景色|朴素类警告按钮悬浮背景色 - --ti-float-button-warning-normal-bg-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-normal-bg-color: var(--ti-common-color-warning-normal, #ff8800); // 警告按钮的主题类边框色 - --ti-float-button-warning-normal-border-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-normal-border-color: var(--ti-common-color-warning-normal, #ff8800); // 警告按钮悬浮背景色 - --ti-float-button-warning-hover-bg-color: var(--ti-common-color-warning-hover, #fac20a); + --ti-float-button-warning-hover-bg-color: var(--ti-common-color-warning-hover, #fcc98b); // 警告按钮点击瞬间背景色 - --ti-float-button-warning-active-bg-color: var(--ti-common-color-warning-active, #fac20a); + --ti-float-button-warning-active-bg-color: var(--ti-common-color-warning-active, #fcc98b); // 警告按钮的禁用主题类背景色+禁用朴素类边框色 - --ti-float-button-warning-disabled-bg-color: var(--ti-common-color-warning-disabled-bgcolor, #f5f5f6); + --ti-float-button-warning-disabled-bg-color: var(--ti-common-color-warning-disabled-bgcolor, #f0f0f0); // 警告按钮文本色 - --ti-float-button-warning-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-warning-text-color: var(--ti-common-color-light, #ffffff); // 禁用警告按钮文本色 - --ti-float-button-warning-disabled-text-color: var(--ti-common-color-warning-disabled-text, #adb0b8); + --ti-float-button-warning-disabled-text-color: var(--ti-common-color-warning-disabled-text, #c2c2c2); // 禁用主题类警告按钮边框色 - --ti-float-button-warning-disabled-border-color: var(--ti-common-color-warning-disabled-border, #dfe1e6); + --ti-float-button-warning-disabled-border-color: var(--ti-common-color-warning-disabled-border, #f0f0f0); // 朴素类主要按钮文本色 - --ti-float-button-warning-plain-text-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-plain-text-color: var(--ti-common-color-warning-normal, #ff8800); // 朴素类主要按钮悬浮文本色 - --ti-float-button-warning-plain-hover-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-warning-plain-hover-text-color: var(--ti-common-color-light, #ffffff); // 朴素类警告按钮背景色 - --ti-float-button-warning-plain-bg-color: var(--ti-common-color-warn-bg, #fff3e8); + --ti-float-button-warning-plain-bg-color: var(--ti-common-color-warn-bg, #ffebd1); // 朴素类警告按钮悬浮背景色 - --ti-float-button-warning-plain-hover-bg-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-plain-hover-bg-color: var(--ti-common-color-warning-normal, #ff8800); // 朴素类警告按钮边框色 - --ti-float-button-warning-plain-border-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-plain-border-color: var(--ti-common-color-warning-normal, #ff8800); // 朴素类警告按钮悬浮边框色 - --ti-float-button-warning-plain-hover-border-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-plain-hover-border-color: var(--ti-common-color-warning-normal, #ff8800); // 禁用朴素类警告按钮背景色 --ti-float-button-warning-plain-disabled-bg-color: var(--ti-common-color-warning-plain-disabled-bg-color, rgba(211, 198, 162, 0.1)); // 危险按钮默认背景色|朴素类危险按钮边框色 - --ti-float-button-danger-normal-bg-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-normal-bg-color: var(--ti-common-color-danger-normal, #f23030); // 危险按钮的主题类边框色 - --ti-float-button-danger-normal-border-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-normal-border-color: var(--ti-common-color-danger-normal, #f23030); // 危险按钮悬浮背景色 - --ti-float-button-danger-hover-bg-color: var(--ti-common-color-danger-hover, #d64a52); + --ti-float-button-danger-hover-bg-color: var(--ti-common-color-danger-hover, #faa9a5); // 危险按钮悬浮边框色 - --ti-float-button-danger-hover-border-color: var(--ti-common-color-danger-hover, #d64a52); + --ti-float-button-danger-hover-border-color: var(--ti-common-color-danger-hover, #faa9a5); // 危险按钮点击瞬间背景色 - --ti-float-button-danger-active-bg-color: var(--ti-common-color-danger-active, #b12220); + --ti-float-button-danger-active-bg-color: var(--ti-common-color-danger-active, #faa9a5); // 危险按钮的禁用主题类背景色+禁用朴素类边框色 - --ti-float-button-danger-disabled-bg-color: var(--ti-common-color-danger-disabled-bgcolor, #f5f5f6); + --ti-float-button-danger-disabled-bg-color: var(--ti-common-color-danger-disabled-bgcolor, #f0f0f0); // 危险按钮文本色 - --ti-float-button-danger-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-danger-text-color: var(--ti-common-color-light, #ffffff); // 禁用主题类危险按钮文本色 - --ti-float-button-danger-disabled-text-color: var(--ti-common-color-danger-disabled-text, #adb0b8); + --ti-float-button-danger-disabled-text-color: var(--ti-common-color-danger-disabled-text, #c2c2c2); // 禁用主题类危险按钮边框色 - --ti-float-button-danger-disabled-border-color: var(--ti-common-color-danger-disabled-border, #dfe1e6); + --ti-float-button-danger-disabled-border-color: var(--ti-common-color-danger-disabled-border, #f0f0f0); // 朴素类危险按钮文本色 - --ti-float-button-danger-plain-text-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-plain-text-color: var(--ti-common-color-danger-normal, #f23030); // 朴素类危险按钮悬浮文本色 - --ti-float-button-danger-plain-hover-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-danger-plain-hover-text-color: var(--ti-common-color-light, #ffffff); // 朴素类危险按钮背景色 - --ti-float-button-danger-plain-bg-color: var(--ti-common-color-error-bg, #ffeeed); + --ti-float-button-danger-plain-bg-color: var(--ti-common-color-error-bg, #fce3e1); // 朴素类危险按钮悬浮背景色 - --ti-float-button-danger-plain-hover-bg-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-plain-hover-bg-color: var(--ti-common-color-danger-normal, #f23030); // 朴素类危险按钮边框色 - --ti-float-button-danger-plain-border-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-plain-border-color: var(--ti-common-color-danger-normal, #f23030); // 朴素类危险按钮悬浮边框色 - --ti-float-button-danger-plain-hover-border-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-plain-hover-border-color: var(--ti-common-color-danger-normal, #f23030); // 禁用朴素类危险按钮背景色 - --ti-float-button-danger-plain-disabled-bg-color: var(--ti-common-color-danger-disabled-bgcolor, #f5f5f6); + --ti-float-button-danger-plain-disabled-bg-color: var(--ti-common-color-danger-disabled-bgcolor, #f0f0f0); // 禁用朴素类危险按钮边框色 - --ti-float-button-danger-plain-disabled-border-color: var(--ti-common-color-danger-disabled-bgcolor, #f5f5f6); + --ti-float-button-danger-plain-disabled-border-color: var(--ti-common-color-danger-disabled-bgcolor, #f0f0f0); // 信息按钮背景色|朴素类信息按钮边框色 - --ti-float-button-info-normal-bg-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-normal-bg-color: var(--ti-common-color-info-normal, #191919); // 信息按钮的主题类边框色 - --ti-float-button-info-normal-border-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-normal-border-color: var(--ti-common-color-info-normal, #191919); // 信息按钮悬浮背景色 - --ti-float-button-info-hover-bg-color: var(--ti-common-color-info-hover, #5c6173); + --ti-float-button-info-hover-bg-color: var(--ti-common-color-info-hover, #595959); // 信息按钮悬浮边框色 - --ti-float-button-info-hover-border-color: var(--ti-common-color-info-hover, #5c6173); + --ti-float-button-info-hover-border-color: var(--ti-common-color-info-hover, #595959); // 信息按钮点击瞬间背景色 - --ti-float-button-info-active-bg-color: var(--ti-common-color-info-active, #5c6173); + --ti-float-button-info-active-bg-color: var(--ti-common-color-info-active, #595959); // 信息按钮的禁用主题类背景色+禁用朴素类边框色 - --ti-float-button-info-disabled-bg-color: var(--ti-common-color-info-disabled-bgcolor, #f5f5f6); + --ti-float-button-info-disabled-bg-color: var(--ti-common-color-info-disabled-bgcolor, #f0f0f0); // 信息按钮文本色 - --ti-float-button-info-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-info-text-color: var(--ti-common-color-light, #ffffff); // 禁用信息按钮文本色 - --ti-float-button-info-disabled-text-color: var(--ti-common-color-info-disabled-text, #adb0b8); + --ti-float-button-info-disabled-text-color: var(--ti-common-color-info-disabled-text, #c2c2c2); // 禁用信息按钮边框色 - --ti-float-button-info-disabled-border-color: var(--ti-common-color-info-disabled-border, #dfe1e6); + --ti-float-button-info-disabled-border-color: var(--ti-common-color-info-disabled-border, #f0f0f0); // 朴素类信息按钮文本色 - --ti-float-button-info-plain-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-plain-text-color: var(--ti-common-color-info-normal, #191919); // 朴素类信息按钮悬浮文本色 - --ti-float-button-info-plain-hover-text-color: var(--ti-common-color-light, #fff); + --ti-float-button-info-plain-hover-text-color: var(--ti-common-color-light, #ffffff); // 朴素类信息按钮背景色 --ti-float-button-info-plain-bg-color: var(--ti-common-color-info-bg, rgba(51, 51, 51, 0.06)); // 朴素类信息按钮悬浮背景色 - --ti-float-button-info-plain-hover-bg-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-plain-hover-bg-color: var(--ti-common-color-info-normal, #191919); // 朴素类信息按钮边框色 - --ti-float-button-info-plain-border-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-plain-border-color: var(--ti-common-color-info-normal, #191919); // 朴素类信息按钮悬浮边框色 - --ti-float-button-info-plain-hover-border-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-plain-hover-border-color: var(--ti-common-color-info-normal, #191919); // 禁用朴素类信息按钮背景色 --ti-float-button-info-plain-disabled-bg-color: var(--ti-common-color-info-plain-disabled-bg-color, rgba(191, 191, 191, 0.1)); // 默认类型幽灵按钮文本色 - --ti-float-button-ghost-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-float-button-ghost-text-color: var(--ti-common-color-text-primary, #191919); // 默认类型幽灵按钮边框色 - --ti-float-button-ghost-border-color: var(--ti-common-color-border, #adb0b8); + --ti-float-button-ghost-border-color: var(--ti-common-color-border, #999999); // 默认类型幽灵按钮悬浮文本色 - --ti-float-button-ghost-hover-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-ghost-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 默认类型幽灵按钮悬浮边框色 - --ti-float-button-ghost-hover-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-ghost-hover-border-color: var(--ti-common-color-primary-normal, #191919); // 默认类型幽灵按钮禁用文本色 - --ti-float-button-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 默认类型幽灵按钮禁用边框色 - --ti-float-button-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #c2c2c2); // 主要类型幽灵按钮文本色 - --ti-float-button-primary-ghost-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-ghost-text-color: var(--ti-common-color-primary-normal, #191919); // 主要类型幽灵按钮边框色 - --ti-float-button-primary-ghost-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-primary-ghost-border-color: var(--ti-common-color-primary-normal, #191919); // 主要类型幽灵按钮悬浮文本色 - --ti-float-button-primary-ghost-hover-text-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-float-button-primary-ghost-hover-text-color: var(--ti-common-color-primary-hover, #595959); // 主要类型幽灵按钮悬浮边框色 - --ti-float-button-primary-ghost-hover-border-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-float-button-primary-ghost-hover-border-color: var(--ti-common-color-primary-hover, #595959); // 主要类型幽灵按钮禁用文本色 - --ti-float-button-primary-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-primary-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 主要类型幽灵按钮禁用边框色 - --ti-float-button-primary-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-primary-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #c2c2c2); // 成功类型幽灵按钮文本色 - --ti-float-button-success-ghost-text-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-ghost-text-color: var(--ti-common-color-success-normal, #5cb300); // 成功类型幽灵按钮边框色 - --ti-float-button-success-ghost-border-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-float-button-success-ghost-border-color: var(--ti-common-color-success-normal, #5cb300); // 成功类型幽灵按钮悬浮文本色 - --ti-float-button-success-ghost-hover-text-color: var(--ti-common-color-success-active, #acf2dc); + --ti-float-button-success-ghost-hover-text-color: var(--ti-common-color-success-active, #b9e683); // 成功类型幽灵按钮悬浮边框色 - --ti-float-button-success-ghost-hover-border-color: var(--ti-common-color-success-active, #acf2dc); + --ti-float-button-success-ghost-hover-border-color: var(--ti-common-color-success-active, #b9e683); // 成功类型幽灵按钮禁用文本色 - --ti-float-button-success-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-success-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 成功类型幽灵按钮禁用边框色 - --ti-float-button-success-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-success-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #c2c2c2); // 信息类型幽灵按钮文本色 - --ti-float-button-info-ghost-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-ghost-text-color: var(--ti-common-color-info-normal, #191919); // 信息类型幽灵按钮边框色 - --ti-float-button-info-ghost-border-color: var(--ti-common-color-info-normal, #252b3a); + --ti-float-button-info-ghost-border-color: var(--ti-common-color-info-normal, #191919); // 信息类型幽灵按钮悬浮文本色 - --ti-float-button-info-ghost-hover-text-color: var(--ti-common-color-info-hover, #5c6173); + --ti-float-button-info-ghost-hover-text-color: var(--ti-common-color-info-hover, #595959); // 信息类型幽灵按钮悬浮边框色 - --ti-float-button-info-ghost-hover-border-color: var(--ti-common-color-info-hover, #5c6173); + --ti-float-button-info-ghost-hover-border-color: var(--ti-common-color-info-hover, #595959); // 信息类型幽灵按钮禁用文本色 - --ti-float-button-info-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-info-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 信息类型幽灵按钮禁用边框色 - --ti-float-button-info-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-info-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #c2c2c2); // 告警类型幽灵按钮文本色 - --ti-float-button-warning-ghost-text-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-ghost-text-color: var(--ti-common-color-warning-normal, #ff8800); // 告警类型幽灵按钮边框色 - --ti-float-button-warning-ghost-border-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-float-button-warning-ghost-border-color: var(--ti-common-color-warning-normal, #ff8800); // 告警类型幽灵按钮悬浮文本色 - --ti-float-button-warning-ghost-hover-text-color: var(--ti-common-color-warning-active, #fac20a); + --ti-float-button-warning-ghost-hover-text-color: var(--ti-common-color-warning-active, #fcc98b); // 告警类型幽灵按钮悬浮边框色 - --ti-float-button-warning-ghost-hover-border-color: var(--ti-common-color-warning-active, #fac20a); + --ti-float-button-warning-ghost-hover-border-color: var(--ti-common-color-warning-active, #fcc98b); // 告警类型幽灵按钮禁用文本色 - --ti-float-button-warning-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-warning-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 告警类型幽灵按钮禁用边框色 - --ti-float-button-warning-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-warning-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #c2c2c2); // 危险类型幽灵按钮文本色 - --ti-float-button-danger-ghost-text-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-ghost-text-color: var(--ti-common-color-danger-normal, #f23030); // 危险类型幽灵按钮边框色 - --ti-float-button-danger-ghost-border-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-float-button-danger-ghost-border-color: var(--ti-common-color-danger-normal, #f23030); // 危险类型幽灵按钮悬浮文本色 - --ti-float-button-danger-ghost-hover-text-color: var(--ti-common-color-danger-hover, #d64a52); + --ti-float-button-danger-ghost-hover-text-color: var(--ti-common-color-danger-hover, #faa9a5); // 危险类型幽灵按钮悬浮边框色 - --ti-float-button-danger-ghost-hover-border-color: var(--ti-common-color-danger-hover, #d64a52); + --ti-float-button-danger-ghost-hover-border-color: var(--ti-common-color-danger-hover, #faa9a5); // 危险类型幽灵按钮禁用文本色 - --ti-float-button-danger-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-danger-ghost-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 危险类型幽灵按钮禁用边框色 - --ti-float-button-danger-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-float-button-danger-ghost-disabled-border-color: var(--ti-common-color-text-disabled, #c2c2c2); // 按钮垂直内边距 --ti-float-button-padding-vertical: var(--ti-common-space-0, 0px); @@ -406,7 +406,7 @@ // 纯文本按钮默认尺寸最小宽度 --ti-float-button-text-size-default-min-width: var(--ti-common-size-20x, 80px); // 纯文本按钮默认尺寸高度 - --ti-float-button-text-size-default-height: var(--ti-common-size-height-normal, 28px); + --ti-float-button-text-size-default-height: var(--ti-common-size-height-normal, 32px); // 纯文本按钮默认尺寸图标宽度 --ti-float-button-text-size-default-svg-width: 1em; // 纯文本按钮默认尺寸图标高度 @@ -415,7 +415,7 @@ // 纯文本按钮小尺寸最小宽度 --ti-float-button-text-size-small-min-width: var(--ti-common-size-18x, 72px); // 纯文本按钮小尺寸高度 - --ti-float-button-text-size-small-height: var(--ti-common-size-height-small, 32px); + --ti-float-button-text-size-small-height: var(--ti-common-size-height-small, 24px); // 纯文本按钮小尺寸图标宽度 --ti-float-button-text-size-small-svg-width: 1em; // 纯文本按钮小尺寸图标高度 @@ -437,9 +437,9 @@ // 纯图标按钮边框圆角 --ti-float-button-only-icon-border-radius: 2px; // 纯图标按钮边框颜色 - --ti-float-button-only-icon-border-color: var(--ti-common-color-border, #adb0b8); + --ti-float-button-only-icon-border-color: var(--ti-common-color-border, #999999); // 纯图标按钮悬浮时边框颜色 - --ti-float-button-only-icon-hover-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-button-only-icon-hover-border-color: var(--ti-common-color-primary-normal, #191919); // 纯图标按钮禁用时边框颜色 - --ti-float-button-only-icon-disabled-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-float-button-only-icon-disabled-border-color: var(--ti-common-color-line-disabled, #dbdbdb); } \ No newline at end of file diff --git a/packages/theme/src/floatbar/vars.less b/packages/theme/src/floatbar/vars.less index 987c1fbc12..39426aac3c 100644 --- a/packages/theme/src/floatbar/vars.less +++ b/packages/theme/src/floatbar/vars.less @@ -14,29 +14,29 @@ // 浮动块边框色 --ti-float-bar-border-color: unset; // 浮动块圆角 - --ti-float-bar-border-radius: var(--ti-common-border-radius-4); + --ti-float-bar-border-radius: var(--ti-common-border-radius-4, 8px); // 浮动块字号 - --ti-float-bar-font-size: var(--ti-common-font-size-base); + --ti-float-bar-font-size: var(--ti-common-font-size-base, 14px); // 浮动块背景色 - --ti-float-bar-list-bg-color: var(--ti-common-color-bg-navigation); + --ti-float-bar-list-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 浮动块阴影: --ti-float-bar-box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.08); // ul,li边距 - --ti-float-bar-ul-padding-vertical: var(--ti-common-space-2x); - --ti-float-bar-ul-padding-horizontal: var(--ti-common-space-0); - --ti-float-bar-li-margin-vertical: var(--ti-common-space-2x); - --ti-float-bar-li-margin-horizontal: var(--ti-common-space-0); + --ti-float-bar-ul-padding-vertical: var(--ti-common-space-2x, 8px); + --ti-float-bar-ul-padding-horizontal: var(--ti-common-space-0, 0px); + --ti-float-bar-li-margin-vertical: var(--ti-common-space-2x, 8px); + --ti-float-bar-li-margin-horizontal: var(--ti-common-space-0, 0px); // 列表项最小高度 - --ti-float-bar-list-item-min-height: var(--ti-common-size-height-normal); + --ti-float-bar-list-item-min-height: var(--ti-common-size-height-normal, 32px); // 列表项最小宽度 - --ti-float-bar-list-item-min-width: var(--ti-common-size-width-normal); + --ti-float-bar-list-item-min-width: var(--ti-common-size-width-normal, 104px); // 列表项行高 - --ti-float-bar-list-line-height: var(--ti-common-size-height-normal); + --ti-float-bar-list-line-height: var(--ti-common-size-height-normal, 32px); // 列表项文本色 - --ti-float-bar-list-text-color: var(--ti-common-color-text-primary); + --ti-float-bar-list-text-color: var(--ti-common-color-text-primary, #191919); // 列表项悬浮文本色 - --ti-float-bar-list-hover-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-float-bar-list-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 列表项悬浮背景色 --ti-float-bar-list-hover-bg-color: rgba(0, 0, 0, 0.05); } diff --git a/packages/theme/src/grid/vars.less b/packages/theme/src/grid/vars.less index 433ebc3b20..63110c3283 100644 --- a/packages/theme/src/grid/vars.less +++ b/packages/theme/src/grid/vars.less @@ -23,96 +23,96 @@ 'Microsoft JhengHei' ); // 默认表头文本色 - --ti-grid-header-text-color: var(--ti-common-color-text-secondary); + --ti-grid-header-text-color: var(--ti-common-color-text-secondary, #595959); // 默认表头字体权重 --ti-grid-header-font-weight: bold; // 默认表体文本色 - --ti-grid-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-grid-text-color: var(--ti-common-color-info-normal, #191919); // 默认按钮图标悬浮色 - --ti-grid-icon-color: var(--ti-common-color-icon); + --ti-grid-icon-color: var(--ti-common-color-icon, #191919); // 表格亮色 - --ti-grid-light-color: var(--ti-common-color-light, #fff); + --ti-grid-light-color: var(--ti-common-color-light, #ffffff); // 表格错误色 - --ti-grid-error-color: var(--ti-common-color-error-text, #de504e); + --ti-grid-error-color: var(--ti-common-color-error-text, #f23030); // 表格错误背景色 - --ti-grid-error-bg-color: var(--ti-common-color-error-bg, #ffeeed); + --ti-grid-error-bg-color: var(--ti-common-color-error-bg, #fce3e1); // 表格成功色 - --ti-grid-success-color: var(--ti-common-color-success, #50d4ab); + --ti-grid-success-color: var(--ti-common-color-success, #5cb300); // 表格警告色 - --ti-grid-warning-color: var(--ti-common-color-warn, #fa9841); + --ti-grid-warning-color: var(--ti-common-color-warn, #ff8800); // 表格禁用色 - --ti-grid-disabled-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-grid-disabled-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 筛选弹框复选框边框色 - --ti-grid-normal-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-grid-normal-text-color: var(--ti-common-color-placeholder, #808080); // 默认字号 - --ti-grid-font-size: var(--ti-common-font-size-base, 12px); + --ti-grid-font-size: var(--ti-common-font-size-base, 14px); // 默认边框色 - --ti-grid-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-grid-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 行复选按钮圆角|筛选弹窗输入框圆角 - --ti-grid-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-grid-border-radius: var(--ti-common-border-radius-normal, 6px); // 表格主体内容td边框颜色 - --ti-grid-body-td-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-grid-body-td-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 表头x轴虚拟滚动元素边框颜色 - --ti-grid-header-repair-border-color: var(--ti-common-color-transparent); + --ti-grid-header-repair-border-color: var(--ti-common-color-transparent, transparent); // 表格内部单选按钮边框色 - --ti-grid-radio-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-grid-radio-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 表格单选框选中背景色 --ti-grid-radio-bg-color-checked: #1476ff; // 表格内部多选按钮边框色 - --ti-grid-checkbox-border-color: var(--ti-common-color-line-normal); + --ti-grid-checkbox-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 表格内部多选按钮大小 - --ti-grid-select-icon-font-size: var(--ti-common-font-size-3); + --ti-grid-select-icon-font-size: var(--ti-common-font-size-3, 18px); // 表格多选框选中背景色 --ti-grid-checkbox-bg-color-checked: #1476ff; // 表格复选框字号 - --ti-grid-checkbox-icon-size: var(--ti-common-font-size-2); + --ti-grid-checkbox-icon-size: var(--ti-common-font-size-2, 16px); // 表格内部多选按钮边框圆角 - --ti-grid-checkbox-border-radius: var(--ti-common-border-radius-2); + --ti-grid-checkbox-border-radius: var(--ti-common-border-radius-2, 4px); // 表格头部默认背景色 --ti-grid-header-background-color: #f5f5f5; // 新增行背景颜色 - --ti-grid-new-row-background-color: var(--ti-common-color-bg-white-emphasize, #f2f5fc); + --ti-grid-new-row-background-color: var(--ti-common-color-bg-white-emphasize, #f0f0f0); // 表格主色调色 - --ti-grid-primary-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-grid-primary-color: var(--ti-common-color-primary-normal, #191919); // 表格主色调悬浮色 - --ti-grid-primary-hover-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-grid-primary-hover-color: var(--ti-common-color-primary-hover, #595959); // 表格主色调激活色 - --ti-grid-primary-active-color: var(--ti-common-color-primary-active, #7693f5); + --ti-grid-primary-active-color: var(--ti-common-color-primary-active, #595959); // 表格主色调禁用色(没有效果) - --ti-grid-primary-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-grid-primary-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 自定义表头列高度（没有效果） --ti-grid-custom-head-height: var(--ti-common-space-10x, 40px); // 自定义内容列表高度（没有效果） - --ti-grid-custom-body-list-height: var(--ti-common-size-height-small, 32px); + --ti-grid-custom-body-list-height: var(--ti-common-size-height-small, 24px); // 表格列拖拽分割线背景颜色 --ti-grid-header-resizable-bg-color: rgba(0, 0, 0, 0.15); // 表格列拖拽分割线高度 --ti-grid-header-resizable-line-height: 16px; // (单选|复选)框禁用背景色 - --ti-grid-input-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-grid-input-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 筛选弹框边框色 - --ti-grid-popup-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-grid-popup-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 简易筛选面板按钮组边距 --ti-grid-filter-button-group-size: var(--ti-common-space-10, 10px); // 简易时间筛选面板标题颜色 - --ti-grid-filter-date-title-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-grid-filter-date-title-color: var(--ti-common-color-text-weaken, #808080); // 筛选面板字体颜色 - --ti-grid-filter-date-color: var(--ti-common-color-text-primary, #252b3a); + --ti-grid-filter-date-color: var(--ti-common-color-text-primary, #191919); // 树表展开图标颜色 - --ti-grid-tree-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-grid-tree-icon-color: var(--ti-common-color-icon-normal, #808080); // 树表展开图标悬浮颜色 - --ti-grid-tree-icon-hover-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-grid-tree-icon-hover-color: var(--ti-common-color-icon-hover, #191919); // 行默认背景色 - --ti-grid-row-background-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-grid-row-background-color: var(--ti-common-color-bg-white-normal, #ffffff); // 行被勾选时背景色 --ti-grid-row-selected-background-color: #f0f7ff; // 斑马纹行背景色 @@ -123,11 +123,11 @@ // 高亮悬停列悬浮表头背景色 --ti-grid-column-hover-background-color: #d7effb; // 鼠标配置项双击表头选中当前列背景色 - --ti-grid-column-current-background-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-grid-column-current-background-color: var(--ti-common-color-hover-background, #f5f5f5); // 表头编辑图标色 - --ti-grid-column-icon-text-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-grid-column-icon-text-color: var(--ti-common-color-icon-normal, #808080); // 可编辑表格输入框高度 - --ti-grid-input-height: var(--ti-common-size-height-normal, 28px); + --ti-grid-input-height: var(--ti-common-size-height-normal, 32px); // 鼠标配置项选中项边框厚度 --ti-grid-column-checked-border-width: var(--ti-common-border-weight-1, 2px); // 表格加载中背景色 @@ -142,32 +142,32 @@ // 中等尺寸表头高度 --ti-grid-medium-header-column-height: 46px; // 默认尺寸表头高度 - --ti-grid-default-header-column-height: var(--ti-common-size-height-medium); + --ti-grid-default-header-column-height: var(--ti-common-size-height-medium, 40px); // 小尺寸表头高度 - --ti-grid-small-header-column-height: var(--ti-common-size-height-normal); + --ti-grid-small-header-column-height: var(--ti-common-size-height-normal, 32px); // 超小尺寸表头高度 --ti-grid-mini-header-column-height: 32px; // 中等尺寸表格单元格高度 --ti-grid-medium-column-height: 52px; // 默认尺寸表格单元格高度 - --ti-grid-default-column-height: var(--ti-common-size-height-large); + --ti-grid-default-column-height: var(--ti-common-size-height-large, 48px); // 小尺寸表格单元格高度 - --ti-grid-small-column-height: var(--ti-common-size-height-medium); + --ti-grid-small-column-height: var(--ti-common-size-height-medium, 40px); // 超小尺寸表格单元格高度 - --ti-grid-mini-column-height: var(--ti-common-size-height-minor); + --ti-grid-mini-column-height: var(--ti-common-size-height-minor, 30px); // 表头单元格垂直内边距 --ti-grid-mini-th-padding-vertical: var(--ti-common-space-base, 4px); // 表头单元格垂直内边距 --ti-grid-th-padding-vertical: var(--ti-common-space-2x, 8px); // 默认单元格垂直内边距 - --ti-grid-td-padding-vertical: var(--ti-common-space-3x); + --ti-grid-td-padding-vertical: var(--ti-common-space-3x, 12px); // 单元格水平内边距 - --ti-grid-td-padding-horizontal: var(--ti-common-space-4x); + --ti-grid-td-padding-horizontal: var(--ti-common-space-4x, 16px); // mini单元格垂直内边距 - --ti-grid-mini-td-padding-vertical: var(--ti-common-space-2x); + --ti-grid-mini-td-padding-vertical: var(--ti-common-space-2x, 8px); // mini单元格水平内边距 - --ti-grid-mini-td-padding-horizontal: var(--ti-common-space-4x); + --ti-grid-mini-td-padding-horizontal: var(--ti-common-space-4x, 16px); // 表头排序图标尺寸 --ti-grid-header-icon-font-size: var(--ti-common-font-size-2, 16px); // 表头排序图标尺寸缩放比例 @@ -176,26 +176,26 @@ --ti-grid-nodata-td-bg-img-url: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGNsaXBQYXRoIGlkPSJhIj48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLW9wYWNpdHk9IjAiIGQ9Ik0wIDBoODB2ODBIMHoiLz48L2NsaXBQYXRoPjwvZGVmcz48ZyBjbGlwLXBhdGg9InVybCgjYSkiPjxwYXRoIGQ9Ik03My42MSAzOS4zOXYzMC42N2MwIDIuMTctMS43NiAzLjkzLTMuOTQgMy45M0g1Mi41OXYtLjg3aDE3LjA4YzEuNyAwIDMuMDctMS4zNyAzLjA3LTMuMDZWMzkuMzloLjg3eiIgZmlsbD0iZ3JheSIvPjxwYXRoIGQ9Ik03My42MSAzOS4zOXYzMC42N2MwIDIuMTctMS43NiAzLjkzLTMuOTQgMy45M0g1Mi41OXYtLjg3aDE3LjA4YzEuNyAwIDMuMDctMS4zNyAzLjA3LTMuMDZWMzkuMzloLjg3eiIgZmlsbD0iZ3JheSIvPjxwYXRoIGQ9Ik01Ni45MiAyNXY0NS4wNmMwIDIuMTctMS43NyAzLjkzLTMuOTUgMy45M0gxMC45NEEzLjk0IDMuOTQgMCAwIDEgNyA3MC4wNlYzOS4zOWguODh2MzAuNjdhMy4wNiAzLjA2IDAgMCAwIDMuMDYgMy4wNmg0Mi4wM2MxLjcgMCAzLjA3LTEuMzcgMy4wNy0zLjA2VjI1Ljg3SDEwLjY3VjI1aDQ2LjI1eiIgZmlsbD0iZ3JheSIvPjxwYXRoIGQ9Ik05LjQzIDI1Yy0uNiAwLTEuMTUuMzEtMS40Ni44MkwuMTMgMzguNjRjLS4yNi40Mi0uMTMuOTYuMjcgMS4yMi4xNC4wOS4yOS4xNC40Ni4xNGg0NC44MmMxLjE3IDAgMi4yNi0uNjEgMi45LTEuNjJMNTcuMDQgMjVIOS40M3ptLjIyIDFoNDUuNTJsLTcuNTIgMTEuODFjLS40Ny43NC0xLjI4IDEuMTktMi4xNCAxLjE5SDEuMTdsNy43NS0xMi42Yy4xNi0uMjUuNDMtLjQuNzMtLjR6IiBmaWxsPSJncmF5Ii8+PHBhdGggZD0iTTcwLjc1IDI1Yy41NiAwIDEuMDguMyAxLjM5LjhsNy43MiAxMi43MmMuMjUuNDEuMTQuOTUtLjI1IDEuMjEtLjEzLjA5LS4yOC4xNC0uNDQuMTRINjYuMTRjLTEuMTcgMC0yLjI1LS42Ni0yLjg1LTEuNzNMNTUuOTggMjVoMTQuNzd6bS0uMDMgMUg1Ny44bDYuMzggMTEuNzFjLjQzLjggMS4yMiAxLjI5IDIuMDggMS4yOWgxMi42M0w3MS40IDI2LjM5YS44MDIuODAyIDAgMCAwLS42OC0uMzl6IiBmaWxsPSJncmF5Ii8+PHJlY3QgeD0iMTMuNSIgeT0iNTYiIHJ4PSIxLjg4NiIgd2lkdGg9IjE0IiBoZWlnaHQ9IjQiIGZpbGw9IiMxNDc2RkYiLz48cGF0aCBkPSJNMjMuNTYgNjNjLjI0IDAgLjQ0LjIyLjQ0LjUgMCAuMjctLjIuNS0uNDQuNWgtOS42M2MtLjI0IDAtLjQzLS4yMy0uNDMtLjUgMC0uMjguMTktLjUuNDMtLjVoOS42M3oiIGZpbGw9ImdyYXkiLz48cmVjdCB4PSIxMy41IiB5PSI2NiIgcng9Ii41IiB3aWR0aD0iNSIgaGVpZ2h0PSIxIiBmaWxsPSJncmF5Ii8+PHBhdGggZD0iTTQwIDZjLjI3IDAgLjUuMTkuNS40NHY2LjE2YzAgLjI1LS4yMy40NC0uNS40NC0uMjggMC0uNTEtLjE5LS41MS0uNDRWNi40NGMwLS4yNS4yMy0uNDQuNTEtLjQ0ek01Ni41NSA4LjY0Yy4yNC4xNC4zMy40Mi4yMS42M2wtMy4wOCA1LjM0Yy0uMTIuMjEtLjQyLjI3LS42Ni4xMy0uMjQtLjE0LS4zMy0uNDItLjIxLS42M2wzLjA4LTUuMzRjLjEyLS4yMS40Mi0uMjcuNjYtLjEzek0yMy40NCA4LjY0Yy4yNC0uMTQuNTQtLjA4LjY2LjEzbDMuMDggNS4zNGMuMTIuMjEuMDMuNDktLjIxLjYzcy0uNTQuMDgtLjY2LS4xM2wtMy4wOC01LjM0Yy0uMTItLjIxLS4wMy0uNDkuMjEtLjYzeiIgZmlsbD0iZ3JheSIvPjwvZz48L3N2Zz4='); // 工具栏按钮水平内边距 - --ti-grid-toolbar-btn-padding-horizontal: var(--ti-common-space-6x); + --ti-grid-toolbar-btn-padding-horizontal: var(--ti-common-space-6x, 24px); // 工具栏按钮行高 --ti-grid-toolbar-btn-line-height: 30px; // 工具栏按钮边框颜色 --ti-grid-toolbar-btn-border-color: #595959; // 工具栏按钮边框圆角 - --ti-grid-toolbar-btn-border-radius: var(--ti-common-size-4x); + --ti-grid-toolbar-btn-border-radius: var(--ti-common-size-4x, 16px); // 工具栏按钮最小宽度 - --ti-grid-toolbar-btn-min-width: calc(var(--ti-common-size-base) * 24); + --ti-grid-toolbar-btn-min-width: calc(var(--ti-common-size-base, 4px) * 24); // 工具栏按钮悬浮边框颜色 - --ti-grid-toolbar-btn-hover-border-color: var(--ti-common-color-line-normal); + --ti-grid-toolbar-btn-hover-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 工具栏图标按钮高度 - --ti-grid-toolbar-icon-btn-height: var(--ti-common-size-8x); + --ti-grid-toolbar-icon-btn-height: var(--ti-common-size-8x, 32px); // 工具栏图标按钮宽度 - --ti-grid-toolbar-icon-btn-width: var(--ti-common-size-8x); + --ti-grid-toolbar-icon-btn-width: var(--ti-common-size-8x, 32px); // 工具栏图标按钮边框色 - --ti-grid-toolbar-icon-btn-border-color: var(--ti-common-color-line-normal); + --ti-grid-toolbar-icon-btn-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 工具栏图标按钮边框圆角 - --ti-grid-toolbar-icon-btn-border-radius: calc(var(--ti-common-size-base) + 2px); + --ti-grid-toolbar-icon-btn-border-radius: calc(var(--ti-common-size-base, 4px) + 2px); // 工具栏垂直边距 --ti-grid-toolbar-padding-vertical: var(--ti-common-size-4x, 16px); // 排序按钮定位方式 @@ -205,9 +205,9 @@ // 表格展开行背景颜色 --ti-grid-expand-background-color: #fafafa; // 表格树表展开行图标大小 - --ti-grid-tree-expand-icon-font-size: var(--ti-common-font-size-2); + --ti-grid-tree-expand-icon-font-size: var(--ti-common-font-size-2, 16px); // 表格树表展开行图标右侧边距 - --ti-grid-tree-expand-icon-padding-right: var(--ti-common-space-2x); + --ti-grid-tree-expand-icon-padding-right: var(--ti-common-space-2x, 8px); // 表格树表展开行图标向左偏移量(hide) --ti-grid-tree-expand-icon-translate-x: 0; // 表头单元格宽度 diff --git a/packages/theme/src/guide/vars.less b/packages/theme/src/guide/vars.less index dd40796744..d454142dc1 100644 --- a/packages/theme/src/guide/vars.less +++ b/packages/theme/src/guide/vars.less @@ -4,59 +4,59 @@ // 引导框箭头宽度 --ti-guide-arrow-width: var(--ti-common-size-4x, 16px); // 引导框头部左上边框圆角 - --ti-guide-header-border-top-left-radius: var(--ti-common-border-radius-4); + --ti-guide-header-border-top-left-radius: var(--ti-common-border-radius-4, 8px); // 引导框头部右上边框圆角 - --ti-guide-header-border-top-right-radius: var(--ti-common-border-radius-4); + --ti-guide-header-border-top-right-radius: var(--ti-common-border-radius-4, 8px); // 引导框头部行高 - --ti-guide-header-line-height: var(--ti-common-line-height-6, 32px); + --ti-guide-header-line-height: var(--ti-common-line-height-6, 48px); // 引导框头部左内边距 - --ti-guide-header-padding-left: var(--ti-common-space-6x); + --ti-guide-header-padding-left: var(--ti-common-space-6x, 24px); // 引导框头部右内边距 - --ti-guide-header-padding-right: var(--ti-common-space-6x); + --ti-guide-header-padding-right: var(--ti-common-space-6x, 24px); // 引导框头部顶部内边距 - --ti-guide-header-padding-top: var(--ti-common-space-6x); + --ti-guide-header-padding-top: var(--ti-common-space-6x, 24px); // 引导框头部背景色 - --ti-guide-header-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-guide-header-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 引导框标题文本色 - --ti-guide-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-guide-title-text-color: var(--ti-common-color-text-primary, #191919); // 引导框标题行高 - --ti-guide-title-line-height: var(--ti-common-line-height-2); + --ti-guide-title-line-height: var(--ti-common-line-height-2, 24px); // 引导框标题字重 --ti-guide-title-font-weight: var(--ti-common-font-weight-7, bold); // 引导框标题字号 - --ti-guide-title-text-font-size: var(--ti-common-font-size-2); + --ti-guide-title-text-font-size: var(--ti-common-font-size-2, 16px); // 引导框关闭按钮图标字号 - --ti-guide-cancel-icon-font-size: var(--ti-common-font-size-4, 16px); + --ti-guide-cancel-icon-font-size: var(--ti-common-font-size-4, 20px); // 引导框关闭按钮图标宽度 --ti-guide-cancel-icon-width: var(--ti-common-size-4x, 16px); // 引导框关闭按钮图标高度 --ti-guide-cancel-icon-height: var(--ti-common-size-4x, 16px); // 引导框关闭按钮图标行高 - --ti-guide-cancel-icon-line-height: var(--ti-common-line-height-4, 20px); + --ti-guide-cancel-icon-line-height: var(--ti-common-line-height-4, 30px); // 引导框关闭按钮图标颜色 - --ti-guide-cancel-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-guide-cancel-icon-color: var(--ti-common-color-icon-normal, #808080); // 引导框关闭按钮图标字重 --ti-guide-cancel-icon-font-weight: var(--ti-common-font-weight-1, 100); // 引导框关闭按钮图标顶部外边距 - --ti-guide-cancel-icon-margin-top: calc(var(--ti-common-space-base) * (-3)); + --ti-guide-cancel-icon-margin-top: calc(var(--ti-common-space-base, 4px) * (-3)); // 引导框关闭按钮图标顶部外边距 - --ti-guide-cancel-icon-margin-right: calc(var(--ti-common-space-base) * (-1)); + --ti-guide-cancel-icon-margin-right: calc(var(--ti-common-space-base, 4px) * (-1)); // 引导框关闭按钮图标顶部外边距 - --ti-guide-progress-style-left: var(--ti-common-space-6x); + --ti-guide-progress-style-left: var(--ti-common-space-6x, 24px); // 引导框关闭按钮图标悬浮色 --ti-guide-cancel-hover-icon-color: #191919; // 引导框内容文本色 --ti-guide-text-text-color: #595959; // 引导框内容行高 - --ti-guide-text-line-height: var(--ti-common-line-height-2); + --ti-guide-text-line-height: var(--ti-common-line-height-2, 24px); // 引导框内容字号 --ti-guide-text-font-size: var(--ti-common-font-size-1, 14px); // 引导框内容上内边距 - --ti-guide-text-padding-top: var(--ti-common-space-2x); + --ti-guide-text-padding-top: var(--ti-common-space-2x, 8px); // 引导框内容水平内边距 - --ti-guide-text-padding-horizontal: var(--ti-common-space-6x); + --ti-guide-text-padding-horizontal: var(--ti-common-space-6x, 24px); // 引导框内容底部内边距 - --ti-guide-text-padding-bottom: var(--ti-common-space-6x); + --ti-guide-text-padding-bottom: var(--ti-common-space-6x, 24px); // 引导框内容滚动wrap左内边距 --ti-guide-text-scrollbox-padding-right: var(--ti-common-space-2x, 8px); // 引导框内容滚动条宽度 @@ -64,63 +64,63 @@ // 引导框内容滚动条高度 --ti-guide-text-scrollbar-height: var(--ti-common-scrollbar-height, 8px); // 引导框内容滚动条圆角 - --ti-guide-text-scrollbar-border-radius: var(--ti-common-scrollbar-thumb-border-radius, 6px); + --ti-guide-text-scrollbar-border-radius: var(--ti-common-scrollbar-thumb-border-radius, 4px); // 引导框内容滚动条边框色 - --ti-guide-text-scrollbar-border-color: var(--ti-common-scrollbar-thumb-active-bg-color, #999999); + --ti-guide-text-scrollbar-border-color: var(--ti-common-scrollbar-thumb-active-bg-color, #dbdbdb); // 引导框底部右下圆角 - --ti-guide-footer-border-bottom-right-radius: var(--ti-common-border-radius-4); + --ti-guide-footer-border-bottom-right-radius: var(--ti-common-border-radius-4, 8px); // 引导框底部左下圆角 - --ti-guide-footer-border-bottom-left-radius: var(--ti-common-border-radius-4); + --ti-guide-footer-border-bottom-left-radius: var(--ti-common-border-radius-4, 8px); // 引导框底部左内边距 - --ti-guide-footer-padding-left: var(--ti-common-space-6x); + --ti-guide-footer-padding-left: var(--ti-common-space-6x, 24px); // 引导框底部右内边距 - --ti-guide-footer-padding-right: var(--ti-common-space-6x); + --ti-guide-footer-padding-right: var(--ti-common-space-6x, 24px); // 引导框底部底部内边距 - --ti-guide-footer-padding-bottom: var(--ti-common-space-6x); + --ti-guide-footer-padding-bottom: var(--ti-common-space-6x, 24px); // 引导框进度条文本颜色 - --ti-guide-progress-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-guide-progress-text-color: var(--ti-common-color-primary-normal, #191919); // 引导框按钮默认样式文本色 --ti-guide-button-text-color: #191919; // 引导框按钮默认样式文本色 --ti-guide-button-border: #595959; // 引导框按钮默认样式圆角 - --ti-guide-button-border-radius: var(--ti-common-size-25x); + --ti-guide-button-border-radius: var(--ti-common-size-25x, 100px); // 引导框按钮默认样式背景色 - --ti-guide-button-bg-color: var(--ti-common-color-light); + --ti-guide-button-bg-color: var(--ti-common-color-light, #ffffff); // 引导框按钮默认样式悬浮背景色 - --ti-guide-button-hover-bg-color: var(--ti-common-color-light); + --ti-guide-button-hover-bg-color: var(--ti-common-color-light, #ffffff); // 引导框按钮默认样式悬浮背景色 --ti-guide-button-hover-border-color: #C2C2C2; // 引导框按钮默认样式聚焦背景色 - --ti-guide-button-focus-bg-color: var(--ti-common-color-light); + --ti-guide-button-focus-bg-color: var(--ti-common-color-light, #ffffff); // 引导框按钮默认样式激活背景色 - --ti-guide-button-active-bg-color: var(--ti-common-color-light); + --ti-guide-button-active-bg-color: var(--ti-common-color-light, #ffffff); // 引导框按钮默认样式禁用背景色 - --ti-guide-button-disable-bg-color: var(--ti-common-color-primary-disabled-bgcolor, #f5f5f6); + --ti-guide-button-disable-bg-color: var(--ti-common-color-primary-disabled-bgcolor, #f0f0f0); // 引导框按钮默认样式禁用文本色 - --ti-guide-button-disable-text-color: var(--ti-common-color-primary-disabled-text, #adb0b8); + --ti-guide-button-disable-text-color: var(--ti-common-color-primary-disabled-text, #c2c2c2); // 引导框按钮透明样式文本色 - --ti-guide-button-secondary-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-guide-button-secondary-text-color: var(--ti-common-color-text-primary, #191919); // 引导框按钮透明样式背景色 - --ti-guide-button-secondary-bg-color: var(--ti-common-color-light, #fff); + --ti-guide-button-secondary-bg-color: var(--ti-common-color-light, #ffffff); // 引导框按钮透明样式边框色 - --ti-guide-button-secondary-border-color: var(--ti-common-color-border, #adb0b8); + --ti-guide-button-secondary-border-color: var(--ti-common-color-border, #999999); // 引导框按钮透明样式悬浮边框色 - --ti-guide-button-secondary-hover-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-guide-button-secondary-hover-border-color: var(--ti-common-color-primary-normal, #191919); // 引导框按钮透明样式聚焦边框色 - --ti-guide-button-secondary-focus-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-guide-button-secondary-focus-border-color: var(--ti-common-color-primary-normal, #191919); // 引导框按钮透明样式激活边框色 - --ti-guide-button-secondary-active-border-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-guide-button-secondary-active-border-color: var(--ti-common-color-primary-normal, #191919); // 引导框按钮透明样式禁用背景色 - --ti-guide-button-secondary-disabled-bg-color: var(--ti-common-color-light, #fff); + --ti-guide-button-secondary-disabled-bg-color: var(--ti-common-color-light, #ffffff); // 引导框按钮透明样式禁用文本色 - --ti-guide-button-secondary-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-guide-button-secondary-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 引导框按钮透明样式禁用边框色 - --ti-guide-button-secondary-disabled-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-guide-button-secondary-disabled-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 引导框按钮宽度 - --ti-guide-button-width: calc(var(--ti-common-line-height-8) + 8px); + --ti-guide-button-width: calc(var(--ti-common-line-height-8, 60px) + 8px); // 引导框按钮高度 - --ti-guide-button-height: var(--ti-common-line-height-2); + --ti-guide-button-height: var(--ti-common-line-height-2, 24px); // 引导框边框圆角 --ti-guide-shepherd-element-border-radius: 8px; // 分页提示文字颜色 diff --git a/packages/theme/src/hrapprover/vars.less b/packages/theme/src/hrapprover/vars.less index fe5a8e48f9..e32339073c 100644 --- a/packages/theme/src/hrapprover/vars.less +++ b/packages/theme/src/hrapprover/vars.less @@ -12,12 +12,12 @@ .component-css-vars-hrapprover() { --ti-hrapprover-error-border-color: var(--ti-base-color-bg-8, #c7000b); - --ti-hrapprover-table-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-hrapprover-table-font-size: var(--ti-common-font-size-base, 12px); + --ti-hrapprover-table-text-color: var(--ti-common-color-info-normal, #191919); + --ti-hrapprover-table-font-size: var(--ti-common-font-size-base, 14px); --ti-hrapprover-tr-bg-color: #fafafa; - --ti-hrapprover-tr-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); - --ti-hrapprover-tr-odd-bg-color: var(--ti-common-color-light, #fff); - --ti-hrapprover-th-height: var(--ti-common-size-height-small, 32px); - --ti-hrapprover-thead-border-color: var(--ti-common-color-border, #adb0b8); + --ti-hrapprover-tr-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); + --ti-hrapprover-tr-odd-bg-color: var(--ti-common-color-light, #ffffff); + --ti-hrapprover-th-height: var(--ti-common-size-height-small, 24px); + --ti-hrapprover-thead-border-color: var(--ti-common-color-border, #999999); --ti-hrapprover-thead-bg-color: #f1f1f1; } diff --git a/packages/theme/src/image-viewer/vars.less b/packages/theme/src/image-viewer/vars.less index 01b1955e35..6f2fb43d89 100644 --- a/packages/theme/src/image-viewer/vars.less +++ b/packages/theme/src/image-viewer/vars.less @@ -11,8 +11,8 @@ */ .component-css-vars-image-viewer() { - --ti-image-viewer-text-color: var(--ti-common-color-light, #fff); - --ti-image-viewer-actions-inner-text-color: var(--ti-common-color-light, #fff); + --ti-image-viewer-text-color: var(--ti-common-color-light, #ffffff); + --ti-image-viewer-actions-inner-text-color: var(--ti-common-color-light, #ffffff); --ti-image-viewer-close-font-size: var(--ti-common-font-size-4, 20px); --ti-image-viewer-close-bg-color: rgba(0,0,0,0.10); --ti-image-viewer-close-top: 40px; @@ -22,21 +22,21 @@ --ti-image-viewer-close-bg-color-hover: #606266; --ti-image-viewer-actions-border-radius: 22px; --ti-image-viewer-actions-inner-font-size: 23px; - --ti-image-viewer-actions-width: calc(var(--ti-common-size-50x) + var(--ti-common-size-12x)); - --ti-image-viewer-actions-height: var(--ti-common-size-10x); - --ti-image-viewer-actions-bottom: var(--ti-common-size-8x); + --ti-image-viewer-actions-width: calc(var(--ti-common-size-50x, 200px) + var(--ti-common-size-12x)); + --ti-image-viewer-actions-height: var(--ti-common-size-10x, 40px); + --ti-image-viewer-actions-bottom: var(--ti-common-size-8x, 32px); --ti-image-viewer-actions-inner-justify-content: space-around; --ti-image-viewer-next-font-size: var(--ti-common-font-size-5, 24px); --ti-image-viewer-next-width: 44px; --ti-image-viewer-next-height: 44px; --ti-image-viewer-mask-wrap-bg-color: none; --ti-image-viewer-btn-opacity: 1; - --ti-image-viewer-mask-bg-color: var(--ti-common-border-color-transparent-8); - --ti-image-viewer-actions-icon-margin-right: var(--ti-common-size-0); - --ti-image-viewer-actions-icon-size: var(--ti-common-font-size-2); - --ti-image-viewer-actions-count-font-size: var(--ti-common-font-size-1); - --ti-image-viewer-actions-count-margin-left: var(--ti-common-size-0); + --ti-image-viewer-mask-bg-color: var(--ti-common-border-color-transparent-8, var(--ti-base-bg-color-transparent-8)); + --ti-image-viewer-actions-icon-margin-right: var(--ti-common-size-0, 0px); + --ti-image-viewer-actions-icon-size: var(--ti-common-font-size-2, 16px); + --ti-image-viewer-actions-count-font-size: var(--ti-common-font-size-1, 14px); + --ti-image-viewer-actions-count-margin-left: var(--ti-common-size-0, 0px); --ti-image-viewer-actions-divider-display: none; - --ti-image-viewer-prev-left: var(--ti-common-size-8x); - --ti-image-viewer-next-right: var(--ti-common-size-8x); + --ti-image-viewer-prev-left: var(--ti-common-size-8x, 32px); + --ti-image-viewer-next-right: var(--ti-common-size-8x, 32px); } diff --git a/packages/theme/src/image/vars.less b/packages/theme/src/image/vars.less index 470977bb97..94c2eeb229 100644 --- a/packages/theme/src/image/vars.less +++ b/packages/theme/src/image/vars.less @@ -14,11 +14,11 @@ // 图片错误字号 --ti-image-error-font-size: var(--ti-common-font-size-1, 14px); // 图片错误色 - --ti-image-error-text-color: var(--ti-common-color-text-weaken); + --ti-image-error-text-color: var(--ti-common-color-text-weaken, #808080); // 图片错误背景色 - --ti-image-error-bg-color: var(--ti-common-color-bg-normal); + --ti-image-error-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 图片错误文本行高 - --ti-image-error-line-height: var(--ti-common-line-height-1); + --ti-image-error-line-height: var(--ti-common-line-height-1, 22px); // 图片错误icon和文本是否显示 --ti-image-error-display: inlin-block; // 图片错误背景图 diff --git a/packages/theme/src/ip-address/vars.less b/packages/theme/src/ip-address/vars.less index a97dbc7ff2..aee31903c8 100644 --- a/packages/theme/src/ip-address/vars.less +++ b/packages/theme/src/ip-address/vars.less @@ -12,48 +12,48 @@ .component-css-vars-ip-address() { // IP地址输入框高度 - --ti-ip-address-normal-height: var(--ti-common-size-8x); + --ti-ip-address-normal-height: var(--ti-common-size-8x, 32px); // IP地址输入框宽度 - --ti-ip-address-normal-width: calc(var(--ti-common-size-base) * 45.5); + --ti-ip-address-normal-width: calc(var(--ti-common-size-base, 4px) * 45.5); // IP地址输入框默认水平内边距 - --ti-ip-address-padding-horizontal: var(--ti-common-space-3x); + --ti-ip-address-padding-horizontal: var(--ti-common-space-3x, 12px); // Ip6单个内容左margin - --ti-ip-address-ipv6-delimiter-margin-right: var(--ti-common-space-base); + --ti-ip-address-ipv6-delimiter-margin-right: var(--ti-common-space-base, 4px); // IP地址输入框默认文本色 - --ti-ip-address-normal-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-ip-address-normal-text-color: var(--ti-common-color-info-normal, #191919); // IP地址输入框图标文本色 - --ti-ip-address-icon-color: var(--ti-common-color-info-normal, #252b3a); + --ti-ip-address-icon-color: var(--ti-common-color-info-normal, #191919); // IP地址输入框图标尺寸 --ti-ip-address-icon-size: calc(var(--ti-common-size-base, 4px) * 2.5); // IP地址输入框禁用文本色 - --ti-ip-address-normal-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-ip-address-normal-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // IP地址输入框默认边框色 - --ti-ip-address-normal-border-color: var(--ti-common-color-line-normal); + --ti-ip-address-normal-border-color: var(--ti-common-color-line-normal, #c2c2c2); // IP地址输入框默认背景色 - --ti-ip-address-normal-bg-color: var(--ti-common-color-light, #fff); + --ti-ip-address-normal-bg-color: var(--ti-common-color-light, #ffffff); // IP地址输入框圆角 - --ti-ip-address-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-ip-address-border-radius: var(--ti-common-border-radius-normal, 6px); // IP地址输入框字号 - --ti-ip-address-font-size: var(--ti-common-font-size-1); + --ti-ip-address-font-size: var(--ti-common-font-size-1, 14px); // IP地址输入框字族 --ti-ip-address-normal-font-family: "Manrop","Manrope-Medium"; // IP地址输入框聚焦边框色 - --ti-ip-address-border-color-focus: var(--ti-common-color-line-active, #5e7ce0); + --ti-ip-address-border-color-focus: var(--ti-common-color-line-active, #191919); // IP地址输入框悬浮边框色 - --ti-ip-address-border-color-hover: var(--ti-common-color-line-hover, #575d6c); + --ti-ip-address-border-color-hover: var(--ti-common-color-line-hover, #191919); // IP地址输入框禁用背景色 - --ti-ip-address-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-ip-address-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // IP地址输入框禁用边框色 - --ti-ip-address-disabled-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-ip-address-disabled-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // Ip地址输入框item宽度 - --ti-ip-address-input-width: var(--ti-common-size-8x); + --ti-ip-address-input-width: var(--ti-common-size-8x, 32px); // 尺寸 高度及行高 --ti--ip--address-medium-height: calc(var(--ti-common-size-height-medium)); - --ti--ip--address-medium-line-height: calc(var(--ti-common-line-height-5) + 2px); - --ti--ip--address-default-height: calc(var(--ti-common-size-height-normal) - 2px); - --ti--ip--address-default-line-height: var(--ti-common-line-height-4); - --ti--ip--address-small-height: calc(var(--ti-common-size-height-minor) - 4px); - --ti--ip--address-small-line-height: calc(var(--ti-common-line-height-3) - 2px); - --ti--ip--address-mini-height: calc(var(--ti-common-size-height-mini) - 2px); - --ti--ip--address-mini-line-height: calc(var(--ti-common-line-height-2) - 2px); + --ti--ip--address-medium-line-height: calc(var(--ti-common-line-height-5, 36px) + 2px); + --ti--ip--address-default-height: calc(var(--ti-common-size-height-normal, 32px) - 2px); + --ti--ip--address-default-line-height: var(--ti-common-line-height-4, 30px); + --ti--ip--address-small-height: calc(var(--ti-common-size-height-minor, 30px) - 4px); + --ti--ip--address-small-line-height: calc(var(--ti-common-line-height-3, 28px) - 2px); + --ti--ip--address-mini-height: calc(var(--ti-common-size-height-mini, 24px) - 2px); + --ti--ip--address-mini-line-height: calc(var(--ti-common-line-height-2, 24px) - 2px); } diff --git a/packages/theme/src/link-menu/vars.less b/packages/theme/src/link-menu/vars.less index f5d573ac59..3ee5c59836 100644 --- a/packages/theme/src/link-menu/vars.less +++ b/packages/theme/src/link-menu/vars.less @@ -12,29 +12,29 @@ .component-css-vars-link-menu() { // 收藏夹设置按钮图标色(和取消按钮文本色) - --ti-link-menu-nav-item-text-color: var(--ti-common-color-text-gray); + --ti-link-menu-nav-item-text-color: var(--ti-common-color-text-gray, #191919); // 收藏夹菜单导航右边框色 --ti-link-menu-nav-item-border-color: #c4c4c4; // 收藏夹菜单按钮文本色 --ti-link-menu-btn-text-color: rgba(24, 144, 255, 0.8); // 收藏夹设置按钮,弹出框输入框和取消按钮的背景色 - --ti-link-menu-btn-bg-color: var(--ti-common-color-light); + --ti-link-menu-btn-bg-color: var(--ti-common-color-light, #ffffff); // 收藏夹弹出框的输入框高度 - --ti-link-menu-input-height: var(--ti-common-size-height-normal, 28px); + --ti-link-menu-input-height: var(--ti-common-size-height-normal, 32px); // 收藏夹弹出框字号 - --ti-link-menu-input-font-size: var(--ti-common-font-size-base, 12px); + --ti-link-menu-input-font-size: var(--ti-common-font-size-base, 14px); // 收藏夹弹出框输入框(和列表项非节点)的文本色 - --ti-link-menu-input-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-link-menu-input-text-color: var(--ti-common-color-info-normal, #191919); // 收藏夹弹出框的输入框和取消按钮边框色 - --ti-link-menu-input-border-color: var(--ti-common-color-border, #adb0b8); + --ti-link-menu-input-border-color: var(--ti-common-color-border, #999999); // 收藏夹弹出框的输入框圆角 - --ti-link-menu-input-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-link-menu-input-border-radius: var(--ti-common-border-radius-normal, 6px); // 收藏夹弹出框列表项的节点文本色 - --ti-link-menu-tree-node-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-link-menu-tree-node-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 按钮边框颜色 - --ti-link-menu-btn-border-color: var(--ti-common-color-line-normal); + --ti-link-menu-btn-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 按钮圆角 - --ti-link-menu-btn-border-radius: var(--ti-common-border-radius-3); + --ti-link-menu-btn-border-radius: var(--ti-common-border-radius-3, 6px); // 按钮大小 - --ti-link-menu-btn-size: var(--ti-common-font-size-2); + --ti-link-menu-btn-size: var(--ti-common-font-size-2, 16px); } diff --git a/packages/theme/src/link/vars.less b/packages/theme/src/link/vars.less index d12a307055..2e63a4a19a 100644 --- a/packages/theme/src/link/vars.less +++ b/packages/theme/src/link/vars.less @@ -14,9 +14,9 @@ // 链接字号 --ti-link-font-size: var(--ti-common-font-size-1, 14px); // 链接字重 - --ti-link-font-weight: var(--ti-common-font-weight-4); + --ti-link-font-weight: var(--ti-common-font-weight-4, normal); // 链接下划线色(hide) - --ti-link-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-link-border-color: var(--ti-common-color-line-active, #191919); // 链接有图标时下划线宽度(hide) --ti-link-has-icon-underline-width: calc(100% - 20px); // 链接只有文字时下划线宽度(hide) @@ -26,33 +26,33 @@ // 链接图标宽度 --ti-link-svg-width: 16px; // 链接图标高度 - --ti-link-svg-height: var(--ti-common-size-5x); + --ti-link-svg-height: var(--ti-common-size-5x, 20px); // 链接图标右侧外边距 --ti-link-svg-margin-right: 4px; // 链接图标悬浮字重 - --ti-link-icon-hover-text-weight: var(--ti-common-font-weight-4); + --ti-link-icon-hover-text-weight: var(--ti-common-font-weight-4, normal); // 默认链接文本色 - --ti-link-default-text-color: var(--ti-common-color-text-highlight); + --ti-link-default-text-color: var(--ti-common-color-text-highlight, #1476ff); // 默认链接悬浮下划线色 --ti-link-default-border-color: #1476FF; // 默认链接悬浮文本色 - --ti-link-default-hover-text-color: var(--ti-common-color-text-highlight); + --ti-link-default-hover-text-color: var(--ti-common-color-text-highlight, #1476ff); // 默认链接禁用文本色 --ti-link-default-disabled-text-color: #C2C2C2; // 默认链接悬浮下划线色 --ti-link-default-hover-border-color: #595959; // 主要链接文本色 - --ti-link-primary-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-link-primary-text-color: var(--ti-common-color-primary-normal, #191919); // 主要链接悬浮下划线色 - --ti-link-primary-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-link-primary-border-color: var(--ti-common-color-line-active, #191919); // 主要链接悬浮文本色 - --ti-link-primary-hover-text-color: var(--ti-common-color-text-primary); + --ti-link-primary-hover-text-color: var(--ti-common-color-text-primary, #191919); // 主要链接禁用文本色 - --ti-link-primary-disabled-text-color: var(--ti-common-color-primary-disabled-text); + --ti-link-primary-disabled-text-color: var(--ti-common-color-primary-disabled-text, #c2c2c2); // 危险链接文本色 --ti-link-danger-text-color: #c7000b; @@ -61,37 +61,37 @@ // 危险链接悬浮文本色 --ti-link-danger-hover-text-color: #C7000B; // 危险链接禁用文本色 - --ti-link-danger-disabled-text-color: var(--ti-common-color-danger-disabled-text); + --ti-link-danger-disabled-text-color: var(--ti-common-color-danger-disabled-text, #c2c2c2); // 成功链接文本色 - --ti-link-success-text-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-link-success-text-color: var(--ti-common-color-success-normal, #5cb300); // 成功链接悬浮下划线色 - --ti-link-success-border-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-link-success-border-color: var(--ti-common-color-success-normal, #5cb300); // 成功链接悬浮文本色 - --ti-link-success-hover-text-color: var(--ti-common-color-success); + --ti-link-success-hover-text-color: var(--ti-common-color-success, #5cb300); // 成功链接禁用文本色 - --ti-link-success-disabled-text-color: var(--ti-common-color-success-disabled-text); + --ti-link-success-disabled-text-color: var(--ti-common-color-success-disabled-text, #c2c2c2); // 警告链接文本色 - --ti-link-warning-text-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-link-warning-text-color: var(--ti-common-color-warning-normal, #ff8800); // 警告链接悬浮下划线色 - --ti-link-warning-border-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-link-warning-border-color: var(--ti-common-color-warning-normal, #ff8800); // 警告链接悬浮文本色 - --ti-link-warning-hover-text-color: var(--ti-common-color-warn-text); + --ti-link-warning-hover-text-color: var(--ti-common-color-warn-text, #ff8800); // 警告链接禁用文本色 - --ti-link-warning-disabled-text-color: var(--ti-common-color-warning-disabled-text); + --ti-link-warning-disabled-text-color: var(--ti-common-color-warning-disabled-text, #c2c2c2); // 信息链接文本色 - --ti-link-info-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-link-info-text-color: var(--ti-common-color-info-normal, #191919); // 信息链接悬浮下划线色 - --ti-link-info-border-color: var(--ti-common-color-info-normal, #252b3a); + --ti-link-info-border-color: var(--ti-common-color-info-normal, #191919); // 信息链接悬浮文本色 - --ti-link-info-hover-text-color: var(--ti-common-color-text-primary); + --ti-link-info-hover-text-color: var(--ti-common-color-text-primary, #191919); // 信息链接禁用文本色 - --ti-link-info-disabled-text-color: var(--ti-common-color-info-disabled-text); + --ti-link-info-disabled-text-color: var(--ti-common-color-info-disabled-text, #c2c2c2); // 带有图标的链接悬浮文本色 --ti-link-has-svg-hover-text-color: #1476FF; // SVG - --ti-link-svg-padding-bottom: var(--ti-common-space-2); + --ti-link-svg-padding-bottom: var(--ti-common-space-2, 2px); } diff --git a/packages/theme/src/loading/vars.less b/packages/theme/src/loading/vars.less index 7a224af412..5a7c8bdb70 100644 --- a/packages/theme/src/loading/vars.less +++ b/packages/theme/src/loading/vars.less @@ -12,17 +12,17 @@ .component-css-vars-loading() { // 加载图标色 - --ti-loading-icon-color: var(--ti-common-color-icon-active, #5e7ce0); + --ti-loading-icon-color: var(--ti-common-color-icon-active, #191919); // 加载文本色 - --ti-loading-text-color: var(--ti-common-color-text-secondary); + --ti-loading-text-color: var(--ti-common-color-text-secondary, #595959); // 加载背景色 --ti-loading-mask-bg-color: #f5f5f5; // 加载文本字号 - --ti-loading-text-font-size: var(--ti-common-font-size-2); + --ti-loading-text-font-size: var(--ti-common-font-size-2, 16px); // 加载图标自定义加载图标顶部外边距 --ti-loading-spinner-margin-top: calc(var(--ti-common-space-0, 0px) - 21px); // 加载图标文本垂直方向外边距 - --ti-loading-text-margin-vertical: var(--ti-common-space-4x); + --ti-loading-text-margin-vertical: var(--ti-common-space-4x, 16px); // 加载图标文本水平方向外边距 --ti-loading-text-margin-horizontal: var(--ti-common-space-0, 0px); // 全屏加载图标small尺寸时的宽度 diff --git a/packages/theme/src/milestone/vars.less b/packages/theme/src/milestone/vars.less index 484123bcfa..b848bed7fa 100644 --- a/packages/theme/src/milestone/vars.less +++ b/packages/theme/src/milestone/vars.less @@ -12,34 +12,34 @@ .component-css-vars-milestone() { // 字号(不含旗子部分) - --ti-milestone-font-size: var(--ti-common-font-size-base, 12px); + --ti-milestone-font-size: var(--ti-common-font-size-base, 14px); // 节点实心显示光晕背景色 --ti-milestone-bg-color: var(--ti-common-color-icon-white, #fff); // 节点宽度 - --ti-milestone-icon-width: var(--ti-common-size-8x); + --ti-milestone-icon-width: var(--ti-common-size-8x, 32px); // 节点高度 - --ti-milestone-icon-height: var(--ti-common-size-8x); + --ti-milestone-icon-height: var(--ti-common-size-8x, 32px); // 节点默认边框色 - --ti-milestone-icon-border-color: var(--ti-common-color-line-active); + --ti-milestone-icon-border-color: var(--ti-common-color-line-active, #191919); // 节点默认边框粗细 - --ti-milestone-icon-border-width: var(--ti-common-border-weight-normal); + --ti-milestone-icon-border-width: var(--ti-common-border-weight-normal, 1px); // 完成节点边框粗细 --ti-milestone-icon-border-width-completed: 1px; // 节点图标大小 - --ti-milestone-icon-size: var(--ti-common-font-size-5); + --ti-milestone-icon-size: var(--ti-common-font-size-5, 24px); // 完成节点图标颜色 - --ti-milestone-icon-color: var(--ti-common-color-icon); // 保留原来样式，暂未适配默认主题 var(--ti-common-color-icon); + --ti-milestone-icon-color: var(--ti-common-color-icon, #191919); // 保留原来样式，暂未适配默认主题 var(--ti-common-color-icon, #191919); // 节点绝对定位左侧间距 --ti-milestone-icon-left: calc(50% - 16px); // 节点绝对定位顶部间距 - --ti-milestone-icon-top: var(--ti-common-size-0); + --ti-milestone-icon-top: var(--ti-common-size-0, 0px); // 未完成线路背景色 - --ti-milestone-line-bg-color: var(--ti-common-color-bg-dark-disabled); + --ti-milestone-line-bg-color: var(--ti-common-color-bg-dark-disabled, #dbdbdb); // 完成节点线路背景色 - --ti-milestone-line-bg-color-completed: var(--ti-common-color-bg-primary); + --ti-milestone-line-bg-color-completed: var(--ti-common-color-bg-primary, #191919); // 线高度 - --ti-milestone-line-height: var(--ti-common-border-weight-normal); + --ti-milestone-line-height: var(--ti-common-border-weight-normal, 1px); // 线宽度 --ti-milestone-line-width: calc(100% - 48px); // 线绝对定位左侧偏移 @@ -47,47 +47,47 @@ // 线绝对定位顶部偏移 --ti-milestone-line-top: -16px; // 节点下方日期文本色 - --ti-milestone-status-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-milestone-status-text-color: var(--ti-common-color-placeholder, #808080); // 节点下方日期文本字号 - --ti-milestone-status-font-size: var(--ti-common-font-size-0); + --ti-milestone-status-font-size: var(--ti-common-font-size-0, 12px); // 旗子宽度 --ti-milestone-flag-width: 88px; // 旗子高度 --ti-milestone-flag-height: 46px; // 旗子内间距 - --ti-milestone-flag-padding: var(--ti-common-size-base); + --ti-milestone-flag-padding: var(--ti-common-size-base, 4px); // 提示行高(hide) - --ti-milestone-flag-tip-line-height: var(--ti-common-line-height-4, 20px); + --ti-milestone-flag-tip-line-height: var(--ti-common-line-height-4, 30px); // 提示背景色(hide) - --ti-milestone-flag-tip-bg-color: var(--ti-common-color-bg-secondary, #adb0b8); + --ti-milestone-flag-tip-bg-color: var(--ti-common-color-bg-secondary, #c2c2c2); // 提示圆角(hide) - --ti-milestone-flag-tip-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-milestone-flag-tip-border-radius: var(--ti-common-border-radius-normal, 6px); // 旗子圆角 --ti-milestone-flag-content-border-radius: var(--ti-common-border-radius-0) var(--ti-common-border-radius-4) var(--ti-common-border-radius-4) var(--ti-common-border-radius-0); // 旗子默认字号(hide) --ti-milestone-flag-content-font-size: var(--ti-common-font-size-1, 14px); // 旗子背景色 - --ti-milestone-flag-content-bg-color: var(--ti-common-color-bg-normal); + --ti-milestone-flag-content-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 旗子标题字重 - --ti-milestone-flag-name-font-weight: var(--ti-common-font-weight-bold); + --ti-milestone-flag-name-font-weight: var(--ti-common-font-weight-bold, 600); // 旗子描述文本色 - --ti-milestone-flag-desc-text-color: var(--ti-common-color-text-secondary); + --ti-milestone-flag-desc-text-color: var(--ti-common-color-text-secondary, #595959); // 旗子文本色 - --ti-milestone-text-color: var(--ti-common-color-text-primary); + --ti-milestone-text-color: var(--ti-common-color-text-primary, #191919); // 旗子字号 - --ti-milestone-flag-font-size: var(--ti-common-font-size-base, 12px); + --ti-milestone-flag-font-size: var(--ti-common-font-size-base, 14px); // 旗子描述字号大小 - --ti-milestone-flag-desc-font-size: var(--ti-common-font-size-0); + --ti-milestone-flag-desc-font-size: var(--ti-common-font-size-0, 12px); // 旗子行高 - --ti-milestone-flag-line-height: var(--ti-common-line-height-1); + --ti-milestone-flag-line-height: var(--ti-common-line-height-1, 22px); // 旗子描述行高 - --ti-milestone-flag-desc-line-height: var(--ti-common-line-height-base); + --ti-milestone-flag-desc-line-height: var(--ti-common-line-height-base, 18px); // 旗子线绝对定位左侧间距 - --ti-milestone-flag-line-margin-left: var(--ti-common-size-0); + --ti-milestone-flag-line-margin-left: var(--ti-common-size-0, 0px); // 旗子线背景色 - --ti-milestone-flag-line-bg-color: var(--ti-common-color-bg-normal); + --ti-milestone-flag-line-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 旗子圆圈是否显示 --ti-milestone-dot-display: none; } diff --git a/packages/theme/src/modal/vars.less b/packages/theme/src/modal/vars.less index a8fcf4e14b..6728c1d988 100644 --- a/packages/theme/src/modal/vars.less +++ b/packages/theme/src/modal/vars.less @@ -14,30 +14,30 @@ // 默认宽度 --ti-modal-box-width: calc(var(--ti-common-space-10, 10px) * 40); // 模态框阴影 - --ti-modal-box-shadow: var(--ti-common-shadow-4-down); + --ti-modal-box-shadow: var(--ti-common-shadow-4-down, 0 8px 24px 0 rgba(0, 0, 0, 0.16)); // 字体族(hide) --ti-modal-font-family: var(--ti-common-font-family, 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei'); // 背景色 - --ti-modal-box-background-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-modal-box-background-color: var(--ti-common-color-bg-white-normal, #ffffff); // 边框圆角 - --ti-modal-box-border-radius: var(--ti-common-border-radius-4); + --ti-modal-box-border-radius: var(--ti-common-border-radius-4, 8px); // 边框色 --ti-modal-border-color: transparent; // 图标尺寸 --ti-modal-alert-icon-size: var(--ti-common-font-size-5, 24px); // 标题字号 - --ti-modal-header-font-size: var(--ti-common-font-size-4); + --ti-modal-header-font-size: var(--ti-common-font-size-4, 20px); // 标题文本色 - --ti-modal-header-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-modal-header-text-color: var(--ti-common-color-text-primary, #191919); // 标题字重 - --ti-modal-header-font-weight: var(--ti-common-font-weight-bold, 700); + --ti-modal-header-font-weight: var(--ti-common-font-weight-bold, 600); // 标题上内边距 --ti-modal-header-padding-top: var(--ti-common-space-8x, 32px); // 标题水平内边距 --ti-modal-header-padding-horizontal: var(--ti-common-space-8x, 32px); // 标题下内边距 - --ti-modal-header-padding-bottom: var(--ti-common-space-4x); + --ti-modal-header-padding-bottom: var(--ti-common-space-4x, 16px); // 内容上内边距 --ti-modal-body-padding-top: var(--ti-common-space-0, 0px); @@ -46,16 +46,16 @@ // 内容下内边距 --ti-modal-body-padding-bottom: var(--ti-common-space-0, 0px); // 内容字号 - --ti-modal-body-font-size: var(--ti-common-font-size-base, 12px); + --ti-modal-body-font-size: var(--ti-common-font-size-base, 14px); // 内容文本色 - --ti-modal-body-text-color: var(--ti-common-color-text-secondary); + --ti-modal-body-text-color: var(--ti-common-color-text-secondary, #595959); // 消息弹窗内容文本色 - --ti-modal-body-message-font-color: var(--ti-common-color-info-normal); + --ti-modal-body-message-font-color: var(--ti-common-color-info-normal, #191919); // 内容行高 --ti-modal-body-line-height: var(--ti-common-line-height-number, 1.5); // 底部上内边距 - --ti-modal-footer-padding-top: var(--ti-common-space-6x); + --ti-modal-footer-padding-top: var(--ti-common-space-6x, 24px); // 底部水平内边距 --ti-modal-footer-padding-horizontal: var(--ti-common-space-8x, 32px); // 底部下内边距 @@ -63,25 +63,25 @@ // 底部按钮位置 --ti-modal-footer-align: right; // 底部按钮圆角 - --ti-modal-footer-btn-border-radius: calc(var(--ti-common-space-10) * 5); + --ti-modal-footer-btn-border-radius: calc(var(--ti-common-space-10, 10px) * 5); // 底部按钮最小宽度 - --ti-modal-footer-btn-min-width: calc(var(--ti-common-space-base) * 24); + --ti-modal-footer-btn-min-width: calc(var(--ti-common-space-base, 4px) * 24); // 信息提示弹窗标题下边距 - --ti-modal-notification-header-padding-bottom: var(--ti-common-space-6x); + --ti-modal-notification-header-padding-bottom: var(--ti-common-space-6x, 24px); // message字号 - --ti-modal-message-font-size: var(--ti-common-font-size-base); + --ti-modal-message-font-size: var(--ti-common-font-size-base, 14px); // message阴影 --ti-modal-message-box-shadow: var(--ti-modal-box-shadow); // message左内边距 - --ti-modal-message-padding-left: var(--ti-common-space-4x); + --ti-modal-message-padding-left: var(--ti-common-space-4x, 16px); // message右内边距 - --ti-modal-message-padding-right: var(--ti-common-space-4x); + --ti-modal-message-padding-right: var(--ti-common-space-4x, 16px); // message垂直内边距 - --ti-modal-message-padding-vertical: var(--ti-common-space-3x); + --ti-modal-message-padding-vertical: var(--ti-common-space-3x, 12px); // message内容水平内边距(hide) - --ti-modal-message-body-padding-horizontal: var(--ti-common-space-0); + --ti-modal-message-body-padding-horizontal: var(--ti-common-space-0, 0px); // message状态图标尺寸 --ti-modal-message-status-icon-size: var(--ti-common-font-size-2, 16px); // message状态图标右边距 @@ -89,41 +89,41 @@ // message关闭图标尺寸 --ti-modal-message-close-icon-size: var(--ti-common-space-4x, 16px); // message图标父组件高度（hide) - --ti-modal-message-icon-box-height: calc(var(--ti-common-space-5x) - 1px); + --ti-modal-message-icon-box-height: calc(var(--ti-common-space-5x, 20px) - 1px); // message关闭图标左边距 --ti-modal-message-close-icon-margin-left: var(--ti-common-space-3x, 12px); // 基本提示图标色 - --ti-modal-primary-icon-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-modal-primary-icon-color: var(--ti-common-color-prompt, #1476ff); // 成功提示图标色 - --ti-modal-success-icon-color: var(--ti-common-color-success, #50d4ab); + --ti-modal-success-icon-color: var(--ti-common-color-success, #5cb300); // 错误提示图标色 - --ti-modal-error-icon-color: var(--ti-common-color-error, #f66f6a); + --ti-modal-error-icon-color: var(--ti-common-color-error, #f23030); // 警告提示图标色 - --ti-modal-warning-icon-color: var(--ti-common-color-warn, #fa9841); + --ti-modal-warning-icon-color: var(--ti-common-color-warn, #ff8800); // 加载提示图标色 - --ti-modal-loading-icon-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-modal-loading-icon-color: var(--ti-common-color-prompt, #1476ff); // 状态图标右边距 --ti-modal-status-icon-padding-right: var(--ti-common-space-2x, 8px); // 关闭按钮字号 - --ti-modal-close-btn-font-size: var(--ti-common-font-size-5); + --ti-modal-close-btn-font-size: var(--ti-common-font-size-5, 24px); // 关闭按钮与上边框的距离(hide) --ti-modal-close-btn-top: var(--ti-common-space-5x, 20px); // 关闭按钮内边距 --ti-modal-close-btn-padding-horizontal-vertical: var(--ti-common-space-0, 0px); // 关闭按钮图标色 - --ti-modal-close-btn-icon-color: var(--ti-common-color-icon-normal); + --ti-modal-close-btn-icon-color: var(--ti-common-color-icon-normal, #808080); // 关闭按钮悬浮图标色 - --ti-modal-close-btn-hover-icon-color: var(--ti-common-color-icon-hover); + --ti-modal-close-btn-hover-icon-color: var(--ti-common-color-icon-hover, #191919); // 关闭按钮悬浮背景色 - --ti-modal-close-btn-background-color-hover: var(--ti-common-color-bg-white-normal, #fff); + --ti-modal-close-btn-background-color-hover: var(--ti-common-color-bg-white-normal, #ffffff); // 关闭按钮与右边框的距离(hide) --ti-modal-close-btn-right: var(--ti-common-space-5x, 20px); // 缩放按钮与右边框的距离(hide) - --ti-modal-zoom-btn-right: calc(var(--ti-common-space-base) * 12); + --ti-modal-zoom-btn-right: calc(var(--ti-common-space-base, 4px) * 12); // 头部底线边框设置(hide) --ti-modal-header-border-bottom: none; // 关闭按钮颜色 - --ti-modal-btn-close-color: var(--ti-common-color-icon-normal); + --ti-modal-btn-close-color: var(--ti-common-color-icon-normal, #808080); } diff --git a/packages/theme/src/month-table/vars.less b/packages/theme/src/month-table/vars.less index 59140f9571..47945d28b8 100644 --- a/packages/theme/src/month-table/vars.less +++ b/packages/theme/src/month-table/vars.less @@ -11,15 +11,15 @@ */ .component-css-vars-month-table() { - --ti-month-table-td-text-bg-color: var(--ti-base-color-brand-2); - --ti-month-table-cell-today-text-color: var(--ti-common-color-info-normal); + --ti-month-table-td-text-bg-color: var(--ti-base-color-brand-2, #1476ff); + --ti-month-table-cell-today-text-color: var(--ti-common-color-info-normal, #191919); --ti-month-table-td-range-bg-color: #f2f6fc; - --ti-month-table-td-date-text-color: var(--ti-common-color-light, #fff); + --ti-month-table-td-date-text-color: var(--ti-common-color-light, #ffffff); --ti-month-table-td-date-border-radius: 24px; --ti-month-table-cell-today-font-weight: normal; --ti-month-table-cell-height: 28px; --ti-month-table-cell-border-radius: 14px; - --ti-month-table-cell-today-border-color: var(--ti-base-color-brand); - --ti-month-table-cell-hover-bg-color: var(--ti-base-color-brand-8); + --ti-month-table-cell-today-border-color: var(--ti-base-color-brand, #191919); + --ti-month-table-cell-hover-bg-color: var(--ti-base-color-brand-8, #deecff); --ti-month-table-td-div-height: 28px; } diff --git a/packages/theme/src/nav-menu/vars.less b/packages/theme/src/nav-menu/vars.less index 8076084b7b..88e1419335 100644 --- a/packages/theme/src/nav-menu/vars.less +++ b/packages/theme/src/nav-menu/vars.less @@ -14,69 +14,69 @@ // 导航菜单栏高度 --ti-nav-menu-height: var(--ti-common-size-height-large, 48px); // 导航菜单栏背景色 - --ti-nav-menu-bg-color: var(--ti-common-color-bg-navigation); + --ti-nav-menu-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 导航菜单栏字号 - --ti-nav-menu-item-font-size: var(--ti-common-font-size-base); + --ti-nav-menu-item-font-size: var(--ti-common-font-size-base, 14px); // 单个导航菜单外边距 - --ti-nav-menu-item-li-margin: var(--ti-common-size-4x); + --ti-nav-menu-item-li-margin: var(--ti-common-size-4x, 16px); // 自定义图标外左边距 - --ti-nav-menu-slot-logo-margin-left: var(--ti-common-size-4x); + --ti-nav-menu-slot-logo-margin-left: var(--ti-common-size-4x, 16px); // 自定义图标外右边距 - --ti-nav-menu-slot-logo-margin-right: var(--ti-common-size-12x); + --ti-nav-menu-slot-logo-margin-right: var(--ti-common-size-12x, 48px); // 导航菜单栏内边距 - --ti-nav-menu-padding: var(--ti-common-size-4x); + --ti-nav-menu-padding: var(--ti-common-size-4x, 16px); // 导航菜单栏文本色 - --ti-nav-menu-item-text-color: var(--ti-common-color-text-primary); + --ti-nav-menu-item-text-color: var(--ti-common-color-text-primary, #191919); // 导航菜单栏更多图标 - --ti-nav-menu-item-more-button-fill: var(--ti-common-color-text-primary); + --ti-nav-menu-item-more-button-fill: var(--ti-common-color-text-primary, #191919); // 导航菜单栏选中后字体大小 - --ti-nav-menu-item-text-font-weight: var(--ti-common-font-weight-bold); + --ti-nav-menu-item-text-font-weight: var(--ti-common-font-weight-bold, 600); // 导航菜单栏项悬浮背景色 - --ti-nav-menu-item-hover-bg-color: var(--ti-common-color-bg-navigation); + --ti-nav-menu-item-hover-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 导航菜单栏项选中下划线高度 - --ti-nav-menu-item-selected-underline-height: var(--ti-common-border-weight-1); + --ti-nav-menu-item-selected-underline-height: var(--ti-common-border-weight-1, 2px); // 导航菜单栏项选中下划线圆角 --ti-nav-menu-item-selected-border-radius: var(--ti-common-border-radius-0, 0); // 导航菜单栏项选中下划线固定定位底部距离(hide) - --ti-nav-menu-item-selected-position-bottom: var(--ti-common-space-0, 0); + --ti-nav-menu-item-selected-position-bottom: var(--ti-common-space-0, 0px); // 导航菜单栏项选中下划线背景色 - --ti-nav-menu-item-selected-underline-bg-color: var(--ti-common-color-text-primary); + --ti-nav-menu-item-selected-underline-bg-color: var(--ti-common-color-text-primary, #191919); // 导航菜单设置图标大小 --ti-nav-menu-setting-font-size: calc(var(--ti-common-size-base, 4px) * 5.5); // 导航菜单菜单栏下拉框阴影 - --ti-nav-menu-popmenu-box-shadow: var(--ti-common-shadow-2-down); + --ti-nav-menu-popmenu-box-shadow: var(--ti-common-shadow-2-down, 0 2px 12px 0 rgba(0, 0, 0, 0.16)); // 导航菜单菜单栏下拉框选中文本色 - --ti-nav-menu-popmenu-selected-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-nav-menu-popmenu-selected-text-color: var(--ti-common-color-info-normal, #191919); // 导航菜单菜单栏下拉框选中字重 - --ti-nav-menu-popmenu-selected-font-weight: var(--ti-common-font-weight-bold); + --ti-nav-menu-popmenu-selected-font-weight: var(--ti-common-font-weight-bold, 600); // 导航菜单菜单栏下拉框文本色 - --ti-nav-menu-popmenu-text-color: var(--ti-common-color-text-secondary); + --ti-nav-menu-popmenu-text-color: var(--ti-common-color-text-secondary, #595959); // 导航菜单下拉框边框色 - --ti-nav-menu-popmenu-border-color: var(--ti-common-color-bg-navigation); + --ti-nav-menu-popmenu-border-color: var(--ti-common-color-bg-navigation, #ffffff); // 导航菜单更多按钮展示的下拉框右边框色 - --ti-nav-menu-popmenu-more-menu-border-color-right: var(--ti-common-color-border, #adb0b8); + --ti-nav-menu-popmenu-more-menu-border-color-right: var(--ti-common-color-border, #999999); // 导航菜单更多按钮展示的下拉框高度 --ti-nav-menu-popmenu-more-item-height: var(--ti-common-space-10x, 40px); // 导航菜单更多按钮展示的下拉框列表项图标文本色 - --ti-nav-menu-popmenu-more-item-icon-color: var(--ti-common-color-icon-normal); + --ti-nav-menu-popmenu-more-item-icon-color: var(--ti-common-color-icon-normal, #808080); // 导航菜单更多按钮展示的下拉框列表项文本色 - --ti-nav-menu-popmenu-more-item-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-nav-menu-popmenu-more-item-text-color: var(--ti-common-color-info-normal, #191919); // 导航菜单更多按钮展示的下拉框列表项图标悬浮文本色 - --ti-nav-menu-popmenu-more-item-hover-icon-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-nav-menu-popmenu-more-item-hover-icon-color: var(--ti-common-color-primary-normal, #191919); // 导航菜单更多按钮展示的下拉框列表项 悬浮 文本色 - --ti-nav-menu-popmenu-more-item-hover-text-color: var(--ti-common-color-primary-normal); + --ti-nav-menu-popmenu-more-item-hover-text-color: var(--ti-common-color-primary-normal, #191919); // 导航菜单更多按钮展示的下拉框列表项选中背景色 - --ti-nav-menu-popmenu-more-item-selected-bg-color: var(--ti-common-color-bg-navigation); + --ti-nav-menu-popmenu-more-item-selected-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 导航菜单更多按钮展示的下拉框列表项选中分割线粗细 --ti-nav-menu-popmenu-more-item-before-width: 0; // 导航菜单下拉框可点选项的 悬浮 背景色 --ti-nav-menu-popmenu-more-item-hover-bg-color: #F5F5F5; // 导航菜单下拉框非标题选项点击瞬间背景色 - --ti-nav-menu-popmenu-more-item-active-bg-color: var(--ti-common-color-bg-navigation); + --ti-nav-menu-popmenu-more-item-active-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // 导航菜单下拉框副菜单区域垂直内边距 --ti-nav-menu-submenu-padding-vertical: var(--ti-common-space-0, 0px); // 导航菜单下拉框副菜单区域水平内边距 - --ti-nav-menu-submenu-padding-horizontal: calc(var(--ti-common-space-base) * 20.5); + --ti-nav-menu-submenu-padding-horizontal: calc(var(--ti-common-space-base, 4px) * 20.5); // 导航菜单下拉框标题底部内边距 --ti-nav-menu-popmenu-node-title-padding-bottom: var(--ti-common-space-0, 0px); // 导航菜单下拉框标题顶部外边距 @@ -84,7 +84,7 @@ // 导航菜单下拉框标题右边外边距 --ti-nav-menu-popmenu-node-title-margin-right: var(--ti-common-space-8x, 32px); // 导航菜单下拉框标题底部外边距 - --ti-nav-menu-popmenu-node-title-margin-bottom: calc(var(--ti-common-space-4x) + 2px); + --ti-nav-menu-popmenu-node-title-margin-bottom: calc(var(--ti-common-space-4x, 16px) + 2px); // 导航菜单下拉框标题左边外边距 --ti-nav-menu-popmenu-node-title-margin-left: var(--ti-common-space-0, 0px); // 导航菜单下拉框标题底部边框宽度 @@ -94,13 +94,13 @@ // 导航菜单下拉框标题字号 --ti-nav-menu-popmenu-node-title-font-size: var(--ti-common-font-size-1, 14px); // 导航菜单下拉框标题字号 - --ti-nav-menu-popmenu-text-font-size: var(--ti-common-font-size-0); + --ti-nav-menu-popmenu-text-font-size: var(--ti-common-font-size-0, 12px); // 导航菜单下拉框非标题项字号 - --ti-nav-menu-popmenu-node-item-font-size: var(--ti-common-font-size-base, 12px); + --ti-nav-menu-popmenu-node-item-font-size: var(--ti-common-font-size-base, 14px); // 导航菜单下拉框外边距 - --ti-nav-menu-submenu-group-margin-top: var(--ti-common-size-9x); + --ti-nav-menu-submenu-group-margin-top: var(--ti-common-size-9x, 36px); // 导航菜单下拉框外上边距 - --ti-nav-menu-popmenu-node-item-padding-top: var(--ti-common-space-0); + --ti-nav-menu-popmenu-node-item-padding-top: var(--ti-common-space-0, 0px); // 导航菜单下拉框外下边距 - --ti-nav-menu-popmenu-node-item-padding-button: calc(var(--ti-common-space-3x) + 2px); + --ti-nav-menu-popmenu-node-item-padding-button: calc(var(--ti-common-space-3x, 12px) + 2px); } diff --git a/packages/theme/src/notify/vars.less b/packages/theme/src/notify/vars.less index 3f6bd6ef9d..166b1e5d92 100644 --- a/packages/theme/src/notify/vars.less +++ b/packages/theme/src/notify/vars.less @@ -12,33 +12,33 @@ .component-css-vars-notify() { // 通知背景色 - --ti-notify-bg-color: var(--ti-common-color-prompt-bg, #ebf6ff); + --ti-notify-bg-color: var(--ti-common-color-prompt-bg, #deecff); // info类型弹框背景色 - --ti-notify-info-bg-color: var(--ti-common-color-bg-navigation); + --ti-notify-info-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // info类型弹框左侧图标色 - --ti-notify-info-icon-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-notify-info-icon-color: var(--ti-common-color-prompt, #1476ff); // warning类型弹框背景色 - --ti-notify-warning-bg-color: var(--ti-common-color-bg-navigation); + --ti-notify-warning-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // warning类型弹框左侧图标色 - --ti-notify-warning-icon-color: var(--ti-common-color-warn, #fa9841); + --ti-notify-warning-icon-color: var(--ti-common-color-warn, #ff8800); // error类型弹框背景色 - --ti-notify-error-bg-color: var(--ti-common-color-bg-navigation); + --ti-notify-error-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // error类型弹框左侧图标色 - --ti-notify-error-icon-color: var(--ti-common-color-error, #f66f6a); + --ti-notify-error-icon-color: var(--ti-common-color-error, #f23030); // success类型弹框背景色 - --ti-notify-success-bg-color: var(--ti-common-color-bg-navigation); + --ti-notify-success-bg-color: var(--ti-common-color-bg-navigation, #ffffff); // success类型弹框左侧图标色 - --ti-notify-success-icon-color: var(--ti-common-color-success, #50d4ab); + --ti-notify-success-icon-color: var(--ti-common-color-success, #5cb300); // 通知文本色（没有效果） - --ti-notify-text-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-notify-text-color: var(--ti-common-color-bg-emphasize, #191919); // 弹框圆角 - --ti-notify-border-radius: var(--ti-common-border-radius-4); + --ti-notify-border-radius: var(--ti-common-border-radius-4, 8px); // 弹框文本色 - --ti-notify-title-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-notify-title-text-color: var(--ti-common-color-info-normal, #191919); // 内容文本色 - --ti-notify-content-text-color: var(--ti-common-color-text-secondary); + --ti-notify-content-text-color: var(--ti-common-color-text-secondary, #595959); // 弹框标题字号 - --ti-notify-title-font-size: var(--ti-common-font-size-2); + --ti-notify-title-font-size: var(--ti-common-font-size-2, 16px); // 通知标题字重（没有效果） --ti-notify-title-font-weight: 600; // 弹框标题顶部外边距 @@ -56,13 +56,13 @@ // 弹框文字底部外边距 --ti-notify-message-margin-bottom: var(--ti-common-space-0, 0px); // 弹框文字右外边距 - --ti-notify-message-margin-right: var(--ti-common-space-3x); + --ti-notify-message-margin-right: var(--ti-common-space-3x, 12px); // 弹框文字左外边距 - --ti-notify-message-margin-left: var(--ti-common-space-2x); + --ti-notify-message-margin-left: var(--ti-common-space-2x, 8px); // 弹框左侧图标尺寸 --ti-notify-icon-size: var(--ti-common-font-size-5, 24px); // 弹框关闭图标色 - --ti-notify-close-icon-color: var(--ti-common-color-icon-normal); + --ti-notify-close-icon-color: var(--ti-common-color-icon-normal, #808080); // 弹框最大宽度 --ti-notify-max-width: 340px; // 弹框阴影 @@ -72,17 +72,17 @@ // 弹框水平方向内边距 --ti-notify-padding-horizontal: var(--ti-common-space-4x, 16px); // 关闭图标大小 - --ti-notify-close-icon-font-size: var(--ti-common-font-size-4); + --ti-notify-close-icon-font-size: var(--ti-common-font-size-4, 20px); // 关闭图标悬浮时颜色 - --ti-notify-close-hover-icon-color: var(--ti-common-color-icon-hover); + --ti-notify-close-hover-icon-color: var(--ti-common-color-icon-hover, #191919); // 弹框为top-left方向时左边距 - --ti-notify-position-top-left: var(--ti-common-space-6x); + --ti-notify-position-top-left: var(--ti-common-space-6x, 24px); // 弹框为bottom-left方向时左边距 - --ti-notify-position-bottom-left: var(--ti-common-space-6x); + --ti-notify-position-bottom-left: var(--ti-common-space-6x, 24px); // 弹框为top-right方向时右边距 - --ti-notify-position-top-right: var(--ti-common-space-6x); + --ti-notify-position-top-right: var(--ti-common-space-6x, 24px); // 弹框为bottom-right方向时右边距 - --ti-notify-position-bottom-right: var(--ti-common-space-6x); + --ti-notify-position-bottom-right: var(--ti-common-space-6x, 24px); // 关闭图标位移 --ti-notify-icon-transform: translate(0,-1px); } diff --git a/packages/theme/src/numeric/vars.less b/packages/theme/src/numeric/vars.less index 37a56b7719..341460e488 100644 --- a/packages/theme/src/numeric/vars.less +++ b/packages/theme/src/numeric/vars.less @@ -14,50 +14,50 @@ // 默认宽度 --ti-numeric-input-width: calc(var(--ti-common-size-width-medium, 120px) + 6px); // 默认高度 - --ti-numeric-input-normal-height: var(--ti-common-size-height-normal, 28px); + --ti-numeric-input-normal-height: var(--ti-common-size-height-normal, 32px); // 边框圆角 - --ti-numeric-input-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-numeric-input-border-radius: var(--ti-common-border-radius-normal, 6px); // 边框默认色 - --ti-numeric-input-normal-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-numeric-input-normal-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 分隔线颜色 - --ti-numeric-input-dividing-border-color: var(--ti-common-border-color-transparent-8); + --ti-numeric-input-dividing-border-color: var(--ti-common-border-color-transparent-8, var(--ti-base-bg-color-transparent-8)); // 分割线高度 - --ti-numeric-input-dividing-border-height: var(--ti-common-space-5x); + --ti-numeric-input-dividing-border-height: var(--ti-common-space-5x, 20px); // 禁用时分割线display(hide) --ti-numeric-input-dividing-border-display: none; // 输入框字号 - --ti-numeric-input-normal-font-size: var(--ti-common-font-size-base, 12px); + --ti-numeric-input-normal-font-size: var(--ti-common-font-size-base, 14px); // 输入框字体色 - --ti-numeric-input-normal-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-numeric-input-normal-text-color: var(--ti-common-color-text-primary, #191919); // 默认背景色 - --ti-numeric-input-normal-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-numeric-input-normal-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 按钮默认宽度 --ti-numeric-input-icon-width: calc(var(--ti-numeric-input-normal-height) - 1px); // 悬浮边框色 - --ti-numeric-input-normal-active-border-color: var(--ti-common-color-border-hover, #575d6c); + --ti-numeric-input-normal-active-border-color: var(--ti-common-color-border-hover, #191919); // 按钮图标色 - --ti-numeric-input-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-numeric-input-icon-color: var(--ti-common-color-icon-normal, #808080); // 提示占位符文本色 - --ti-numeric-input-placeholder-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-numeric-input-placeholder-text-color: var(--ti-common-color-placeholder, #808080); // 按钮悬浮图标色 - --ti-numeric-input-icon-color-hover: var(--ti-common-color-line-hover, #575d6c); + --ti-numeric-input-icon-color-hover: var(--ti-common-color-line-hover, #191919); // 按钮禁用图标色 - --ti-numeric-input-icon-color-disabled: var(--ti-common-color-icon-disabled, #adb0b8); + --ti-numeric-input-icon-color-disabled: var(--ti-common-color-icon-disabled, #c2c2c2); // 聚焦时边框色 - --ti-numeric-input-border-color-active: var(--ti-common-color-line-active, #5e7ce0); + --ti-numeric-input-border-color-active: var(--ti-common-color-line-active, #191919); // 图标大小 - --ti-numeric-input-icon-size: calc(var(--ti-common-font-size-base, 12px) + 2px); + --ti-numeric-input-icon-size: calc(var(--ti-common-font-size-base, 14px) + 2px); // 禁用文本色 - --ti-numeric-input-disabled-text-color: var(--ti-common-color-primary-disabled-text); + --ti-numeric-input-disabled-text-color: var(--ti-common-color-primary-disabled-text, #c2c2c2); // 禁用背景色 - --ti-numeric-input-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-numeric-input-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 禁用时边框色 - --ti-numeric-input-border-color-disabled: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-numeric-input-border-color-disabled: var(--ti-common-color-line-disabled, #dbdbdb); // 按钮禁用时背景色 - --ti-numeric-input-btn-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-numeric-input-btn-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 按钮禁用时分隔线颜色 - --ti-numeric-input-btn-border-color-disabled: var(--ti-common-color-transparent); + --ti-numeric-input-btn-border-color-disabled: var(--ti-common-color-transparent, transparent); // medium尺寸宽度 --ti-numeric-input-width-medium: calc(var(--ti-common-size-width-large, 152px) + 6px); @@ -68,7 +68,7 @@ // medium尺寸图标大小 --ti-numeric-input-icon-size-medium: var(--ti-common-font-size-2, 16px); // medium尺寸分割线高度 - --ti-numeric-input-divider-height-medium: var(--ti-common-space-6x); + --ti-numeric-input-divider-height-medium: var(--ti-common-space-6x, 24px); // small尺寸宽度 --ti-numeric-input-width-small: calc(var(--ti-common-size-34x, 136px) + 6px); @@ -79,7 +79,7 @@ // small尺寸图标大小 --ti-numeric-input-icon-size-small: var(--ti-common-font-size-1, 14px); // small尺寸分割线高度 - --ti-numeric-input-divider-height-small: calc(var(--ti-common-space-5x) - 2px); + --ti-numeric-input-divider-height-small: calc(var(--ti-common-space-5x, 20px) - 2px); // mini尺寸宽度 --ti-numeric-input-width-mini: calc(var(--ti-common-space-10, 10px) * 13); @@ -88,18 +88,18 @@ // mini尺寸按钮宽度 --ti-numeric-input-icon-width-mini: var(--ti-numeric-input-height-mini); // mini尺寸图标大小 - --ti-numeric-input-icon-size-mini: var(--ti-common-font-size-base, 12px); + --ti-numeric-input-icon-size-mini: var(--ti-common-font-size-base, 14px); // mini尺寸分割线高度 - --ti-numeric-input-divider-height-mini: calc(var(--ti-common-space-4x) - 1px); + --ti-numeric-input-divider-height-mini: calc(var(--ti-common-space-4x, 16px) - 1px); // 单位内容宽度 --ti-numeric-input-unit-width: calc(var(--ti-common-space-10, 10px) * 5); // 单位字体色 - --ti-numeric-input-unit-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-numeric-input-unit-text-color: var(--ti-common-color-text-secondary, #595959); // 单位字号 - --ti-numeric-input-unit-font-size: var(--ti-common-font-size-base, 12px); + --ti-numeric-input-unit-font-size: var(--ti-common-font-size-base, 14px); // 单位左边框颜色 - --ti-numeric-input-unit-border-left-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-numeric-input-unit-border-left-color: var(--ti-common-color-line-dividing, #f0f0f0); // 单位背景色 --ti-numeric-input-unit-bg-color: var(--ti-common-color-bg-gray, #fafafa); } diff --git a/packages/theme/src/option-group/vars.less b/packages/theme/src/option-group/vars.less index 4763a05433..241c9870b4 100644 --- a/packages/theme/src/option-group/vars.less +++ b/packages/theme/src/option-group/vars.less @@ -12,25 +12,25 @@ .component-css-vars-option-group() { // 分组分割线填充色 - --ti-option-group-line-dividing-bg-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-option-group-line-dividing-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 分组标题字号 - --ti-option-group-title-font-size: var(--ti-common-font-size-0); + --ti-option-group-title-font-size: var(--ti-common-font-size-0, 12px); // 分组标题字重 - --ti-option-group-title-font-weight: var(--ti-common-font-weight-normal); + --ti-option-group-title-font-weight: var(--ti-common-font-weight-normal, 400); // 分组标题字体颜色 - --ti-option-group-title-text-color: var(--ti-common-color-text-weaken); + --ti-option-group-title-text-color: var(--ti-common-color-text-weaken, #808080); // 分组标题行高 - --ti-option-group-title-line-height: var(--ti-common-line-height-base); + --ti-option-group-title-line-height: var(--ti-common-line-height-base, 18px); // 分组标题高度 - --ti-option-group-title-height: var(--ti-common-size-auto); + --ti-option-group-title-height: var(--ti-common-size-auto, auto); // 分组标题水平方向外边距 - --ti-option-group-title-padding-horizontal: var(--ti-common-space-4x); + --ti-option-group-title-padding-horizontal: var(--ti-common-space-4x, 16px); // 分组标题顶部外边距 - --ti-option-group-title-margin-top: var(--ti-common-space-2x); + --ti-option-group-title-margin-top: var(--ti-common-space-2x, 8px); // 分组标题底部外边距 - --ti-option-group-title-margin-bottom: var(--ti-common-space-2); + --ti-option-group-title-margin-bottom: var(--ti-common-space-2, 2px); // 分组第一个标题顶部外边距 - --ti-option-group-title-margin-top-first: var(--ti-common-space-base); + --ti-option-group-title-margin-top-first: var(--ti-common-space-base, 4px); // 分组分割线高度 --ti-option-group-line-dividing-height: var(--ti-common-size-0, 0px); // 分组底部内边距 diff --git a/packages/theme/src/option/vars.less b/packages/theme/src/option/vars.less index d4174931ff..ee8b2258d7 100644 --- a/packages/theme/src/option/vars.less +++ b/packages/theme/src/option/vars.less @@ -12,31 +12,31 @@ .component-css-vars-option() { // 选择器下拉选项文本色 - --ti-option-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-option-text-color: var(--ti-common-color-info-normal, #191919); // 选择器下拉选项字号 - --ti-option-font-size: var(--ti-common-font-size-1); + --ti-option-font-size: var(--ti-common-font-size-1, 14px); // 选择器下拉选项高度 - --ti-option-height: var(--ti-common-size-height-normal); + --ti-option-height: var(--ti-common-size-height-normal, 32px); // 选择器下拉选项行高 --ti-option-line-height: var(--ti-common-line-height-number, 1.5); // 选择器下拉选项禁用色 - --ti-option-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-option-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 选择器下拉选项圆角 - --ti-option-border-radius: var(--ti-common-border-radius-0); + --ti-option-border-radius: var(--ti-common-border-radius-0, 0); // 选择器下拉选项禁用背景色 - --ti-option-disabled-bg-color: var(--ti-common-color-light, #fff); + --ti-option-disabled-bg-color: var(--ti-common-color-light, #ffffff); // 选择器下拉选项背景色 - --ti-option-bg-color-selected: var(--ti-common-color-light, #fff); + --ti-option-bg-color-selected: var(--ti-common-color-light, #ffffff); // 选择器下拉选项悬浮背景色 - --ti-option-hover-bg-color: var(--ti-common-color-bg-normal); + --ti-option-hover-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 选择器下拉选项选中项背景色 - --ti-option-hover-bg-color-selected: var(--ti-common-color-hover-background, #f2f5fc); + --ti-option-hover-bg-color-selected: var(--ti-common-color-hover-background, #f5f5f5); // 选择器下拉已选项悬浮背景色 - --ti-option-selected-bg-color-hover: var(--ti-common-color-bg-white-emphasize); + --ti-option-selected-bg-color-hover: var(--ti-common-color-bg-white-emphasize, #f0f0f0); // 选择器下拉选项选中背景色 - --ti-option-selected-bg-color: var(--ti-common-color-bg-white-normal); + --ti-option-selected-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 选择器下拉选项选中字重 - --ti-option-selected-font-weight: var(--ti-common-font-weight-6); + --ti-option-selected-font-weight: var(--ti-common-font-weight-6, 600); // 选择下拉框选项已选色 --ti-option-selected-text-color: #1476FF; // 选择器下拉选项复选框悬浮色 @@ -44,19 +44,19 @@ // 选择器下拉选项复选框悬浮色 --ti-option-checkbox-all-select-border-color-hover: #1476FF; // 选择器选中下拉选项图标和文本色 - --ti-option-icon-color-selected: var(--ti-common-color-icon-graybg-active); + --ti-option-icon-color-selected: var(--ti-common-color-icon-graybg-active, #191919); // 选择下拉框选项垂直内边距 --ti-option-padding-vertical: var(--ti-common-space-0, 0px); // 选择下拉框选项水平内边距 - --ti-option-padding-horizontal: var(--ti-common-space-4x); + --ti-option-padding-horizontal: var(--ti-common-space-4x, 16px); // 分组场景选择下拉框选项水平内边距 - --ti-option-padding-horizontal-group: var(--ti-common-space-4x); + --ti-option-padding-horizontal-group: var(--ti-common-space-4x, 16px); // 选择下拉框选项顶部外边距 --ti-option-margin-top: var(--ti-common-size-0, 0px); // 选择器下拉选项高亮文本色 - --ti-option-highlight-text-color: var(--ti-common-color-text-highlight, #526ecc); + --ti-option-highlight-text-color: var(--ti-common-color-text-highlight, #1476ff); // 选择器下拉选项已选项高亮文本色 - --ti-option-highlight-selected-text-color: var(--ti-common-color-text-highlight); + --ti-option-highlight-selected-text-color: var(--ti-common-color-text-highlight, #1476ff); // 选择器下拉选项图标右侧外边距 --ti-option-icon-margin-right: var(--ti-common-space-2x, 8px); // 选择器下拉选项图标尺寸 diff --git a/packages/theme/src/picker/vars.less b/packages/theme/src/picker/vars.less index 76fe9fc200..ce469992b9 100644 --- a/packages/theme/src/picker/vars.less +++ b/packages/theme/src/picker/vars.less @@ -12,9 +12,9 @@ .component-css-vars-picker() { --ti-range-separator-text-color: #303133; - --ti-date-editor-input-medium-height: var(--ti-common-size-height-medium); - --ti-date-editor-input-small-height: var(--ti-common-line-height-3); - --ti-date-editor-input-border-color: var(--ti-common-color-line-hover); - --ti-date-editor-input-icon-color-fill: var(--ti-base-color-common-2); + --ti-date-editor-input-medium-height: var(--ti-common-size-height-medium, 40px); + --ti-date-editor-input-small-height: var(--ti-common-line-height-3, 28px); + --ti-date-editor-input-border-color: var(--ti-common-color-line-hover, #191919); + --ti-date-editor-input-icon-color-fill: var(--ti-base-color-common-2, #808080); --ti-input-clear-text-color-hover: #191919; } diff --git a/packages/theme/src/pop-upload/vars.less b/packages/theme/src/pop-upload/vars.less index f38a767ab3..d0113f5642 100644 --- a/packages/theme/src/pop-upload/vars.less +++ b/packages/theme/src/pop-upload/vars.less @@ -12,7 +12,7 @@ .component-css-vars-pop-upload() { // 上传按钮文字大小(hide) - --ti-popupload-font-size: var(--ti-common-font-size-base, 12px); + --ti-popupload-font-size: var(--ti-common-font-size-base, 14px); // 弹窗头部alert提示底部外边距 --ti-popupload-dialog-header-alert-margin-bottom: var(--ti-common-space-10, 10px); // 弹窗表格高度 @@ -22,19 +22,19 @@ // 弹窗表格顶部外边距 --ti-popupload-dialog-margin-top: var(--ti-common-space-10, 10px); // 弹窗表格头部横向分割线颜色 - --ti-popupload-dialog-table-border-color: var(--ti-common-color-transparent); + --ti-popupload-dialog-table-border-color: var(--ti-common-color-transparent, transparent); // 弹窗表格头部竖向分割线颜色(new) - --ti-popupload-dialog-table-line-bg-color: var(--ti-common-bg-color-transparent-15); + --ti-popupload-dialog-table-line-bg-color: var(--ti-common-bg-color-transparent-15, var(--ti-base-bg-color-transparent-15)); // 弹窗表格头部竖向分割线高度(new) - --ti-popupload-dialog-table-line-height: var(--ti-common-size-4x); + --ti-popupload-dialog-table-line-height: var(--ti-common-size-4x, 16px); // 弹窗表格头部高度 - --ti-popupload-dialog-table-header-height: var(--ti-common-size-height-small, 32px); + --ti-popupload-dialog-table-header-height: var(--ti-common-size-height-small, 24px); // 弹窗表格头部文本色 - --ti-popupload-dialog-table-header-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-popupload-dialog-table-header-text-color: var(--ti-common-color-text-primary, #191919); // 弹窗表格头部字重 - --ti-popupload-dialog-table-header-font-weight: var(--ti-common-font-weight-bold, 700); + --ti-popupload-dialog-table-header-font-weight: var(--ti-common-font-weight-bold, 600); // 弹窗表格头部背景色 - --ti-popupload-dialog-table-header-bg-color: var(--ti-common-color-bg-normal, #eef0f5); + --ti-popupload-dialog-table-header-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 弹窗表格头部item垂直内边距 --ti-popupload-table-header-col-padding-vertical: var(--ti-common-space-0, 0px); // 弹窗表格头部item水平内边距 @@ -48,21 +48,21 @@ // 弹窗表格内容item水平外边距 --ti-popupload-table-body-col-margin-horizontal: var(--ti-common-space-0, 0px); // 弹窗表格内容item行高 - --ti-popupload-table-body-col-line-height: var(--ti-common-line-height-4, 20px); + --ti-popupload-table-body-col-line-height: var(--ti-common-line-height-4, 30px); // 弹窗表格内容偶数行背景色 - --ti-popupload-table-item-even-bg-color: var(--ti-common-color-bg-white-normal); + --ti-popupload-table-item-even-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 弹窗表格每行底部边框色(new) - --ti-popupload-table-item-border-color: var(--ti-common-border-color-transparent-8); + --ti-popupload-table-item-border-color: var(--ti-common-border-color-transparent-8, var(--ti-base-bg-color-transparent-8)); // 弹窗表格底部内边距 --ti-popupload-dialog-table-body-padding-bottom: var(--ti-common-space-10, 10px); // 弹窗底部内边距 --ti-popupload-dialog-footer-padding-bottom: var(--ti-common-space-6x, 24px); // 弹窗已上传文件的删除文本色 - --ti-popupload-dialog-delete-text-color: var(--ti-common-color-text-link, #526ecc); + --ti-popupload-dialog-delete-text-color: var(--ti-common-color-text-link, #1476ff); // 弹窗文件列表等待上传圆圈色 - --ti-popupload-status-icon-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-popupload-status-icon-color: var(--ti-common-color-line-normal, #c2c2c2); // 弹窗文件列表上传成功圆圈色 - --ti-popupload-status-success-icon-color: var(--ti-common-color-success, #50d4ab); + --ti-popupload-status-success-icon-color: var(--ti-common-color-success, #5cb300); // 弹窗文件列表上传失败圆圈色 - --ti-popupload-status-fail-icon-color: var(--ti-common-color-error-border, #f66f6a); + --ti-popupload-status-fail-icon-color: var(--ti-common-color-error-border, #f23030); } diff --git a/packages/theme/src/popconfirm/vars.less b/packages/theme/src/popconfirm/vars.less index eab98a2a23..269fd16e55 100644 --- a/packages/theme/src/popconfirm/vars.less +++ b/packages/theme/src/popconfirm/vars.less @@ -12,28 +12,28 @@ .component-css-vars-popconfirm() { // 提示弹窗title字体行高 - --ti-popconfirm-popover-title-line-height:var(--ti-common-line-height-2); + --ti-popconfirm-popover-title-line-height:var(--ti-common-line-height-2, 24px); // 提示弹窗content字体行高 - --ti-popconfirm-popover-content-line-height: var(--ti-common-line-height-1); + --ti-popconfirm-popover-content-line-height: var(--ti-common-line-height-1, 22px); // 底部按钮flex排列方式 --ti-popconfirm-popover-footer-justify-content: right; // 提示弹窗字体大小 - --ti-popconfirm-popover-footer-font-size: var(--ti-common-font-size-base, 12px); + --ti-popconfirm-popover-footer-font-size: var(--ti-common-font-size-base, 14px); // 提示弹窗字体颜色 --ti-popconfirm-popover-footer-font-color: #191919; // 提示弹窗容器垂直内边距 - --ti-popconfirm-popover-container-padding-vertical: var(--ti-common-space-base); + --ti-popconfirm-popover-container-padding-vertical: var(--ti-common-space-base, 4px); // 提示弹窗图标大小 - --ti-popconfirm-popover-icon-width: var(--ti-common-size-5x); + --ti-popconfirm-popover-icon-width: var(--ti-common-size-5x, 20px); --ti-popconfirm-popover-icon-margin-bottom: 2px; // 提示弹窗图标上侧外边距 - --ti-popconfirm-popover-icon-margin-right: var(--ti-common-space-base); + --ti-popconfirm-popover-icon-margin-right: var(--ti-common-space-base, 4px); // 提示弹窗底部按钮容器上侧外边距 --ti-popconfirm-popover-footer-margin-top: var(--ti-common-space-4x, 16px); // 标题字重、大小 - --ti-popconfirm-popover-title-font-size: var(--ti-common-font-size-2); - --ti-popconfirm-popover-title-font-weight: var(--ti-common-font-weight-bold); + --ti-popconfirm-popover-title-font-size: var(--ti-common-font-size-2, 16px); + --ti-popconfirm-popover-title-font-weight: var(--ti-common-font-weight-bold, 600); --ti-popconfirm-popover-text-color: #191919; // 标题距离内容下边距 - --ti-popconfirm-popover-margin-bottom: var(--ti-common-space-2x); + --ti-popconfirm-popover-margin-bottom: var(--ti-common-space-2x, 8px); } diff --git a/packages/theme/src/popeditor/vars.less b/packages/theme/src/popeditor/vars.less index d180f6afc2..5e325bca2a 100644 --- a/packages/theme/src/popeditor/vars.less +++ b/packages/theme/src/popeditor/vars.less @@ -12,85 +12,85 @@ .component-css-vars-popeditor() { // 弹出框标题底部边框色和输入框边框色 - --ti-popeditor-border-color: var(--ti-common-border-color-transparent-8); + --ti-popeditor-border-color: var(--ti-common-border-color-transparent-8, var(--ti-base-bg-color-transparent-8)); // 输入框左内边距 --ti-popeditor-input-padding-left: var(--ti-common-space-2x, 8px); // 输入框右侧默认图标色 - --ti-popeditor-icon-color: var(--ti-common-color-icon-active, #5e7ce0); + --ti-popeditor-icon-color: var(--ti-common-color-icon-active, #191919); // 输入框右侧禁用图标色 - --ti-popeditor-icon-color-disabled: var(--ti-common-color-placeholder, #adb0b8); + --ti-popeditor-icon-color-disabled: var(--ti-common-color-placeholder, #808080); // 输入框右侧默认图标悬浮色 - --ti-popeditor-icon-color-hover: var(--ti-common-color-primary-hover, #7693f5); + --ti-popeditor-icon-color-hover: var(--ti-common-color-primary-hover, #595959); // 输入框右侧默认图标字号 --ti-popeditor-icon-font-size: var(--ti-common-font-size-1, 14px); // 输入框右侧默认图标高度 - --ti-popeditor-icon-height: var(--ti-common-size-height-normal, 28px); + --ti-popeditor-icon-height: var(--ti-common-size-height-normal, 32px); // 输入框右侧默认图标行高 --ti-popeditor-icon-line-height: var(--ti-popeditor-icon-height); // 弹出框头部标题选中文本色和边框色 - --ti-popeditor-tabs-selected-text-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-popeditor-tabs-selected-text-color: var(--ti-common-color-line-active, #191919); // 弹出框头部标题高度 - --ti-popeditor-tabs-li-height: calc(var(--ti-common-size-8x) + 2px); + --ti-popeditor-tabs-li-height: calc(var(--ti-common-size-8x, 32px) + 2px); // 出框头部标题行高 - --ti-popeditor-tabs-li-line-height: var(--ti-common-line-height-2); + --ti-popeditor-tabs-li-line-height: var(--ti-common-line-height-2, 24px); // 出框头部标题字体大小 - --ti-popeditor-tabs-font-size: var(--ti-common-font-size-2); + --ti-popeditor-tabs-font-size: var(--ti-common-font-size-2, 16px); // 弹出框头部标题选中文本字重 - --ti-popeditor-tabs-selected-font-weight: var(--ti-common-font-weight-bold, 700); + --ti-popeditor-tabs-selected-font-weight: var(--ti-common-font-weight-bold, 600); // 弹出框查询条件item底部外边距 - --ti-popeditor-search-item-margin-bottom: var(--ti-common-space-6x); + --ti-popeditor-search-item-margin-bottom: var(--ti-common-space-6x, 24px); // 弹出框查询条件页脚顶部外边距 - --ti-popeditor-search-footer-margin-top: var(--ti-common-space-0); + --ti-popeditor-search-footer-margin-top: var(--ti-common-space-0, 0px); // 弹出框查询条件页脚底部外边距 - --ti-popeditor-search-footer-margin-bottom: var(--ti-common-space-6x); + --ti-popeditor-search-footer-margin-bottom: var(--ti-common-space-6x, 24px); // 弹出框查询条件页脚水平外边距 --ti-popeditor-search-footer-margin-horizontal: auto; // 弹出编辑头部标签页文本色(hide) - --ti-popeditor-tabs-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-popeditor-tabs-text-color: var(--ti-common-color-info-normal, #191919); // 弹出表格头部标签页item垂直内边距 --ti-popeditor-tabs-li-padding-vertical: var(--ti-common-space-0, 0px); // 弹出表格头部标签页item水平内边距 - --ti-popeditor-tabs-li-padding-horizontal: var(--ti-common-space-0); + --ti-popeditor-tabs-li-padding-horizontal: var(--ti-common-space-0, 0px); // 弹出表格头部标签页item右侧外边距 - --ti-popeditor-tabs-li-margin-right: var(--ti-common-space-8x); + --ti-popeditor-tabs-li-margin-right: var(--ti-common-space-8x, 32px); // 弹出表格(左侧）标签页内容区顶部内边距 - --ti-popeditor-tabs-body-left-padding-top: var(--ti-common-space-0); + --ti-popeditor-tabs-body-left-padding-top: var(--ti-common-space-0, 0px); // 弹出表格(左侧）标签页内容区右侧内边距 - --ti-popeditor-tabs-body-left-padding-right: var(--ti-common-space-4x); + --ti-popeditor-tabs-body-left-padding-right: var(--ti-common-space-4x, 16px); // 弹出表格(左侧）标签页内容区底部内边距 - --ti-popeditor-tabs-body-left-padding-bottom: var(--ti-common-space-0); + --ti-popeditor-tabs-body-left-padding-bottom: var(--ti-common-space-0, 0px); // 弹出表格(左侧）标签页内容区左侧内边距 - --ti-popeditor-tabs-body-left-padding-left: var(--ti-common-space-0); + --ti-popeditor-tabs-body-left-padding-left: var(--ti-common-space-0, 0px); // 弹出表格(右侧）标签页内容区顶部内边距 - --ti-popeditor-tabs-body-right-padding-top: var(--ti-common-space-0); + --ti-popeditor-tabs-body-right-padding-top: var(--ti-common-space-0, 0px); // 弹出表格(右侧）标签页内容区右侧内边距 - --ti-popeditor-tabs-body-right-padding-right: var(--ti-common-space-0); + --ti-popeditor-tabs-body-right-padding-right: var(--ti-common-space-0, 0px); // 弹出表格(右侧）标签页内容区底部内边距 - --ti-popeditor-tabs-body-right-padding-bottom: var(--ti-common-space-0); + --ti-popeditor-tabs-body-right-padding-bottom: var(--ti-common-space-0, 0px); // 弹出表格(右侧）标签页内容区左侧内边距 - --ti-popeditor-tabs-body-right-padding-left: var(--ti-common-space-4x); + --ti-popeditor-tabs-body-right-padding-left: var(--ti-common-space-4x, 16px); // 弹出表格内容顶部内边距 - --ti-popeditor-tabs-body-item-padding-top: var(--ti-common-space-4x); + --ti-popeditor-tabs-body-item-padding-top: var(--ti-common-space-4x, 16px); // 弹出表格内容水平内边距 - --ti-popeditor-tabs-body-item-padding-horizontal: var(--ti-common-space-0); + --ti-popeditor-tabs-body-item-padding-horizontal: var(--ti-common-space-0, 0px); // 弹出表格内容底部内边距 --ti-popeditor-tabs-body-item-padding-bottom: var(--ti-common-space-0, 0px); // 弹出表格标签页水平方向内边距 - --ti-popeditor-tabs-header-padding-horizontal: var(--ti-common-space-0); + --ti-popeditor-tabs-header-padding-horizontal: var(--ti-common-space-0, 0px); // 弹出表格分页顶部内边距 - --ti-popeditor-pager-padding-top: var(--ti-common-space-3x); + --ti-popeditor-pager-padding-top: var(--ti-common-space-3x, 12px); // 弹框底部对齐方式 --ti-popeditor-footer-text-align: right; // 弹框底部顶部内边距 - --ti-popeditor-footer-padding-top: var(--ti-common-space-6x); + --ti-popeditor-footer-padding-top: var(--ti-common-space-6x, 24px); // 弹出表格搜索项左侧标签文本默认宽度 --ti-popeditor-search-item-width: 80px; // 弹出表格搜索项左侧标签文本对齐方式 --ti-popeditor-search-item-text-align: left; // 弹出表格搜索项左侧标签文本右侧内边距 - --ti-popeditor-search-item-padding-right: var(--ti-common-space-4x); + --ti-popeditor-search-item-padding-right: var(--ti-common-space-4x, 16px); // 弹出表格搜索项左侧标签文本左侧内边距 - --ti-popeditor-search-item-padding-left: var(--ti-common-space-4x); + --ti-popeditor-search-item-padding-left: var(--ti-common-space-4x, 16px); // 弹出表格搜索底部按钮对齐方式 --ti-popeditor-search-footer-text-align: right; // 弹出树搜索框左侧内边距 diff --git a/packages/theme/src/popover/vars.less b/packages/theme/src/popover/vars.less index 3d9a111459..c059673a48 100644 --- a/packages/theme/src/popover/vars.less +++ b/packages/theme/src/popover/vars.less @@ -12,23 +12,23 @@ .component-css-vars-popover() { // 弹框字体 - --ti-popover-font-family: var(--ti-common-font-family); + --ti-popover-font-family: var(--ti-common-font-family, 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei'); // 弹框字重 --ti-popover-font-weight: 400; // 弹框背景色 - --ti-popover-bg-color: var(--ti-common-color-light, #fff); + --ti-popover-bg-color: var(--ti-common-color-light, #ffffff); // 弹框内容文本色 - --ti-popover-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-popover-text-color: var(--ti-common-color-text-secondary, #595959); // 弹框边框色 --ti-popover-border-color: transparent; // 弹框圆角 - --ti-popover-border-radius: var(--ti-common-border-radius-4); + --ti-popover-border-radius: var(--ti-common-border-radius-4, 8px); // 弹框内容字号 --ti-popover-font-size: 14px; // 弹框内容行高 --ti-popover-line-height: 20px; // 弹框标题文本色 - --ti-popover-title-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-popover-title-text-color: var(--ti-common-color-text-primary, #191919); // 弹框标题字号 --ti-popover-title-font-size: var(--ti-common-font-size-2, 16px); // 弹框标题字重 @@ -38,19 +38,19 @@ // 弹出框小箭头边框厚度 --ti-popover-arrow-border-width: calc(var(--ti-common-border-weight-2, 3px) * 2); // 弹出框小箭头高度 - --ti-popover-arrow-height: var(--ti-common-space-2x); + --ti-popover-arrow-height: var(--ti-common-space-2x, 8px); // 弹出框垂直外边距 --ti-popover-placement-margin-vertical: var(--ti-common-space-3x, 12px); // 弹出框小箭头水平外边距(hide) --ti-popover-placement-margin-horizontal: var(--ti-common-space-3x, 12px); // 弹框小箭头填充色 - --ti-popover-placement-arrow-after-border-color: var(--ti-common-color-light, #fff); + --ti-popover-placement-arrow-after-border-color: var(--ti-common-color-light, #ffffff); // 弹框阴影 --ti-popover-box-shadow: 0px 2px 12px 0px rgba(0,0,0,0.08); // 弹框小箭头边框色 --ti-popover-arrow-border-color: transparent; // 弹框垂直内边距 - --ti-popover-padding-vertical: var(--ti-common-space-3x); + --ti-popover-padding-vertical: var(--ti-common-space-3x, 12px); // 弹框水平内边距 - --ti-popover-padding-horizontal: var(--ti-common-space-4x); + --ti-popover-padding-horizontal: var(--ti-common-space-4x, 16px); } diff --git a/packages/theme/src/progress/vars.less b/packages/theme/src/progress/vars.less index e794652c22..868b1b0a1b 100644 --- a/packages/theme/src/progress/vars.less +++ b/packages/theme/src/progress/vars.less @@ -12,21 +12,21 @@ .component-css-vars-progress() { // 进度条默认文本色 - --ti-progress-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-progress-text-color: var(--ti-common-color-text-primary, #191919); // 进度条内层文本字号 - --ti-progress-text-font-size: var(--ti-common-font-size-base, 12px); + --ti-progress-text-font-size: var(--ti-common-font-size-base, 14px); // 横向条未完成部分背景色 --ti-progress-bar-outer-bg-color: #E6E6E6; // 横向条已完成部分背景色 - --ti-progress-bar-inner-bg-color: var(--ti-common-color-data-4); + --ti-progress-bar-inner-bg-color: var(--ti-common-color-data-4, #5cb300); // 横向条内层文本色 - --ti-progress-bar-inner-text-color: var(--ti-common-color-light, #fff); + --ti-progress-bar-inner-text-color: var(--ti-common-color-light, #ffffff); // 横向条右侧文字左外边距 - --ti-progress-bar-text-margin-left: var(--ti-common-space-3x); + --ti-progress-bar-text-margin-left: var(--ti-common-space-3x, 12px); // success状态横向条已完成部分背景色 - --ti-progress-success-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-progress-success-bg-color: var(--ti-common-color-success-normal, #5cb300); // warning状态横向条已完成部分背景色 - --ti-progress-warning-bg-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-progress-warning-bg-color: var(--ti-common-color-warning-normal, #ff8800); // exception状态横向条已完成部分背景色 --ti-progress-exception-bg-color: #c7000b; } diff --git a/packages/theme/src/rate/vars.less b/packages/theme/src/rate/vars.less index 84a9c2f017..91a661ed88 100644 --- a/packages/theme/src/rate/vars.less +++ b/packages/theme/src/rate/vars.less @@ -14,9 +14,9 @@ // 图标右侧文本左外边距 --ti-rate-text-margin-left: var(--ti-common-space-3x, 12px); // 图标右侧文本字号 - --ti-rate-text-font-size: var(--ti-common-font-size-base, 12px); + --ti-rate-text-font-size: var(--ti-common-font-size-base, 14px); // 图标下方提示文本字号 - --ti-rate-bottom-font-size: var(--ti-common-font-size-base, 12px); + --ti-rate-bottom-font-size: var(--ti-common-font-size-base, 14px); // 图标下方提示文本上外边距 --ti-rate-bottom-margin-top: var(--ti-common-space-2x, 8px); } diff --git a/packages/theme/src/rich-text-editor/vars.less b/packages/theme/src/rich-text-editor/vars.less index 641660a26b..0d543ac5f8 100644 --- a/packages/theme/src/rich-text-editor/vars.less +++ b/packages/theme/src/rich-text-editor/vars.less @@ -1,26 +1,26 @@ .component-css-vars-rich-text-editor() { // 边框色 - --ti-rich-text-editor-box-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-rich-text-editor-box-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 没用(hide) - --ti-rich-text-editor-box-outline-hover-color: var(--ti-common-color-line-hover, #575d6c); + --ti-rich-text-editor-box-outline-hover-color: var(--ti-common-color-line-hover, #191919); // 选中或悬浮头部图标色 - --ti-rich-text-editor-button-hover: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-rich-text-editor-button-hover: var(--ti-common-color-icon-hover, #191919); // 没用(hide) - --ti-rich-text-editor-button-active: var(--ti-common-color-icon-active, #5e7ce0); + --ti-rich-text-editor-button-active: var(--ti-common-color-icon-active, #191919); // 没有效果(hide) - --ti-rich-text-editor-button-disabled-text-color: var(--ti-common-color-icon-disabled, #adb0b8); + --ti-rich-text-editor-button-disabled-text-color: var(--ti-common-color-icon-disabled, #c2c2c2); // 没用(hide) - --ti-rich-text-editor-poplist-item-selected-bg-color: var(--ti-common-color-selected-background, #5e7ce0); + --ti-rich-text-editor-poplist-item-selected-bg-color: var(--ti-common-color-selected-background, #f5f5f5); // 没用(hide) - --ti-rich-text-editor-poplist-item-selected-text-color: var(--ti-common-color-selected-text-color, #fff); + --ti-rich-text-editor-poplist-item-selected-text-color: var(--ti-common-color-selected-text-color, #191919); // 头部图标弹出下拉框背景色 - --ti-rich-text-editor-options-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-rich-text-editor-options-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 头部图标弹出下拉框阴影 --ti-rich-text-editor-options-box-shadow: var(--ti-common-shadow-2-down, 0 2px 8px 0 #0003); // 头部图标弹出下拉框圆角 - --ti-rich-text-editor-options-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-rich-text-editor-options-border-radius: var(--ti-common-border-radius-normal, 6px); // 没用(hide) --ti-rich-text-editor-options-item-padding: var(--ti-common-space-6, 6px) var(--ti-common-space-5x, 20px); // 头部图标弹出下拉框选项悬浮文本色 - --ti-rich-text-editor-options-item-hover-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-rich-text-editor-options-item-hover-color: var(--ti-common-color-icon-hover, #191919); } diff --git a/packages/theme/src/roles/vars.less b/packages/theme/src/roles/vars.less index 83f14a1cff..de4ca5b51f 100644 --- a/packages/theme/src/roles/vars.less +++ b/packages/theme/src/roles/vars.less @@ -11,10 +11,10 @@ */ .component-css-vars-roles() { - --ti-roles-poplist-item-height: var(--ti-common-size-height-normal, 28px); - --ti-roles-poplist-item-text-color: var(--ti-common-color-info-normal, #252b3a); - --ti-roles-poplist-item-font-size: var(--ti-common-font-size-base, 12px); - --ti-roles-poplist-item-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); - --ti-roles-poplist-item-selected-bg-color: var(--ti-common-color-selected-background, #5e7ce0); - --ti-roles-poplist-item-selected-text-color: var(--ti-common-color-selected-text-color, #fff); + --ti-roles-poplist-item-height: var(--ti-common-size-height-normal, 32px); + --ti-roles-poplist-item-text-color: var(--ti-common-color-info-normal, #191919); + --ti-roles-poplist-item-font-size: var(--ti-common-font-size-base, 14px); + --ti-roles-poplist-item-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); + --ti-roles-poplist-item-selected-bg-color: var(--ti-common-color-selected-background, #f5f5f5); + --ti-roles-poplist-item-selected-text-color: var(--ti-common-color-selected-text-color, #191919); } diff --git a/packages/theme/src/scroll-text/vars.less b/packages/theme/src/scroll-text/vars.less index 493a1de1d1..e483f1cbb5 100644 --- a/packages/theme/src/scroll-text/vars.less +++ b/packages/theme/src/scroll-text/vars.less @@ -11,7 +11,7 @@ */ .component-css-vars-scroll-text() { - --ti-scroll-text-height: var(--ti-common-size-height-small, 32px); + --ti-scroll-text-height: var(--ti-common-size-height-small, 24px); --ti-scroll-text-bg-color: #f1f1f1; --ti-scroll-text-margin-vertical: 0; --ti-scroll-text-margin-horizontal: auto; diff --git a/packages/theme/src/scrollbar/vars.less b/packages/theme/src/scrollbar/vars.less index 0ba2a303a9..34e12e8493 100644 --- a/packages/theme/src/scrollbar/vars.less +++ b/packages/theme/src/scrollbar/vars.less @@ -28,9 +28,9 @@ // 垂直滚动条宽度 --ti-scrollbar-vertical-width: 8px; // 垂直滚动条滑块背景色 - --ti-scrollbar-thumb-bg-color: var(--ti-common-scrollbar-thumb-bg-color); + --ti-scrollbar-thumb-bg-color: var(--ti-common-scrollbar-thumb-bg-color, #dbdbdb); // 垂直滚动条滑块悬浮时背景色 - --ti-scrollbar-thumb-hover-bg-color: var(--ti-common-scrollbar-thumb-bg-color); + --ti-scrollbar-thumb-hover-bg-color: var(--ti-common-scrollbar-thumb-bg-color, #dbdbdb); // 垂直滚动条滑块圆角 - --ti-scrollbar-thumb-border-radius: var(--ti-common-scrollbar-thumb-border-radius); + --ti-scrollbar-thumb-border-radius: var(--ti-common-scrollbar-thumb-border-radius, 4px); } diff --git a/packages/theme/src/select-dropdown/vars.less b/packages/theme/src/select-dropdown/vars.less index c37eeda88e..4840402eff 100644 --- a/packages/theme/src/select-dropdown/vars.less +++ b/packages/theme/src/select-dropdown/vars.less @@ -18,24 +18,24 @@ // 选择下拉框边框的样式 --ti-select-dropdown-border-style: var(--ti-common-border-style-solid, solid); // 选择下拉框边框圆角 - --ti-select-dropdown-border-radius: var(--ti-common-border-radius-3); + --ti-select-dropdown-border-radius: var(--ti-common-border-radius-3, 6px); // 选择下拉框背景色 - --ti-select-dropdown-bg-color: var(--ti-common-color-light, #fff); + --ti-select-dropdown-bg-color: var(--ti-common-color-light, #ffffff); // 选择下拉框的阴影 - --ti-select-dropdown-box-shadow: var(--ti-common-shadow-3-down); + --ti-select-dropdown-box-shadow: var(--ti-common-shadow-3-down, 0 4px 16px 0 rgba(0, 0, 0, 0.08)); // 下拉选项水平内边距 - --ti-select-dropdown-item-padding-horizontal: var(--ti-common-space-4x); + --ti-select-dropdown-item-padding-horizontal: var(--ti-common-space-4x, 16px); // 选择下拉框的顶部外边距 - --ti-select-dropdown-margin-top: var(--ti-common-space-base); + --ti-select-dropdown-margin-top: var(--ti-common-space-base, 4px); --ti-select-dropdown-margin-bottom: 0; // 下拉面板的最大高度 --ti-select-dropdown-max-height: calc(32px * 7 + 8px); // 远程搜索数据为空时下拉框文本色（hide） - --ti-select-dropdown-empty-text-color: var(--ti-common-color-text-secondary); + --ti-select-dropdown-empty-text-color: var(--ti-common-color-text-secondary, #595959); // 下拉面板空数据提示文本字号 - --ti-select-dropdown-empty-font-size: var(--ti-common-font-size-0); + --ti-select-dropdown-empty-font-size: var(--ti-common-font-size-0, 12px); // 下拉面板空数据提示垂直内边距 - --ti-select-dropdown-empty-padding-horizontal: var(--ti-common-size-0); + --ti-select-dropdown-empty-padding-horizontal: var(--ti-common-size-0, 0px); // 下拉面板空数据提示水平内边距 --ti-select-dropdown-empty-padding-vertical: 46px; // 下拉面板空数据图片宽度 @@ -47,15 +47,15 @@ // 下拉面板空数据提示文本行高 --ti-select-dropdown-empty-line-height: var(--ti-common-line-height-number, 1.5); // 选择下拉框的顶部内边距 - --ti-select-dropdown-padding-top: var(--ti-common-space-2x); + --ti-select-dropdown-padding-top: var(--ti-common-space-2x, 8px); // 选择下拉框的水平内边距 --ti-select-dropdown-padding-horizontal: var(--ti-common-size-0, 0px); // 选择下拉框的底部内边距 - --ti-select-dropdown-padding-bottom: var(--ti-common-space-2x); + --ti-select-dropdown-padding-bottom: var(--ti-common-space-2x, 8px); // 下拉面板搜索框背景色（hide） - --ti-select-dropdown-search-bg-color: var(--ti-common-color-bg-white-normal); + --ti-select-dropdown-search-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 选择下拉框line背景色 - --ti-select-dropdown-line-bg-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-select-dropdown-line-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 选择下拉框line垂直外边距 --ti-select-dropdown-line-margin-vertical: var(--ti-common-size-0, 0px); // 选择下拉框line水平外边距 @@ -65,21 +65,21 @@ // 选择下拉框line宽度 --ti-select-dropdown-line-width: var(--ti-common-border-weight-normal, 1px); // 选择下拉框悬浮图标色 - --ti-select-dropdown-svg-hover-bg-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-select-dropdown-svg-hover-bg-color: var(--ti-common-color-primary-normal, #191919); // 下拉面板搜索框顶部外边距 --ti-select-dropdown-search-margin-top: 0; // 下拉面板搜索框底部外边距 - --ti-select-dropdown-search-margin-bottom: var(--ti-common-space-2x); + --ti-select-dropdown-search-margin-bottom: var(--ti-common-space-2x, 8px); // 下拉面板搜索框左侧外边距 - --ti-select-dropdown-search-margin-left: var(--ti-common-space-4x); + --ti-select-dropdown-search-margin-left: var(--ti-common-space-4x, 16px); // 下拉面板搜索框右侧外边距 - --ti-select-dropdown-search-margin-right: var(--ti-common-space-4x); + --ti-select-dropdown-search-margin-right: var(--ti-common-space-4x, 16px); // 下拉面板搜索框的宽度 - --ti-select-dropdown-search-width: calc(100% - var(--ti-common-space-4x) * 2); + --ti-select-dropdown-search-width: calc(100% - var(--ti-common-space-4x, 16px) * 2); // 下拉面板搜索框的边框宽度 - --ti-select-dropdown-search-border-width: var(--ti-common-border-weight-normal); + --ti-select-dropdown-search-border-width: var(--ti-common-border-weight-normal, 1px); // 下拉面板搜索框的边框圆角 - --ti-select-dropdown-search-border-radius: var(--ti-common-border-radius-0, 0px); + --ti-select-dropdown-search-border-radius: var(--ti-common-border-radius-0, 0); // 下拉面板搜索框的左边框色 --ti-select-dropdown-search-border-color-left: var(--ti-common-color-transparent, transparent); // 下拉面板搜索框的右边框色 @@ -87,7 +87,7 @@ // 下拉面板搜索框的上边框色 --ti-select-dropdown-search-border-color-top: var(--ti-common-color-transparent, transparent); // 下拉面板搜索框的底部框色 - --ti-select-dropdown-search-border-color-bottom: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-select-dropdown-search-border-color-bottom: var(--ti-common-color-line-dividing, #f0f0f0); // 下拉面板搜索框尾部图标显示状态 --ti-select-dropdown-search-suffix-display: none; // 下拉面板搜索框头部图标显示状态 @@ -95,31 +95,31 @@ // 下拉面板搜索框高度 --ti-select-dropdown-search-height: 28px; // 下拉面板搜索框右侧内边距 - --ti-select-dropdown-search-input-padding-right: var(--ti-common-space-3x); + --ti-select-dropdown-search-input-padding-right: var(--ti-common-space-3x, 12px); // 下拉面板搜索框左侧外边距 - --ti-select-dropdown-search-input-padding-left: var(--ti-common-space-5x); + --ti-select-dropdown-search-input-padding-left: var(--ti-common-space-5x, 20px); // 面板可搜索的时候空数据容器顶部内边距 - --ti-select-dropdown-search-empty-padding-top: var(--ti-common-space-3x); + --ti-select-dropdown-search-empty-padding-top: var(--ti-common-space-3x, 12px); // 面板可搜索的时候空数据容器底部内边距 - --ti-select-dropdown-search-empty-padding-bottom: var(--ti-common-space-2x); + --ti-select-dropdown-search-empty-padding-bottom: var(--ti-common-space-2x, 8px); // 滚动容器的底部外边距 - --ti-select-dropdown-wrap-padding-bottom: var(--ti-common-space-0); + --ti-select-dropdown-wrap-padding-bottom: var(--ti-common-space-0, 0px); // 下拉面板图标尺寸 - --ti-select-dropdown-icon-size: var(--ti-common-font-size-2); + --ti-select-dropdown-icon-size: var(--ti-common-font-size-2, 16px); // 下拉面板图标颜色 - --ti-select-dropdown-icon-color: var(--ti-common-color-icon-normal); + --ti-select-dropdown-icon-color: var(--ti-common-color-icon-normal, #808080); // 下拉面板新增按钮的文本色 - --ti-select-dropdown-top-create-text-color: var(--ti-common-color-text-primary); + --ti-select-dropdown-top-create-text-color: var(--ti-common-color-text-primary, #191919); // 下拉面板新增按钮的文本悬浮色 - --ti-select-dropdown-top-create-text-color-hover: var(--ti-common-color-text-link-hover); + --ti-select-dropdown-top-create-text-color-hover: var(--ti-common-color-text-link-hover, #1476ff); // 下拉面板新增按钮图标色 - --ti-select-dropdown-top-create-icon-color: var(--ti-common-color-icon-active); + --ti-select-dropdown-top-create-icon-color: var(--ti-common-color-icon-active, #191919); // 下拉面板新增按钮底部边框尺寸 - --ti-select-dropdown-top-create-border-weight-bottom: var(--ti-common-border-weight-normal); + --ti-select-dropdown-top-create-border-weight-bottom: var(--ti-common-border-weight-normal, 1px); // 下拉面板新增按钮底部边框样式 - --ti-select-dropdown-top-create-border-style-bottom: var(--ti-common-border-style-solid); + --ti-select-dropdown-top-create-border-style-bottom: var(--ti-common-border-style-solid, solid); // 下拉面板新增按钮底部边框颜色 - --ti-select-dropdown-top-create-border-color-bottom: var(--ti-common-color-line-dividing); + --ti-select-dropdown-top-create-border-color-bottom: var(--ti-common-color-line-dividing, #f0f0f0); // 下拉面板加载区域的垂直内边距 --ti-select-dropdown-loading-padding-vertical: var(--ti-common-space-6, 6px); // 下拉面板加载区域的水平内边距 diff --git a/packages/theme/src/select/vars.less b/packages/theme/src/select/vars.less index 677a22fade..22ff00338a 100644 --- a/packages/theme/src/select/vars.less +++ b/packages/theme/src/select/vars.less @@ -12,24 +12,24 @@ .component-css-vars-select() { // 输入框悬浮时的边框色(hide) - --ti-select-inner-border-color-active: var(--ti-common-color-line-active, #5e7ce0); + --ti-select-inner-border-color-active: var(--ti-common-color-line-active, #191919); // 可搜索输入框文本色 - --ti-select-input-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-select-input-text-color: var(--ti-common-color-text-primary, #191919); // 选择器输入框字号(hide) - --ti-select-input-font-size: var(--ti-common-font-size-base, 12px); + --ti-select-input-font-size: var(--ti-common-font-size-base, 14px); // 选择器输入框尾部图标的颜色 - --ti-select-input-caret-icon-color: var(--ti-common-color-icon-normal); + --ti-select-input-caret-icon-color: var(--ti-common-color-icon-normal, #808080); // 选择器输入框尾部图标悬浮时的颜色 - --ti-select-input-caret-hover-icon-color: var(--ti-common-color-icon-graybg-hover); + --ti-select-input-caret-hover-icon-color: var(--ti-common-color-icon-graybg-hover, #191919); // 选择器输入框尾部图标的尺寸 - --ti-select-input-caret-font-size: var(--ti-common-font-size-2); + --ti-select-input-caret-font-size: var(--ti-common-font-size-2, 16px); // 选择器输入框尾部关闭图标右侧外边距 --ti-select-input-icon-close-margin-right: var(--ti-common-space-0, 0px); // 选择器输入框尾部图标禁用时的颜色（hide） - --ti-select-input-disabled-caret-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-select-input-disabled-caret-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 输入框禁用且悬浮时的边框色 - --ti-select-input-disabled-hover-border-color: var(--ti-common-color-line-disabled, #dfe1e6); + --ti-select-input-disabled-hover-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 选择器输入框高度（hide） --ti-select-input-height: var(--ti-common-size-6x, 24px); // 迷你型选择器输入框高度（hide） @@ -39,41 +39,41 @@ // 中型选择器输入框高度（hide） --ti-select-input-medium-height: var(--ti-common-size-42); // 选择器多选标签容器的左侧内边距 - --ti-select-tags-wrap-padding-left: var(--ti-common-space-2); + --ti-select-tags-wrap-padding-left: var(--ti-common-space-2, 2px); // 选择器多选标签容器的顶部内边距 - --ti-select-tags-wrap-padding-top: var(--ti-common-space-2); + --ti-select-tags-wrap-padding-top: var(--ti-common-space-2, 2px); // 选择器多选标签容器的底部内边距 - --ti-select-tags-wrap-padding-bottom: var(--ti-common-space-2); + --ti-select-tags-wrap-padding-bottom: var(--ti-common-space-2, 2px); // 选择器多选标签容器的右侧内边距 --ti-select-tags-wrap-padding-right: var(--ti-common-space-0, 0px); // 选择器多选标签顶部外边距 - --ti-select-tags-margin-top: var(--ti-common-space-2); + --ti-select-tags-margin-top: var(--ti-common-space-2, 2px); // 选择器多选标签右侧外边距 - --ti-select-tags-margin-right: var(--ti-common-space-2); + --ti-select-tags-margin-right: var(--ti-common-space-2, 2px); // 选择器多选标签底部外边距 - --ti-select-tags-margin-bottom: var(--ti-common-space-2); + --ti-select-tags-margin-bottom: var(--ti-common-space-2, 2px); // 选择器多选标签左侧外边距 - --ti-select-tags-margin-left: var(--ti-common-space-2); + --ti-select-tags-margin-left: var(--ti-common-space-2, 2px); // 选择器多选标签单行的高度 - --ti-select-tags-height: var(--ti-common-space-8x); + --ti-select-tags-height: var(--ti-common-space-8x, 32px); // 选择器多选标签最大高度 --ti-select-tags-max-height: none; // 多选禁用时右侧内边距 - --ti-select-tags-padding-right-disabled: var(--ti-common-space-8x); + --ti-select-tags-padding-right-disabled: var(--ti-common-space-8x, 32px); // 多选禁用文本色 - --ti-select-tags-text-color-disabled: var(--ti-common-color-text-disabled, #adb0b8); + --ti-select-tags-text-color-disabled: var(--ti-common-color-text-disabled, #c2c2c2); // 选择器后缀图标显示状态 --ti-select-suffix-display: 'inline-block'; // 选择器右侧图标间距 --ti-select-suffix-icon-margin-right: var(--ti-common-space-base, 4px); // 选择器suffix字号 - --ti-select-suffix-font-size: var(--ti-common-font-size-base, 12px); + --ti-select-suffix-font-size: var(--ti-common-font-size-base, 14px); // 选择器suffix文本色 - --ti-select-suffix-text-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-select-suffix-text-color: var(--ti-common-color-text-weaken, #808080); // 收起按钮文本与图标色(hide) - --ti-select-collapse-button-text-icon-color: var(--ti-common-color-text-link); + --ti-select-collapse-button-text-icon-color: var(--ti-common-color-text-link, #1476ff); // 收起按钮图标左边距(hide) --ti-select-collapse-button-icon-margin-left: var(--ti-common-space-2, 2px); // 收起按钮字号(hide) - --ti-select-collapse-button-font-size: var(--ti-common-font-size-base, 12px); + --ti-select-collapse-button-font-size: var(--ti-common-font-size-base, 14px); } diff --git a/packages/theme/src/skeleton-item/vars.less b/packages/theme/src/skeleton-item/vars.less index d4a337a0f0..461e92e9eb 100644 --- a/packages/theme/src/skeleton-item/vars.less +++ b/packages/theme/src/skeleton-item/vars.less @@ -1,31 +1,31 @@ .component-css-vars-skeleton-item() { // 骨架屏元素背景设置 - --ti-skeleton-item-bg-color: var(--ti-common-color-bg-normal); + --ti-skeleton-item-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 骨架屏元素半径设置 --ti-skeleton-item-border-radius: 2px; // 图片颜色设置 - --ti-skeleton-item-image-icon-color: var(--ti-common-color-bg-normal); + --ti-skeleton-item-image-icon-color: var(--ti-common-color-bg-normal, #f5f5f5); // 方形高度设置 - --ti-skeleton-item-square-height: var(--ti-common-size-7x); + --ti-skeleton-item-square-height: var(--ti-common-size-7x, 28px); // 圆角半径设置 --ti-skeleton-item-circle-border-radius: 50%; - --ti-skeleton-item-circle-large-size: var(--ti-common-size-15x); + --ti-skeleton-item-circle-large-size: var(--ti-common-size-15x, 60px); // 圆形中尺寸设置 - --ti-skeleton-item-circle-medium-size: var(--ti-common-size-12x); + --ti-skeleton-item-circle-medium-size: var(--ti-common-size-12x, 48px); // 圆形小尺寸设置 - --ti-skeleton-item-circle-small-size: var(--ti-common-size-5x); + --ti-skeleton-item-circle-small-size: var(--ti-common-size-5x, 20px); // 小图片高度设置 - --ti-skeleton-item-image-small-size-height: var(--ti-common-size-15x); + --ti-skeleton-item-image-small-size-height: var(--ti-common-size-15x, 60px); // 小图片宽度设置 - --ti-skeleton-item-image-small-size-width: var(--ti-common-size-15x); + --ti-skeleton-item-image-small-size-width: var(--ti-common-size-15x, 60px); // 中图片高度设置 - --ti-skeleton-item-image-medium-size-height: var(--ti-common-size-25x); + --ti-skeleton-item-image-medium-size-height: var(--ti-common-size-25x, 100px); // 中图片宽度设置 - --ti-skeleton-item-image-medium-size-width: var(--ti-common-size-25x); + --ti-skeleton-item-image-medium-size-width: var(--ti-common-size-25x, 100px); // 大图片高度设置 - --ti-skeleton-item-image-large-size-height: var(--ti-common-size-50x); + --ti-skeleton-item-image-large-size-height: var(--ti-common-size-50x, 200px); // 大图片宽度设置 - --ti-skeleton-item-image-large-size-width: var(--ti-common-size-50x); + --ti-skeleton-item-image-large-size-width: var(--ti-common-size-50x, 200px); // 渐变颜色设置(hide) --ti-skeleton-item-linear-gradient: linear-gradient(to right, #fafafa, #ebebeb, #fafafa); } diff --git a/packages/theme/src/skeleton/vars.less b/packages/theme/src/skeleton/vars.less index f583875422..f1c05e8ce3 100644 --- a/packages/theme/src/skeleton/vars.less +++ b/packages/theme/src/skeleton/vars.less @@ -1,12 +1,12 @@ .component-css-vars-skeleton() { --ti-skeleton-avatar-size: var(--ti-common-size-10x, 40px); - --ti-skeleton-avatar-background-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-skeleton-avatar-background-color: var(--ti-common-color-bg-disabled, #f0f0f0); --ti-skeleton-avatar-margin-right: var(--ti-common-space-4x, 16px); --ti-skeleton-title-margin-bottom: var(--ti-common-space-4x, 16px); --ti-skeleton-title-width: 240px; --ti-skeleton-row-margin-bottom: var(--ti-common-space-3x, 12px); --ti-skeleton-last-row-width: 60%; --ti-skeleton-title-height: 48px; - --ti-skeleton-rows-margin-top: var(--ti-common-space-6x); - --ti-skeleton-rows-margin-bottom: var(--ti-common-space-6x); + --ti-skeleton-rows-margin-top: var(--ti-common-space-6x, 24px); + --ti-skeleton-rows-margin-bottom: var(--ti-common-space-6x, 24px); } diff --git a/packages/theme/src/slider/vars.less b/packages/theme/src/slider/vars.less index f56098f74e..da3b0086c4 100644 --- a/packages/theme/src/slider/vars.less +++ b/packages/theme/src/slider/vars.less @@ -12,44 +12,44 @@ .component-css-vars-slider() { // 滑块线条默认背景色 - --ti-slider-bg-color: var(--ti-common-color-bg-normal); + --ti-slider-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 滑块线条禁用背景色 - --ti-slider-bg-color-disabled: var(--ti-common-color-bg-disabled); + --ti-slider-bg-color-disabled: var(--ti-common-color-bg-disabled, #f0f0f0); // 滑块线条高度 - --ti-slider-height: var(--ti-common-space-2x); + --ti-slider-height: var(--ti-common-space-2x, 8px); // 滑块线条圆角 - --ti-slider-border-radius: var(--ti-common-border-radius-2); + --ti-slider-border-radius: var(--ti-common-border-radius-2, 4px); // 滑块进度条已完成部分的高度 - --ti-slider-range-height: var(--ti-common-space-2x); + --ti-slider-range-height: var(--ti-common-space-2x, 8px); // 横向滑块进度条圆角 - --ti-slider-range-border-radius: var(--ti-common-border-radius-2); + --ti-slider-range-border-radius: var(--ti-common-border-radius-2, 4px); // 滑块进度条背景色 - --ti-slider-range-bg-color: var(--ti-common-color-data-1); + --ti-slider-range-bg-color: var(--ti-common-color-data-1, #1476ff); // 滑块进度条悬浮背景色 - --ti-slider-range-hover-bg-color: var(--ti-common-color-data-1); + --ti-slider-range-hover-bg-color: var(--ti-common-color-data-1, #1476ff); // 滑块提示框top --ti-slider-range-top: calc(-1 * var(--ti-common-space-base)); // 滑块进度条顶部外边距 --ti-slider-range-margin-top: 0; // 滑块进度条禁用时背景色 - --ti-slider-range-disabled-bg-color: var(--ti-common-color-bg-secondary); + --ti-slider-range-disabled-bg-color: var(--ti-common-color-bg-secondary, #c2c2c2); // 滑块点宽度 - --ti-slider-handle-width: var(--ti-common-space-6x); + --ti-slider-handle-width: var(--ti-common-space-6x, 24px); // 滑块点高度 - --ti-slider-handle-height: var(--ti-common-space-6x); + --ti-slider-handle-height: var(--ti-common-space-6x, 24px); // 滑块点背景色 - --ti-slider-handle-bg-color: var(--ti-common-color-bg-white-normal); + --ti-slider-handle-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 滑块点边框色 - --ti-slider-handle-border-color: var(--ti-common-color-line-disabled); + --ti-slider-handle-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 滑块点圆角 - --ti-slider-handle-border-radius: var(--ti-common-border-radius-5); + --ti-slider-handle-border-radius: var(--ti-common-border-radius-5, 12px); // 滑块点悬浮文本色 - --ti-slider-handle-text-color-hover: var(--ti-common-color-bg-hover, #344899); + --ti-slider-handle-text-color-hover: var(--ti-common-color-bg-hover, #595959); // 滑块点悬浮边框色 - --ti-slider-handle-border-color-hover: var(--ti-common-color-data-1); + --ti-slider-handle-border-color-hover: var(--ti-common-color-data-1, #1476ff); // 滑块点阴影 --ti-slider-handle-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.08); // 滑块点top @@ -57,62 +57,62 @@ // 滑块点边框厚度 --ti-slider-handle-border-weight: var(--ti-common-border-weight-normal, 1px); // 滑块点边框悬浮厚度 - --ti-slider-handle-border-weight-hover: var(--ti-common-border-weight-1); + --ti-slider-handle-border-weight-hover: var(--ti-common-border-weight-1, 2px); // 滑块点图标的display(hide) --ti-slider-handle-icon-display: none; // 滑块点图标色 - --ti-slider-handle-icon-fill-color: var(--ti-common-color-data-1); + --ti-slider-handle-icon-fill-color: var(--ti-common-color-data-1, #1476ff); // 滑块点图标悬浮色 - --ti-slider-handle-icon-fill-color-hover: var(--ti-common-color-bg-hover, #344899); + --ti-slider-handle-icon-fill-color-hover: var(--ti-common-color-bg-hover, #595959); // 滑块点的缩放值(hide) --ti-slider-handle-transform: scale(1); // 滑块点顶部外边距 - --ti-slider-handle-margin-top: calc(var(--ti-common-space-2x) * -1); + --ti-slider-handle-margin-top: calc(var(--ti-common-space-2x, 8px) * -1); // 滑块点水平外边距 --ti-slider-handle-margin-horizontal: calc(var(--ti-common-space-2x, 8px) * -1); // 滑块点底部外边距 --ti-slider-handle-margin-bottom: var(--ti-common-space-0, 0px); // 滑块点禁用时图标颜色 - --ti-slider-handle-icon-disabled-fill-color: var(--ti-common-color-icon-disabled); + --ti-slider-handle-icon-disabled-fill-color: var(--ti-common-color-icon-disabled, #c2c2c2); // 滑块点禁用时边框颜色 - --ti-slider-handle-disabled-border-color: var(--ti-common-color-icon-disabled); + --ti-slider-handle-disabled-border-color: var(--ti-common-color-icon-disabled, #c2c2c2); // 滑块输入框高度 - --ti-slider-input-height: var(--ti-common-size-height-normal, 30px); + --ti-slider-input-height: var(--ti-common-size-height-normal, 32px); // 滑块输入框宽度 - --ti-slider-input-width: calc(var(--ti-common-space-10x) * 2); + --ti-slider-input-width: calc(var(--ti-common-space-10x, 40px) * 2); // 滑块输入框边框圆角 - --ti-slider-input-border-radius: calc(var(--ti-common-border-radius-normal, 2px) + 2px); + --ti-slider-input-border-radius: calc(var(--ti-common-border-radius-normal, 6px) + 2px); // 滑块输入框边框色 - --ti-slider-input-border-color: var(--ti-common-color-border, #d9d9d9); + --ti-slider-input-border-color: var(--ti-common-color-border, #999999); // 滑块输入框文本色 - --ti-slider-input-text-color: var(--ti-common-color-info-normal, #333); + --ti-slider-input-text-color: var(--ti-common-color-info-normal, #191919); // 滑块输入框背景色 - --ti-slider-input-bg-color: var(--ti-common-color-light, #fff); + --ti-slider-input-bg-color: var(--ti-common-color-light, #ffffff); // 滑块输入框左边外间距 - --ti-slider-input-margin-left: var(--ti-common-space-4x); + --ti-slider-input-margin-left: var(--ti-common-space-4x, 16px); // 滑块输入框单位左边padding - --ti-slider-input-unit-margin-left: var(--ti-common-space-base); + --ti-slider-input-unit-margin-left: var(--ti-common-space-base, 4px); // 滑块输入框单位文本色 - --ti-slider-input-unit-text-color: var(--ti-common-color-text-primary); + --ti-slider-input-unit-text-color: var(--ti-common-color-text-primary, #191919); // 滑块输入框单位禁用文本色 - --ti-slider-input-unit-text-color-disabled: var(--ti-common-color-text-disabled); + --ti-slider-input-unit-text-color-disabled: var(--ti-common-color-text-disabled, #c2c2c2); // 滑块输入框单位文字对齐方式(hide) --ti-slider-input-text-align: left; // 滑块刻度的宽度，竖向模式时作为滑块刻度的高度 --ti-slider-mark-point-width: calc(var(--ti-common-space-base, 4px) / 2); // 滑块刻度背景色 - --ti-slider-mark-point-bg-color: var(--ti-common-color-light, #fff); + --ti-slider-mark-point-bg-color: var(--ti-common-color-light, #ffffff); // 滑块刻度的label的顶部间距，竖向模式时作为左间距 --ti-slider-mark-label-margin-top: calc(var(--ti-common-space-base, 4px) * 2 + var(--ti-slider-height)); // 滑块活动时提示框背景色 - --ti-slider-tips-bg-color: var(--ti-common-color-bg-dark-normal, #464c59); + --ti-slider-tips-bg-color: var(--ti-common-color-bg-dark-normal, #ffffff); // 滑块活动时提示框边框色 - --ti-slider-tips-border-color: var(--ti-common-color-bg-dark-normal, #464c59); + --ti-slider-tips-border-color: var(--ti-common-color-bg-dark-normal, #ffffff); // 滑块活动时提示框文本色 - --ti-slider-tips-text-color: var(--ti-common-color-dark); + --ti-slider-tips-text-color: var(--ti-common-color-dark, #000); // 滑块活动时提示框左外边距 --ti-slider-tips-margin-left: calc(var(--ti-common-space-6, 6px) / 2); @@ -121,5 +121,5 @@ // 竖向滑块右外边距 --ti-slider-margin-right: var(--ti-common-space-0, 0px); // 竖向滑块左外边距 - --ti-slider-margin-left: calc(var(--ti-common-space-base) * -1); + --ti-slider-margin-left: calc(var(--ti-common-space-base, 4px) * -1); } diff --git a/packages/theme/src/split/vars.less b/packages/theme/src/split/vars.less index 9c74ec4c6e..37e2846f32 100644 --- a/packages/theme/src/split/vars.less +++ b/packages/theme/src/split/vars.less @@ -14,15 +14,15 @@ // 分割面板字号 --ti-split-pane-font-size: var(--ti-common-font-size-2, 16px); // 分割线背景色 - --ti-split-trigger-bg-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-split-trigger-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 分割线圆点背景色 - --ti-split-trigger-bar-bg-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-split-trigger-bar-bg-color: var(--ti-common-color-icon-normal, #808080); // 分割线悬浮背景色 --ti-split-trigger-hover-bg-color: var(--ti-split-trigger-bg-color); // 分割线圆点悬浮背景色 --ti-split-trigger-bar-hover-bg-color: var(--ti-split-trigger-bar-bg-color); // 分割线条圆点盒子背景色 - --ti-split-trigger-bar-con-bg-color: var(--ti-common-color-light, #fff); + --ti-split-trigger-bar-con-bg-color: var(--ti-common-color-light, #ffffff); // 分割线和圆点尺寸 --ti-split-trigger-size: var(--ti-common-size-base, 4px); // 水平分割线圆点左外边距 @@ -39,7 +39,7 @@ // 简易模式的按钮的边框宽度 --ti-split-trigger-button-border-width: 0; // 简易模式的按钮的边框圆角 - --ti-split-trigger-button-border-radius: var(--ti-common-border-radius-1, 4px); + --ti-split-trigger-button-border-radius: var(--ti-common-border-radius-1, 2px); // 简易模式的按钮的背景色 - --ti-split-trigger-button-bg-color: var(--ti-base-color-transparent); + --ti-split-trigger-button-bg-color: var(--ti-base-color-transparent, transparent); } diff --git a/packages/theme/src/statistic/vars.less b/packages/theme/src/statistic/vars.less index 84ebf56cc0..69e6d86efa 100644 --- a/packages/theme/src/statistic/vars.less +++ b/packages/theme/src/statistic/vars.less @@ -1,34 +1,34 @@ .component-css-vars-statistic() { // 标题字体大小 - --ti-statistic-font-size: var(--ti-common-font-size-base); + --ti-statistic-font-size: var(--ti-common-font-size-base, 14px); // 后缀字体大小 - --ti-statistic-suffix-font-size: var(--ti-common-font-size-0); + --ti-statistic-suffix-font-size: var(--ti-common-font-size-0, 12px); // 标题内容字体大小 - --ti-statistic-title-font-size: var(--ti-common-font-size-6); + --ti-statistic-title-font-size: var(--ti-common-font-size-6, 32px); // 标题字体颜色 - --ti-statistic-font-color: var(--ti-common-color-primary-normal); + --ti-statistic-font-color: var(--ti-common-color-primary-normal, #191919); // 标题字体粗细 - --ti-statistic-title-font-weight: var(--ti-common-font-weight-4); + --ti-statistic-title-font-weight: var(--ti-common-font-weight-4, normal); // 标题上间距 - --ti-statistic-title-margin-top: var(--ti-common-space-5x); + --ti-statistic-title-margin-top: var(--ti-common-space-5x, 20px); // 描述上间距 --ti-statistic-description-margin-top: -8px; // 描述下间距 - --ti-statistic-description-margin-bottom: var(--ti-common-space-6x); + --ti-statistic-description-margin-bottom: var(--ti-common-space-6x, 24px); // 标题下间距 - --ti-statistic-title-margin-bottom: var(--ti-common-space-5x); + --ti-statistic-title-margin-bottom: var(--ti-common-space-5x, 20px); // 标题行高 --ti-statistic-title-line-height: var(ti-common-line-height-4); // 前缀插槽字体粗细 - --ti-statistic-font-weight: var(--ti-common-font-weight-5); + --ti-statistic-font-weight: var(--ti-common-font-weight-5, 500); // 前缀字体粗细 - --ti-statistic-prefix-font-weight: var(--ti-common-font-weight-5); + --ti-statistic-prefix-font-weight: var(--ti-common-font-weight-5, 500); // 后缀字体粗细 - --ti-statistic-suffix-font-weight: var(--ti-common-font-weight-5); + --ti-statistic-suffix-font-weight: var(--ti-common-font-weight-5, 500); // 数字内容字体粗细 - --ti-statistic-description-font-weight: var(--ti-common-font-weight-normal); + --ti-statistic-description-font-weight: var(--ti-common-font-weight-normal, 400); // 后缀左边距 - --ti-statistic-suffix-margin-left: var(--ti-common-space-base); + --ti-statistic-suffix-margin-left: var(--ti-common-space-base, 4px); // 数字内容字体 - --ti-statistic-description-font-size: var(--ti-common-font-size-5); + --ti-statistic-description-font-size: var(--ti-common-font-size-5, 24px); } diff --git a/packages/theme/src/steps/vars.less b/packages/theme/src/steps/vars.less index 1b40880ce2..25823dd183 100644 --- a/packages/theme/src/steps/vars.less +++ b/packages/theme/src/steps/vars.less @@ -12,7 +12,7 @@ .component-css-vars-steps() { // 节点圆圈尺寸 - --ti-steps-circle-width-height: var(--ti-common-size-height-normal); + --ti-steps-circle-width-height: var(--ti-common-size-height-normal, 32px); // 序号字号 --ti-steps-number-font-size: var(--ti-common-font-size-base, 14px); // 节点内容字号 @@ -20,19 +20,19 @@ // 节点标题高度 --ti-steps-line-title-height: 42px; // 节点内容悬浮字号 - --ti-steps-font-size-hover: var(--ti-common-font-weight-bold); + --ti-steps-font-size-hover: var(--ti-common-font-weight-bold, 600); // 节点文本色 - --ti-steps-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-steps-text-color: var(--ti-common-color-text-primary, #191919); // 节点内容悬浮背景色 - --ti-steps-bg-color-hover: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-bg-color-hover: var(--ti-common-color-bg-white-normal, #ffffff); // 节点内容悬浮边框色 - --ti-steps-border-color-hover: var(--ti-common-color-line-active, #5e7ce0); + --ti-steps-border-color-hover: var(--ti-common-color-line-active, #191919); // 节点内容悬浮字体色 - --ti-steps-text-color-hover: var(--ti-common-color-text-primary); + --ti-steps-text-color-hover: var(--ti-common-color-text-primary, #191919); // 序号圆圈大小 - --ti-steps-icon-size: var(--ti-common-size-height-normal); + --ti-steps-icon-size: var(--ti-common-size-height-normal, 32px); // 序号悬浮字体色 - --ti-steps-icon-hover-text-color: var(--ti-common-color-text-primary); + --ti-steps-icon-hover-text-color: var(--ti-common-color-text-primary, #191919); // 步骤条字号(hide) --ti-steps-font-size-7: var(--ti-common-font-size-7, 36px); // 节点间横线厚度 @@ -42,159 +42,159 @@ // 节点间横线最小宽度 --ti-steps-line-min-width: var(--ti-common-space-4x, 16px); // 节点内容左边距 - --ti-steps-text-margin-left: var(--ti-common-space-2x); + --ti-steps-text-margin-left: var(--ti-common-space-2x, 8px); // 节点间横线默认长度 --ti-steps-line-width: var(--ti-common-size-16x, 64px); // 节点文本内容最大宽度 --ti-steps-content-max-width: calc(var(--ti-common-space-10, 10px) * 25); // 节点文本内容上边距 - --ti-steps-content-margin-top: var(--ti-common-space-2x); + --ti-steps-content-margin-top: var(--ti-common-space-2x, 8px); // 底部分割线厚度 --ti-steps-bottom-divider-height: var(--ti-common-space-1, 1px); // 底部分割线与主体间距 - --ti-steps-bottom-divider-margin-top: calc(var(--ti-common-space-6x) + 1px); + --ti-steps-bottom-divider-margin-top: calc(var(--ti-common-space-6x, 24px) + 1px); // 底部分割线的颜色 - --ti-steps-bottom-divider-bg-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-steps-bottom-divider-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 描述信息字号 - --ti-steps-description-font-size: var(--ti-common-font-size-base, 12px); + --ti-steps-description-font-size: var(--ti-common-font-size-base, 14px); // 描述信息字体色 - --ti-steps-description-text-color: var(--ti-common-color-text-weaken); + --ti-steps-description-text-color: var(--ti-common-color-text-weaken, #808080); // 描述信息最小宽度 --ti-steps-description-min-width: calc(var(--ti-common-space-10, 10px) * 10); // 垂直单链型节点标题上边距 - --ti-steps-vertical-title-margin-top: var(--ti-common-space-2x); + --ti-steps-vertical-title-margin-top: var(--ti-common-space-2x, 8px); // 垂直单链型节点描述上边距 --ti-steps-vertical-description-margin-top: var(--ti-common-space-2x, 8px); // 图标边框宽度 --ti-steps-icon-border-width: var(--ti-common-space-1, 1px); // 自定义图标背景色 - --ti-steps-custom-icon-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-custom-icon-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 自定义图标大小(hide) - --ti-steps-custom-icon-width-height: var(--ti-common-space-5x); + --ti-steps-custom-icon-width-height: var(--ti-common-space-5x, 20px); // 活跃节点背景色 - --ti-steps-advanced-active-bg-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-steps-advanced-active-bg-color: var(--ti-common-color-bg-emphasize, #191919); // 活跃节点悬浮背景色 - --ti-steps-done-active-bg-color-hover: var(--ti-common-color-primary-hover, #7693f5); + --ti-steps-done-active-bg-color-hover: var(--ti-common-color-primary-hover, #595959); // 活跃节点边框色 - --ti-steps-advanced-active-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-steps-advanced-active-border-color: var(--ti-common-color-line-active, #191919); // 活跃节点序号图标色 --ti-steps-line-active-icon-color: var(--ti-common-color-icon-white, #fff); // 活跃节点字重 - --ti-steps-active-font-weight: var(--ti-common-font-weight-6); + --ti-steps-active-font-weight: var(--ti-common-font-weight-6, 600); // 活跃节点内容字体色 - --ti-steps-advanced-active-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-steps-advanced-active-text-color: var(--ti-common-color-primary-normal, #191919); // 活跃节点内容描述字体色 - --ti-steps-advanced-desc-active-text-color: var(--ti-common-color-text-weaken); + --ti-steps-advanced-desc-active-text-color: var(--ti-common-color-text-weaken, #808080); // 已完成节点文本色 - --ti-steps-done-text-color: var(--ti-common-color-text-primary); + --ti-steps-done-text-color: var(--ti-common-color-text-primary, #191919); // 已完成节点线条色 - --ti-steps-line-active-bg-color: var(--ti-common-color-dash-line-normal); + --ti-steps-line-active-bg-color: var(--ti-common-color-dash-line-normal, #191919); // 已完成节点边框色 - --ti-steps-done-active-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-steps-done-active-border-color: var(--ti-common-color-line-active, #191919); // 已完成节点悬浮边框色 - --ti-steps-done-active-border-color-hover: var(--ti-common-color-primary-hover, #7693f5); + --ti-steps-done-active-border-color-hover: var(--ti-common-color-primary-hover, #595959); // 已完成节点图标(或文本)色 - --ti-steps-done-icon-color: var(--ti-common-color-text-primary); + --ti-steps-done-icon-color: var(--ti-common-color-text-primary, #191919); // 已完成节点图标大小 - --ti-steps-done-icon-size: var(--ti-common-font-size-4); + --ti-steps-done-icon-size: var(--ti-common-font-size-4, 20px); // 已完成节点背景色 - --ti-steps-done-icon-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-done-icon-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 已完成节点图标大小 --ti-steps-done-icon-size: var(--ti-common-font-size-1, 14px); // 未完成的线条色 - --ti-steps-line-bg-color: var(--ti-common-color-bg-disabled); + --ti-steps-line-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // doing状态线条色 - --ti-steps-doing-line-border-color: var(--ti-common-color-line-disabled); + --ti-steps-doing-line-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 未完成节点的背景色 - --ti-steps-icon-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-icon-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 未完成节点序号图标色 - --ti-steps-unselected-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-steps-unselected-icon-color: var(--ti-common-color-icon-normal, #808080); // 未完成节点序号悬浮图标色 - --ti-steps-unselected-hover-icon-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-steps-unselected-hover-icon-color: var(--ti-common-color-icon-hover, #191919); // 未完成节点序号悬浮名称字体色 - --ti-steps-unselected-hover-name-text-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-steps-unselected-hover-name-text-color: var(--ti-common-color-icon-hover, #191919); // 未完成节点边框色 - --ti-steps-unselected-border-color: var(--ti-common-color-line-disabled); + --ti-steps-unselected-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 未完成节点悬浮边框色 --ti-steps-unselected-hover-border-color: var(--ti-steps-unselected-hover-icon-color); // 未完成节点内容文本色 - --ti-steps-timeline-date-time-text-color: var(--ti-common-color-text-primary); + --ti-steps-timeline-date-time-text-color: var(--ti-common-color-text-primary, #191919); // 处理中节点边框色 - --ti-steps-doing-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-steps-doing-border-color: var(--ti-common-color-line-active, #191919); // 处理中节点悬浮边框色 - --ti-steps-doing-border-color-hover: var(--ti-common-color-primary-hover, #7693f5); + --ti-steps-doing-border-color-hover: var(--ti-common-color-primary-hover, #595959); // 处理中节点图标(或文本)色 - --ti-steps-doing-icon-color: var(--ti-common-color-icon-active, #5e7ce0); + --ti-steps-doing-icon-color: var(--ti-common-color-icon-active, #191919); // 处理中节点序号背景色 - --ti-steps-doing-icon-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-doing-icon-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 警告节点图标色 - --ti-steps-warning-icon-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-warning-icon-color: var(--ti-common-color-bg-white-normal, #ffffff); // 警告节点背景色(hide) - --ti-steps-warning-icon-bg-color: var(--ti-common-color-warn, #fa9841); + --ti-steps-warning-icon-bg-color: var(--ti-common-color-warn, #ff8800); // 错误节点的背景色 - --ti-steps-error-icon-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-error-icon-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 错误节点悬浮背景色 - --ti-steps-error-icon-bg-color-hover: var(--ti-common-color-error-bg, #ffeeed); + --ti-steps-error-icon-bg-color-hover: var(--ti-common-color-error-bg, #fce3e1); // 错误节点图标色 - --ti-steps-error-icon-color: var(--ti-common-color-error-text, #de504e); + --ti-steps-error-icon-color: var(--ti-common-color-error-text, #f23030); // 错误节点图标大小 - --ti-steps-error-icon-size: var(--ti-common-font-size-2); + --ti-steps-error-icon-size: var(--ti-common-font-size-2, 16px); // 错误节点边框色 - --ti-steps-error-border-color: var(--ti-common-color-error-border, #f66f6a); + --ti-steps-error-border-color: var(--ti-common-color-error-border, #f23030); // 错误节点描述文本色 - --ti-steps-error-text-color: var(--ti-common-color-error-text, #de504e); + --ti-steps-error-text-color: var(--ti-common-color-error-text, #f23030); // 禁用节点的背景色 - --ti-steps-disabled-icon-bg-color: var(--ti-common-color-bg-disabled); + --ti-steps-disabled-icon-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 禁用节点序号文本色 - --ti-steps-disabled-icon-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-steps-disabled-icon-color: var(--ti-common-color-text-disabled, #c2c2c2); // 禁用节点边框色 - --ti-steps-disabled-border-color: var(--ti-common-color-line-disabled); + --ti-steps-disabled-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 禁用节点描述文本色 - --ti-steps-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-steps-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 禁用节点名称文本色 - --ti-steps-disabled-name-text-color: var(--ti-common-color-text-disabled); + --ti-steps-disabled-name-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 禁用节点选中背景色 - --ti-steps-disabled-select-icon-bg-color: var(--ti-common-color-bg-disabled); + --ti-steps-disabled-select-icon-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 禁用节点选中序号文本色 - --ti-steps-disabled-select-icon-color: var(--ti-common-color-text-disabled); + --ti-steps-disabled-select-icon-color: var(--ti-common-color-text-disabled, #c2c2c2); // mini尺寸序号圆圈大小 --ti-steps-mini-icon-size: var(--ti-common-font-size-2, 16px); // mini尺寸序号字号 - --ti-steps-mini-number-font-size: var(--ti-common-font-size-0); + --ti-steps-mini-number-font-size: var(--ti-common-font-size-0, 12px); // mini尺寸节点内容字号 - --ti-steps-mini-font-size-base: var(--ti-common-font-size-0); + --ti-steps-mini-font-size-base: var(--ti-common-font-size-0, 12px); // small尺寸序号圆圈大小 - --ti-steps-small-icon-size: var(--ti-common-font-size-5, 16px); + --ti-steps-small-icon-size: var(--ti-common-font-size-5, 24px); // small尺寸序号字号 - --ti-steps-small-number-font-size: var(--ti-common-font-size-base, 12px); + --ti-steps-small-number-font-size: var(--ti-common-font-size-base, 14px); // 向导步骤条边框色 - --ti-steps-advanced-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-steps-advanced-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 向导步骤条未选中项文本色 - --ti-steps-advanced-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-steps-advanced-text-color: var(--ti-common-color-text-secondary, #595959); // 向导步骤条行高 --ti-steps-advanced-line-height: var(--ti-common-size-7x, 28px); // 向导步骤条边框圆角 --ti-steps-advanced-border-radius: calc(var(--ti-common-space-1, 1px) * 3); // 向导步骤条未选中项背景色 - --ti-steps-advanced-li-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-steps-advanced-li-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 向导步骤条当前项和计数标记点的文本色 - --ti-steps-advanced-li-text-color: var(--ti-common-color-text-white); + --ti-steps-advanced-li-text-color: var(--ti-common-color-text-white, #fff); // 向导步骤条节点悬浮文本色 - --ti-steps-advanced-li-hover-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-steps-advanced-li-hover-text-color: var(--ti-common-color-text-secondary, #595959); // 向导步骤条节点悬浮背景色 - --ti-steps-advanced-li-hover-bg-color: var(--ti-common-color-bg-white-emphasize, #f2f5fc); + --ti-steps-advanced-li-hover-bg-color: var(--ti-common-color-bg-white-emphasize, #f0f0f0); // 向导步骤条字号 - --ti-steps-advanced-link-font-size: var(--ti-common-font-size-0); + --ti-steps-advanced-link-font-size: var(--ti-common-font-size-0, 12px); // 向导步骤条节点里的图标高度 --ti-steps-advanced-dot-height: var(--ti-common-size-3x, 12px); // 向导步骤条节点里的图标宽度 @@ -204,89 +204,89 @@ // 向导步骤条计数标记点边框圆角 --ti-steps-advanced-count-border-radius: var(--ti-common-space-10, 10px); // 向导步骤条计数标记点字号 - --ti-steps-advanced-count-font-size: var(--ti-common-font-size-0); + --ti-steps-advanced-count-font-size: var(--ti-common-font-size-0, 12px); // 向导步骤条计数标记点高度 --ti-steps-advanced-count-height: calc(var(--ti-common-space-6, 6px) * 3); // 向导步骤条厚度(hide) --ti-steps-advanced-border-weight: calc(var(--ti-common-space-base, 4px) * 3.5); // 时间线时间字号(hide) - --ti-steps-timeline-date-time-font-size: var(--ti-common-font-size-0); + --ti-steps-timeline-date-time-font-size: var(--ti-common-font-size-0, 12px); // 向导步骤条正在处理节点背景色(hide) - --ti-steps-advanced-dot-doing-bg-color: var(--ti-common-color-warn, #fa9841); + --ti-steps-advanced-dot-doing-bg-color: var(--ti-common-color-warn, #ff8800); // 向导步骤条待处理节点背景色(hide) - --ti-steps-advanced-dot-wait-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-steps-advanced-dot-wait-bg-color: var(--ti-common-color-success-normal, #5cb300); // 向导步骤条已完成节点背景色(hide) - --ti-steps-advanced-dot-done-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-steps-advanced-dot-done-bg-color: var(--ti-common-color-success-normal, #5cb300); // 向导步骤条默认背景色 - --ti-steps-advanced-default-bg-color: var(--ti-common-color-bg-normal, #eef0f5); + --ti-steps-advanced-default-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 向导步骤条悬浮背景色 --ti-steps-advanced-bg-color-hover: #dfe1e6; // 向导步骤条已完成节点背景色 - --ti-steps-advanced-done-bg-color: var(--ti-common-color-bg-light-normal, #e9edfa); + --ti-steps-advanced-done-bg-color: var(--ti-common-color-bg-light-normal, #f0f0f0); // 向导步骤条已完成节点悬浮背景色 - --ti-steps-advanced-done-bg-color-hover: var(--ti-base-color-brand-3, #beccfa); + --ti-steps-advanced-done-bg-color-hover: var(--ti-base-color-brand-3, #7693f5); // 向导步骤条进行中节点背景色 - --ti-steps-advanced-doing-bg-color: var(--ti-common-color-bg-light-normal, #e9edfa); + --ti-steps-advanced-doing-bg-color: var(--ti-common-color-bg-light-normal, #f0f0f0); // 向导步骤条已完成节点悬浮背景色 - --ti-steps-advanced-doing-bg-color-hover: var(--ti-base-color-brand-3, #beccfa); + --ti-steps-advanced-doing-bg-color-hover: var(--ti-base-color-brand-3, #7693f5); // 向导步骤条异常节点背景色 - --ti-steps-advanced-error-bg-color: var(--ti-common-color-error-bg, #ffeeed); + --ti-steps-advanced-error-bg-color: var(--ti-common-color-error-bg, #fce3e1); // 向导步骤条异常节点悬浮背景色 - --ti-steps-advanced-error-bg-color-hover: var(--ti-common-color-error-border-secondary, #ffbcba); + --ti-steps-advanced-error-bg-color-hover: var(--ti-common-color-error-border-secondary, #fce3e1); // 向导步骤条异常节点选中背景色 --ti-steps-advanced-error-bg-color-selected: #de504e; // 向导步骤条异常节点图标色 - --ti-steps-advanced-error-icon-color: var(--ti-common-color-error-text, #de504e); + --ti-steps-advanced-error-icon-color: var(--ti-common-color-error-text, #f23030); // 向导步骤条禁用节点背景色 - --ti-steps-advanced-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f5); + --ti-steps-advanced-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 向导步骤条禁用节点悬浮背景色 - --ti-steps-advanced-disabled-bg-color-hover: var(--ti-common-color-bg-disabled, #f5f5f5); + --ti-steps-advanced-disabled-bg-color-hover: var(--ti-common-color-bg-disabled, #f0f0f0); // 向导步骤条禁用节点点击背景色 - --ti-steps-advanced-disabled-bg-color-active: var(--ti-common-color-bg-disabled, #f5f5f5); + --ti-steps-advanced-disabled-bg-color-active: var(--ti-common-color-bg-disabled, #f0f0f0); // 竖式步骤条节点左右字号 --ti-steps-timeline-name-font-size: var(--ti-common-font-size-1, 14px); // 竖式步骤条节点左侧时间预留宽度 --ti-steps-timeline-vertical-time-width: var(--ti-common-size-25x, 100px); // 竖式步骤条线条上下间距 - --ti-steps-timeline-line-margin-vertical: var(--ti-common-space-base); + --ti-steps-timeline-line-margin-vertical: var(--ti-common-space-base, 4px); // 竖式步骤条线条背景色 - --ti-steps-timeline-vertical-line-bg-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-steps-timeline-vertical-line-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 竖式步骤条线条左间距 - --ti-steps-timeline-vertical-line-margin-left: var(--ti-common-space-4x); + --ti-steps-timeline-vertical-line-margin-left: var(--ti-common-space-4x, 16px); // 竖式步骤条线条右间距 --ti-steps-timeline-vertical-line-margin-right: var(--ti-steps-timeline-vertical-line-margin-left); // 竖式步骤条圆点与内容间隔 - --ti-steps-timeline-shape-dot-content-margin-left: var(--ti-common-space-4x); + --ti-steps-timeline-shape-dot-content-margin-left: var(--ti-common-space-4x, 16px); // 竖式步骤条圆点尺寸 --ti-steps-timeline-dot-width: var(--ti-common-size-2x, 8px); // 竖式步骤条圆点边框色 - --ti-steps-timeline-dot-border-color: var(--ti-base-color-brand-5); + --ti-steps-timeline-dot-border-color: var(--ti-base-color-brand-5, #c2c2c2); // 竖式步骤条圆点背景色 - --ti-steps-timeline-dot-bg-color: var(--ti-common-color-light); + --ti-steps-timeline-dot-bg-color: var(--ti-common-color-light, #ffffff); // 竖式步骤条节点内容底部内边距 - --ti-steps-timeline-item-padding-bottom: var(--ti-common-space-6x); + --ti-steps-timeline-item-padding-bottom: var(--ti-common-space-6x, 24px); // 竖式步骤条二级文本颜色 - --ti-steps-timeline-item-secondary-text-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-steps-timeline-item-secondary-text-color: var(--ti-common-color-text-weaken, #808080); // 竖式步骤条二级文本字号 - --ti-steps-timeline-item-secondary-text-font-size: var(--ti-common-font-size-0); + --ti-steps-timeline-item-secondary-text-font-size: var(--ti-common-font-size-0, 12px); // 竖式步骤条标题与二级文本间距 --ti-steps-timeline-item-title-margin-bottom: var(--ti-common-size-base, 4px); // 基本状态圆点颜色 - --ti-steps-timeline-dot-primary-bg-color: var(--ti-base-color-brand-5); + --ti-steps-timeline-dot-primary-bg-color: var(--ti-base-color-brand-5, #c2c2c2); // 成功状态圆点颜色 - --ti-steps-timeline-dot-success-bg-color: var(--ti-common-color-success, #50d4ab); + --ti-steps-timeline-dot-success-bg-color: var(--ti-common-color-success, #5cb300); // 警告状态圆点颜色 - --ti-steps-timeline-dot-warning-bg-color: var(--ti-common-color-warn, #fa9841); + --ti-steps-timeline-dot-warning-bg-color: var(--ti-common-color-warn, #ff8800); // 危险状态圆点颜色 - --ti-steps-timeline-dot-danger-bg-color: var(--ti-common-color-error, #f66f6a); + --ti-steps-timeline-dot-danger-bg-color: var(--ti-common-color-error, #f23030); // 信息状态圆点颜色 - --ti-steps-timeline-dot-info-bg-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-steps-timeline-dot-info-bg-color: var(--ti-common-color-prompt, #1476ff); // 时间信息字体色 - --ti-steps-time-text-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-steps-time-text-color: var(--ti-common-color-text-weaken, #808080); // 时间信息字号 - --ti-steps-time-font-size: var(--ti-common-font-size-base, 12px); + --ti-steps-time-font-size: var(--ti-common-font-size-base, 14px); // 时间信息下边距 --ti-steps-time-margin-bottom: var(--ti-common-space-6, 6px); } diff --git a/packages/theme/src/table/vars.less b/packages/theme/src/table/vars.less index 8dcb005691..01d1ff0a7b 100644 --- a/packages/theme/src/table/vars.less +++ b/packages/theme/src/table/vars.less @@ -11,17 +11,17 @@ */ .component-css-vars-table() { - --ti-table-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-table-text-color: var(--ti-common-color-info-normal, #191919); --ti-table-bg-color: #fafafa; - --ti-table-odd-bg-color: var(--ti-common-color-light, #fff); - --ti-table-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); - --ti-table-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-table-odd-bg-color: var(--ti-common-color-light, #ffffff); + --ti-table-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); + --ti-table-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); --ti-table-disabled-bg-color: #f1f1f1; --ti-table-nodata-text-color: #909399; --ti-table-td-height: var(--ti-common-size-height-medium, 40px); - --ti-table-td-font-size: var(--ti-common-font-size-base, 12px); - --ti-table-border-color: var(--ti-common-color-border, #adb0b8); - --ti-table-thead-bg-color: var(--ti-base-color-brand-1, #f2f5fc); + --ti-table-td-font-size: var(--ti-common-font-size-base, 14px); + --ti-table-border-color: var(--ti-common-color-border, #999999); + --ti-table-thead-bg-color: var(--ti-base-color-brand-1, #595959); --ti-table-icon-font-size: var(--ti-common-font-size-2, 16px); - --ti-table-check-icon-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-table-check-icon-color: var(--ti-base-color-brand-6, #191919); } diff --git a/packages/theme/src/tabs/vars.less b/packages/theme/src/tabs/vars.less index e186c48627..7f53f75f0c 100644 --- a/packages/theme/src/tabs/vars.less +++ b/packages/theme/src/tabs/vars.less @@ -12,41 +12,41 @@ .component-css-vars-tabs() { // 标签栏选中项边框色(除bordercard类) - --ti-tabs-header-font-active-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-tabs-header-font-active-border-color: var(--ti-common-color-line-active, #191919); // 标签栏选中项字重 - --ti-tabs-header-font-weight-active: var(--ti-common-font-weight-bold); + --ti-tabs-header-font-weight-active: var(--ti-common-font-weight-bold, 600); // 标签栏(选中|悬浮)项文本色(除bordercard类) - --ti-tabs-header-font-active-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-tabs-header-font-active-text-color: var(--ti-common-color-primary-normal, #191919); // 标签栏(更多选项|加号按钮)悬浮文本色 - --ti-tabs-header-text-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-tabs-header-text-color: var(--ti-common-color-primary-normal, #191919); // 标签栏边框色 - --ti-tabs-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-tabs-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 标签栏新增按钮高度 --ti-tabs-new-height: calc(var(--ti-common-space-base, 4px) * 4.5); // 标签栏新增按钮宽度 --ti-tabs-new-width: calc(var(--ti-common-space-base, 4px) * 4.5); // 标签栏新增按钮填充色 - --ti-tabs-new-svg-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-tabs-new-svg-text-color: var(--ti-common-color-placeholder, #808080); // 标签栏更多文字悬浮文本色 - --ti-tabs-more-hover-text-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-tabs-more-hover-text-color: var(--ti-common-color-primary-hover, #595959); // 标签页选项禁用色 - --ti-tabs-item-disabled-text-color: var(--ti-common-color-text-link-darkbg-hover, #beccfa); + --ti-tabs-item-disabled-text-color: var(--ti-common-color-text-link-darkbg-hover, #c2c2c2); // 标签页新增按钮圆角 - --ti-tabs-new-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-tabs-new-border-radius: var(--ti-common-border-radius-normal, 6px); // 标签页下拉框背景色(hide) - --ti-tabs-dropdown-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-tabs-dropdown-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 标签页下拉框圆角(hide) - --ti-tabs-dropdown-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-tabs-dropdown-border-radius: var(--ti-common-border-radius-normal, 6px); // 标签页下拉选项文本色(hide) - --ti-tabs-dropdown-li-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-tabs-dropdown-li-text-color: var(--ti-common-color-info-normal, #191919); // 标签页内容字号 --ti-tabs-content-font-size: var(--ti-common-font-size-2, 16px); // card类型(无size属性)标签项高度 - --ti-tabs-height: var(--ti-common-size-12x); + --ti-tabs-height: var(--ti-common-size-12x, 48px); // card类型未选中项文本色 - --ti-tabs-header-font-normal-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-tabs-header-font-normal-text-color: var(--ti-common-color-text-primary, #191919); // 分隔符类型未选中项文本色 - --ti-tabs-header-separator-normal-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-tabs-header-separator-normal-text-color: var(--ti-common-color-text-secondary, #595959); // 分隔符高度(new) --ti-tabs-header-separator-height: var(--ti-common-space-4x, 16px); // 分隔符类型标签项水平内边距 @@ -54,11 +54,11 @@ // 分隔符类型标签项高度 --ti-tabs-header-separator-item-height: var(--ti-common-space-8x, 32px); // 分隔符背景色 - --ti-tabs-header-separator-bg-color: var(--ti-common-scrollbar-thumb-bg-color, #bfbfbf); + --ti-tabs-header-separator-bg-color: var(--ti-common-scrollbar-thumb-bg-color, #dbdbdb); // card类型选中项下边框色(hide) --ti-tabs-dropdown-li-border-color: #e6e6e6; // card类型选中项顶部块背景色 - --ti-tabs-header-top-bar-active-bg-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-tabs-header-top-bar-active-bg-color: var(--ti-common-color-line-active, #191919); // card类型small尺寸标签栏高度 --ti-tabs-small-height: var(--ti-common-size-10x, 40px); // 分隔符类型small尺寸标签栏高度 @@ -72,36 +72,36 @@ // card类型small尺寸标签项水平内边距(new) --ti-tabs-small-separator-padding-horizontal: var(--ti-common-size-3x, 12px); // card类型small尺寸标签项字号(new) - --ti-tabs-small-item-font-size: var(--ti-common-font-size-2); + --ti-tabs-small-item-font-size: var(--ti-common-font-size-2, 16px); // card类型标签项水平内边距 --ti-tabs-item-padding-horizontal: var(--ti-common-space-3x, 12px); // card类型选中项底部小滑块厚度(hide) --ti-tabs-item-bottom-border-weight: var(--ti-common-border-weight-normal, 1px); // card类型选中项底部边框色 - --ti-tabs-item-bottom-border-color: var(--ti-common-color-light, #fff); + --ti-tabs-item-bottom-border-color: var(--ti-common-color-light, #ffffff); // card类型选中项(不含下|左)边框厚度 --ti-tabs-item-top-right-border-weight: var(--ti-common-border-weight-normal, 1px); // card类型选中项背景色 - --ti-tabs-item-card-active-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-tabs-item-card-active-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // card类型选中项圆角 - --ti-tabs-item-card-border-radius: var(--ti-common-border-radius-0, 0px); + --ti-tabs-item-card-border-radius: var(--ti-common-border-radius-0, 0); // card类型标签项默认上|右边框色 --ti-tabs-item-card-border-color: var(--ti-common-color-transparent, transparent); // card类型标签项悬浮字重 - --ti-tabs-item-card-hover-font-weight: var(--ti-common-font-weight-bold); + --ti-tabs-item-card-hover-font-weight: var(--ti-common-font-weight-bold, 600); // bordercard类型选中项圆角 - --ti-tabs-dark-border-radius: var(--ti-common-border-radius-normal, 2px) var(--ti-common-border-radius-normal, 2px) 0 + --ti-tabs-dark-border-radius: var(--ti-common-border-radius-normal, 6px) var(--ti-common-border-radius-normal, 6px) 0 0; // bordercard类型选中项文本色 - --ti-tabs-dark-text-color-active: var(--ti-common-color-text-primary, #252b3a); + --ti-tabs-dark-text-color-active: var(--ti-common-color-text-primary, #191919); // bordercard类型选中项背景色 - --ti-tabs-dark-bg-color-active: var(--ti-common-color-bg-normal, #eef0f5); + --ti-tabs-dark-bg-color-active: var(--ti-common-color-bg-normal, #f5f5f5); // bordercard类型非选中项悬浮文本色 --ti-tabs-dark-text-color-hover: var(--ti-common-color-text-white, #fff); // bordercard类型非选中项悬浮背景色 - --ti-tabs-dark-bg-color-hover: var(--ti-common-color-icon-graybg-hover); + --ti-tabs-dark-bg-color-hover: var(--ti-common-color-icon-graybg-hover, #191919); // bordercard类型非选中项文本色 - --ti-tabs-dark-text-color: var(--ti-common-color-text-darkbg, #adb0b8); + --ti-tabs-dark-text-color: var(--ti-common-color-text-darkbg, #c2c2c2); // bordercard类型标签项上外边距 --ti-tabs-dark-margin-top: calc(var(--ti-common-space-base, 4px) + 1px); // bordercard类型首个标签项左外边距 @@ -109,37 +109,37 @@ // bordercard类型标签栏边框厚度 --ti-tabs-dark-border-weight: var(--ti-common-size-0, 0px); // bordercard类型默认背景色 - --ti-tabs-header-dark-bg-color: var(--ti-common-color-bg-dark-normal, #464c59); + --ti-tabs-header-dark-bg-color: var(--ti-common-color-bg-dark-normal, #ffffff); // bordercard类型标签项高度 - --ti-tabs-dark-item-height: calc(var(--ti-common-size-base) * 11.75); + --ti-tabs-dark-item-height: calc(var(--ti-common-size-base, 4px) * 11.75); // 标签项超出时上下按钮尺寸[3.9.1新增] - --ti-tabs-prev-next-btn-icon-size: var(--ti-common-font-size-base, 12px); + --ti-tabs-prev-next-btn-icon-size: var(--ti-common-font-size-base, 14px); // 标签项默认右外边距 - --ti-tabs-item-margin-right: var(--ti-common-space-8x); + --ti-tabs-item-margin-right: var(--ti-common-space-8x, 32px); // 标签项active边框样式(hide) --ti-tabs-item-active-border-style: var(--ti-common-border-style-solid, solid); // 标签项底部边框样式(hide) --ti-tabs-item-bottom-border-style: var(--ti-common-border-style-solid, solid); // 横向标签栏字号 - --ti-tabs-item-font-size: var(--ti-common-font-size-2); + --ti-tabs-item-font-size: var(--ti-common-font-size-2, 16px); // 纵向标签栏非选中项背景色 - --ti-tabs-header-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-tabs-header-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 纵向标签栏字号 - --ti-tabs-font-size-base: var(--ti-common-font-size-base, 12px); + --ti-tabs-font-size-base: var(--ti-common-font-size-base, 14px); // 竖向标签项水平内边距 --ti-tabs-item-vertical-padding-horizontal: var(--ti-common-space-5x, 20px); // 选中标签项小滑块厚度(不含card类型) - --ti-tabs-item-active-border-weight: var(--ti-common-border-weight-1); + --ti-tabs-item-active-border-weight: var(--ti-common-border-weight-1, 2px); // 选中标签项小滑块边框色 --ti-tabs-item-active-border-color: var(--ti-tabs-header-font-active-border-color); // 可关闭项关闭按钮悬浮背景色 - --ti-tabs-icon-close-hover-bg-color: var(--ti-common-bg-minor-hover, #ffffff); + --ti-tabs-icon-close-hover-bg-color: var(--ti-common-bg-minor-hover, #f0f0f0); // 可关闭项关闭图标默认背景色 --ti-tabs-icon-close-default-bg-color: var(--ti-common-color-transparent, transparent); // 可关闭项未选中项的关闭图标色 - --ti-tabs-icon-close-default-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-tabs-icon-close-default-text-color: var(--ti-common-color-text-primary, #191919); // 可关闭项(选中项|未选中项悬浮)图标色 - --ti-tabs-icon-close-hover-text-color: var(--ti-common-color-icon-active, #5e7ce0); + --ti-tabs-icon-close-hover-text-color: var(--ti-common-color-icon-active, #191919); // 可关闭项关闭图标尺寸 --ti-tabs-icon-size-close: var(--ti-common-font-size-1, 14px); // 可关闭项关闭图标垂直外边距(hide) @@ -149,25 +149,25 @@ // 可关闭项左外边距 --ti-tabs-icon-close-margin-left: 5px; // 更多下拉框上外边距 - --ti-tabs-dropdown-more-margin-top: var(--ti-common-space-base); + --ti-tabs-dropdown-more-margin-top: var(--ti-common-space-base, 4px); // 更多下拉框项悬浮背景色 - --ti-tabs-dropdown-more-item-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-tabs-dropdown-more-item-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); // 更多下拉框项悬浮字重 --ti-tabs-dropdown-more-item-hover-font-weight: var(--ti-common-font-weight-5, 500); // 头部更多按钮水平内边距 --ti-tabs-more-icon-padding-horizontal: 13.5px; // 头部更多图标盒子高度 - --ti-tabs-more-icon-height: calc(var(--ti-common-space-base) * 13); + --ti-tabs-more-icon-height: calc(var(--ti-common-space-base, 4px) * 13); // 头部更多图标尺寸[3.9.1新增] --ti-tabs-more-icon-size: var(--ti-common-font-size-2, 16px); // 头部更多按钮左侧盒子阴影高度 - --ti-tabs-more-left-box-height: calc(var(--ti-common-size-base) * 13); + --ti-tabs-more-left-box-height: calc(var(--ti-common-size-base, 4px) * 13); // 头部更多按钮左侧盒子阴影 --ti-tabs-more-left-box-shadow: -3px 0px 4px 0px rgba(0, 0, 0, 0.08); // 内容垂直外边距 - --ti-tabs-content-margin-vertical: var(--ti-common-space-3x); + --ti-tabs-content-margin-vertical: var(--ti-common-space-3x, 12px); // 内容水平外边距 - --ti-tabs-content-margin-horizontal: var(--ti-common-space-0); + --ti-tabs-content-margin-horizontal: var(--ti-common-space-0, 0px); // buttoncard类型标签栏背景色 --ti-tabs-button-card-nav-bg-color: var(--ti-common-color-bg-6, rgba(0, 0, 0, 0.05)); // buttoncard类型选项文本色 @@ -179,13 +179,13 @@ // buttoncard类型选项高度 --ti-tabs-button-card-item-height: var(--ti-common-size-8x, 32px); // buttoncard类型选中项背景色 - --ti-tabs-button-card-item-active-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-tabs-button-card-item-active-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // buttoncard类型选中项文本色 --ti-tabs-button-card-item-active-text-color: #191919; // buttoncard类型选中项边框色 --ti-tabs-button-card-item-active-border-color: #191919; // buttoncard类型圆角 - --ti-tabs-button-card-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-tabs-button-card-border-radius: var(--ti-common-border-radius-normal, 6px); // buttoncard类型选项水平内边距 --ti-tabs-button-card-title-padding-horizontal: var(--ti-common-space-6x, 24px); // buttoncard类型字重 diff --git a/packages/theme/src/tag-group/vars.less b/packages/theme/src/tag-group/vars.less index dda016c5c9..5402a5c002 100644 --- a/packages/theme/src/tag-group/vars.less +++ b/packages/theme/src/tag-group/vars.less @@ -14,5 +14,5 @@ // 标签组右内边距 --ti-tag-group-padding-right: var(--ti-common-space-8x, 32px); // 标签组省略图标色 - --ti-tag-group-ellipsis-icon-color: var(--ti-common-color-primary-normal, #5e7ce0); + --ti-tag-group-ellipsis-icon-color: var(--ti-common-color-primary-normal, #191919); } diff --git a/packages/theme/src/tag/vars.less b/packages/theme/src/tag/vars.less index 83940b3021..7bb8e7631d 100644 --- a/packages/theme/src/tag/vars.less +++ b/packages/theme/src/tag/vars.less @@ -12,101 +12,101 @@ .component-css-vars-tag() { // 标签默认高度 - --ti-tag-height: var(--ti-common-line-height-2); + --ti-tag-height: var(--ti-common-line-height-2, 24px); // 中等标签高度 - --ti-tag-medium-height: var(--ti-common-size-height-normal); + --ti-tag-medium-height: var(--ti-common-size-height-normal, 32px); // 中等标签水平内边距 - --ti-tag-medium-padding-horizontal: var(--ti-common-space-3x); + --ti-tag-medium-padding-horizontal: var(--ti-common-space-3x, 12px); // 中型标签圆角 - --ti-tag-medium-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-tag-medium-border-radius: var(--ti-common-border-radius-normal, 6px); // 小型标签高度 - --ti-tag-small-height: var(--ti-common-line-height-base); + --ti-tag-small-height: var(--ti-common-line-height-base, 18px); // 小型标签水平内边距 - --ti-tag-small-padding-horizontal: var(--ti-common-space-base); + --ti-tag-small-padding-horizontal: var(--ti-common-space-base, 4px); // 超小标签高度 - --ti-tag-mini-height: var(--ti-common-size-3x); + --ti-tag-mini-height: var(--ti-common-size-3x, 12px); // 标签边框厚度 --ti-tag-border-weight: 0; // 标签圆角 - --ti-tag-border-radius: var(--ti-common-border-radius-2); + --ti-tag-border-radius: var(--ti-common-border-radius-2, 4px); // 小型|超小标签圆角 - --ti-tag-small-border-radius: var(--ti-common-border-radius-1); + --ti-tag-small-border-radius: var(--ti-common-border-radius-1, 2px); // 标签默认字号 - --ti-tag-font-size: var(--ti-common-font-size-1); + --ti-tag-font-size: var(--ti-common-font-size-1, 14px); // 标签关闭按钮字号 - --ti-tag-close-font-size: var(--ti-common-font-size-2); + --ti-tag-close-font-size: var(--ti-common-font-size-2, 16px); // 标签关闭按钮默认左外边距 - --ti-tag-close-margin-left: var(--ti-common-space-base); + --ti-tag-close-margin-left: var(--ti-common-space-base, 4px); // 标签关闭按钮默认右外边距 - --ti-tag-close-margin-right: calc(var(--ti-common-space-base) * -1); + --ti-tag-close-margin-right: calc(var(--ti-common-space-base, 4px) * -1); // 中型标签关闭按钮左外边距 - --ti-tag-close-medium-margin-left: var(--ti-common-space-2x); + --ti-tag-close-medium-margin-left: var(--ti-common-space-2x, 8px); // 中等标签关闭按钮右外边距 - --ti-tag-close-medium-margin-right: calc(var(--ti-common-space-base) * -1); + --ti-tag-close-medium-margin-right: calc(var(--ti-common-space-base, 4px) * -1); // (小型|超小)标签关闭按钮左外边距 - --ti-tag-close-small-margin-left: var(--ti-common-space-2); + --ti-tag-close-small-margin-left: var(--ti-common-space-2, 2px); // (小型|超小)标签关闭按钮右外边距 - --ti-tag-close-small-margin-right: calc(var(--ti-common-space-2) * -1); + --ti-tag-close-small-margin-right: calc(var(--ti-common-space-2, 2px) * -1); // light主题标签默认文本色 - --ti-tag-primary-text-color: var(--ti-common-color-primary-normal); + --ti-tag-primary-text-color: var(--ti-common-color-primary-normal, #191919); // light主题标签默认关闭图标色 - --ti-tag-primary-close-icon-color: var(--ti-common-color-icon-normal); + --ti-tag-primary-close-icon-color: var(--ti-common-color-icon-normal, #808080); // light主题标签默认关闭图标悬浮色 - --ti-tag-primary-close-hover-icon-color: var(--ti-common-color-icon-hover); + --ti-tag-primary-close-hover-icon-color: var(--ti-common-color-icon-hover, #191919); // light主题标签默认关闭按钮透明度(hide) --ti-tag-primary-close-opacity: 1; // light主题标签默认边框色 - --ti-tag-primary-border-color: var(--ti-common-color-bg-normal, #eef0f5); + --ti-tag-primary-border-color: var(--ti-common-color-bg-normal, #f5f5f5); // light主题标签默认背景色 - --ti-tag-primary-background-color: var(--ti-common-color-bg-6); + --ti-tag-primary-background-color: var(--ti-common-color-bg-6, #f5f5f5); // light主题警告类标签(文本|边框)色 - --ti-tag-warning-text-color: var(--ti-common-color-warn-text, #e37d29); + --ti-tag-warning-text-color: var(--ti-common-color-warn-text, #ff8800); // light主题警告类标签边框色 - --ti-tag-warning-border-color: var(--ti-common-color-warn-border, #ffd0a6); + --ti-tag-warning-border-color: var(--ti-common-color-warn-border, #ffebd1); // light主题警告类标签背景色 - --ti-tag-warning-background-color: var(--ti-common-color-warn-bg, #fff3e8); + --ti-tag-warning-background-color: var(--ti-common-color-warn-bg, #ffebd1); // light主题危险类标签(文本|边框)色 - --ti-tag-danger-text-color: var(--ti-common-color-error-text, #de504e); + --ti-tag-danger-text-color: var(--ti-common-color-error-text, #f23030); // light主题危险类标签边框色 - --ti-tag-danger-border-color: var(--ti-common-color-error-border-secondary, #ffbcba); + --ti-tag-danger-border-color: var(--ti-common-color-error-border-secondary, #fce3e1); // (dark|light)主题危险类标签背景色 - --ti-tag-danger-background-color: var(--ti-common-color-error-bg, #ffeeed); + --ti-tag-danger-background-color: var(--ti-common-color-error-bg, #fce3e1); // light主题成功类标签(文本|边框)色 - --ti-tag-success-text-color: var(--ti-common-color-text-success, #3ac295); + --ti-tag-success-text-color: var(--ti-common-color-text-success, #5cb300); // light主题成功类标签边框色 - --ti-tag-success-border-color: var(--ti-common-color-success-border, #acf2dc); + --ti-tag-success-border-color: var(--ti-common-color-success-border, #e6f2d5); // light主题成功类标签背景色 - --ti-tag-success-background-color: var(--ti-common-color-success-bg, #edfff9); + --ti-tag-success-background-color: var(--ti-common-color-success-bg, #e6f2d5); // light主题信息类标签(文本|边框)色 - --ti-tag-info-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-tag-info-text-color: var(--ti-common-color-text-primary, #191919); // light主题信息类标签边框色 --ti-tag-info-border-color: var(--ti-common-color-info-border, #d3d4d6); // light主题信息类标签背景色 - --ti-tag-info-background-color: var(--ti-common-color-bg-light-normal); + --ti-tag-info-background-color: var(--ti-common-color-bg-light-normal, #f0f0f0); // dark主题标签默认文本色 - --ti-tag-dark-text-color: var(--ti-common-color-light, #fff); + --ti-tag-dark-text-color: var(--ti-common-color-light, #ffffff); // dark主题标签默认(背景|边框)色 - --ti-tag-dark-bg-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-tag-dark-bg-color: var(--ti-common-color-prompt, #1476ff); // dark主题成功类标签(背景|边框)色 - --ti-tag-dark-success-bg-color: var(--ti-common-color-success, #50d4ab); + --ti-tag-dark-success-bg-color: var(--ti-common-color-success, #5cb300); // dark主题警告类标签(背景|边框)色 - --ti-tag-dark-warning-bg-color: var(--ti-common-color-warn, #fa9841); + --ti-tag-dark-warning-bg-color: var(--ti-common-color-warn, #ff8800); // dark主题危险类标签背景色 - --ti-tag-dark-danger-bg-color: var(--ti-common-color-error, #f66f6a); + --ti-tag-dark-danger-bg-color: var(--ti-common-color-error, #f23030); // dark主题信息类标签(背景|边框)色 --ti-tag-dark-info-bg-color: var(--ti-common-color-info, #252b3a); // plain主题标签默认文本色 - --ti-tag-plain-text-color: var(--ti-common-color-prompt, #5e7ce0); + --ti-tag-plain-text-color: var(--ti-common-color-prompt, #1476ff); // plain主题标签默认边框色 - --ti-tag-plain-border-color: var(--ti-common-color-prompt-border, #beccfa); + --ti-tag-plain-border-color: var(--ti-common-color-prompt-border, #deecff); // plain主题标签默认背景色 - --ti-tag-plain-background-color: var(--ti-common-color-light, #fff); + --ti-tag-plain-background-color: var(--ti-common-color-light, #ffffff); // plain主题信息类标签文本色 --ti-tag-plain-info-text-color: var(--ti-common-color-info, #252b3a); @@ -114,36 +114,36 @@ --ti-tag-plain-info-border-color: var(--ti-common-color-info-border, #d3d4d6); // plain主题成功类标签文本色 - --ti-tag-plain-success-text-color: var(--ti-common-color-success, #50d4ab); + --ti-tag-plain-success-text-color: var(--ti-common-color-success, #5cb300); // plain主题成功类标签边框色 - --ti-tag-plain-success-border-color: var(--ti-common-color-success-border, #acf2dc); + --ti-tag-plain-success-border-color: var(--ti-common-color-success-border, #e6f2d5); // plain主题警告类标签文本色 - --ti-tag-plain-warning-text-color: var(--ti-common-color-warn, #fa9841); + --ti-tag-plain-warning-text-color: var(--ti-common-color-warn, #ff8800); // plain主题警告类标签边框色 - --ti-tag-plain-warning-border-color: var(--ti-common-color-warn-border, #ffd0a6); + --ti-tag-plain-warning-border-color: var(--ti-common-color-warn-border, #ffebd1); // plain主题危险类标签文本色 - --ti-tag-plain-danger-text-color: var(--ti-common-color-error, #f66f6a); + --ti-tag-plain-danger-text-color: var(--ti-common-color-error, #f23030); // plain主题危险类标签边框色 - --ti-tag-plain-danger-border-color: var(--ti-common-color-error-border-secondary, #ffbcba); + --ti-tag-plain-danger-border-color: var(--ti-common-color-error-border-secondary, #fce3e1); // red标签文本色 - --ti-tag-red-text-color: var(--ti-common-color-error-text); + --ti-tag-red-text-color: var(--ti-common-color-error-text, #f23030); // red标签背景色 --ti-tag-red-bg-color: #fce3e0; // orange标签文本色 --ti-tag-orange-text-color: #d96900; // orange标签背景色 - --ti-tag-orange-bg-color: var(--ti-common-color-warn-bg); + --ti-tag-orange-bg-color: var(--ti-common-color-warn-bg, #ffebd1); // green标签文本色 --ti-tag-green-text-color: #029931; // green标签背景色 --ti-tag-green-bg-color: #d5f2dc; // blue标签文本色 - --ti-tag-blue-text-color: var(--ti-common-color-text-link); + --ti-tag-blue-text-color: var(--ti-common-color-text-link, #1476ff); // blue标签背景色 - --ti-tag-blue-bg-color: var(--ti-common-color-prompt-bg); + --ti-tag-blue-bg-color: var(--ti-common-color-prompt-bg, #deecff); // purple标签文本色 --ti-tag-purple-text-color: #832fd6; // purple标签背景色 @@ -151,11 +151,11 @@ // brown标签文本色 --ti-tag-brown-text-color: #a64d00; // brown标签背景色 - --ti-tag-brown-bg-color: var(--ti-common-color-warn-bg); + --ti-tag-brown-bg-color: var(--ti-common-color-warn-bg, #ffebd1); // grey标签文本色 - --ti-tag-grey-text-color: var(--ti-common-color-text-gray); + --ti-tag-grey-text-color: var(--ti-common-color-text-gray, #191919); // grey标签背景色 --ti-tag-grey-bg-color: #e6e6e6; // 禁用背景色 - --ti-tag-disabled-background-color: var(--ti-common-color-bg-disabled); + --ti-tag-disabled-background-color: var(--ti-common-color-bg-disabled, #f0f0f0); } diff --git a/packages/theme/src/tall-storage/vars.less b/packages/theme/src/tall-storage/vars.less index d8fa2565f9..997c20dcbe 100644 --- a/packages/theme/src/tall-storage/vars.less +++ b/packages/theme/src/tall-storage/vars.less @@ -11,8 +11,8 @@ */ .component-css-vars-tall-storage() { - --ti-tall-storage-bg-color: var(--ti-common-color-light, #fff); - --ti-tall-storage-border-radius: var(--ti-common-border-radius-normal, 2px); - --ti-tall-storage-item-height: var(--ti-common-size-height-normal, 28px); - --ti-tall-storage-item-bg-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-tall-storage-bg-color: var(--ti-common-color-light, #ffffff); + --ti-tall-storage-border-radius: var(--ti-common-border-radius-normal, 6px); + --ti-tall-storage-item-height: var(--ti-common-size-height-normal, 32px); + --ti-tall-storage-item-bg-color: var(--ti-common-color-hover-background, #f5f5f5); } diff --git a/packages/theme/src/text-popup/vars.less b/packages/theme/src/text-popup/vars.less index ada2e51351..ab31e794ef 100644 --- a/packages/theme/src/text-popup/vars.less +++ b/packages/theme/src/text-popup/vars.less @@ -12,23 +12,23 @@ .component-css-vars-text-popup() { // 输入框圆角 - --ti-text-popup-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-text-popup-border-radius: var(--ti-common-border-radius-normal, 6px); // 输入框高度 --ti-text-popup-height: 32px; // 输入框字号 - --ti-text-popup-font-size: var(--ti-common-font-size-1); + --ti-text-popup-font-size: var(--ti-common-font-size-1, 14px); // 输入框字族 --ti-text-popup-font-family: var(--ti-common-font-family, 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei'); // 输入框边框色 - --ti-text-popup-border-color: var(--ti-common-color-line-normal); + --ti-text-popup-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 输入框聚焦展开时阴影 --ti-text-popup-box-shadow: 0 0 1px 1px rgba(175, 175, 175, 0.3); // 输入框悬浮边框色 - --ti-text-popup-hover-border-color: var(--ti-common-color-line-hover, #575d6c); + --ti-text-popup-hover-border-color: var(--ti-common-color-line-hover, #191919); //输入框聚焦边框色 - --ti-text-popup-focus-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-text-popup-focus-border-color: var(--ti-common-color-line-active, #191919); // 输入框垂直内边距 --ti-text-popup-padding-vertical: 5px; // 输入框水平内边距 - --ti-text-popup-padding-horizontal: var(--ti-common-space-3x); + --ti-text-popup-padding-horizontal: var(--ti-common-space-3x, 12px); } diff --git a/packages/theme/src/textarea/vars.less b/packages/theme/src/textarea/vars.less index 2f53ee76c4..fb9e6abc4a 100644 --- a/packages/theme/src/textarea/vars.less +++ b/packages/theme/src/textarea/vars.less @@ -12,57 +12,57 @@ .component-css-vars-textarea() { // 文本域文本颜色 - --ti-textarea-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-textarea-text-color: var(--ti-common-color-text-primary, #191919); // 文本域背景颜色 --ti-textarea-bg-color: var(--ti-common-color-icon-white, #fff); // 文本域字体大小 - --ti-textarea-font-size: var(--ti-common-font-size-base, 12px); + --ti-textarea-font-size: var(--ti-common-font-size-base, 14px); // 文本域计数器字体大小 - --ti-textarea-count-font-size: var(--ti-common-font-size-0); + --ti-textarea-count-font-size: var(--ti-common-font-size-0, 12px); // 文本域高度 - --ti-textarea-height: var(--ti-common-size-height-normal, 28px); + --ti-textarea-height: var(--ti-common-size-height-normal, 32px); // 文本域边框圆角 - --ti-textarea-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-textarea-border-radius: var(--ti-common-border-radius-normal, 6px); // 文本域边框色 - --ti-textarea-border-color: var(--ti-common-color-line-normal); + --ti-textarea-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 文本域内层hover时显示的边框颜色 - --ti-textarea-inner-hover-border-color: var(--ti-common-color-border-hover, #575d6c); + --ti-textarea-inner-hover-border-color: var(--ti-common-color-border-hover, #191919); // 文本域内层active时显示的边框颜色 - --ti-textarea-inner-active-border-color: var(--ti-common-color-line-active, #5e7ce0); + --ti-textarea-inner-active-border-color: var(--ti-common-color-line-active, #191919); // 文本域占位符文本颜色 - --ti-textarea-placeholder-text-color: var(--ti-common-color-text-weaken); + --ti-textarea-placeholder-text-color: var(--ti-common-color-text-weaken, #808080); // 文本域disabled时的文本颜色 - --ti-textarea-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-textarea-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 文本域disabled时的背景颜色 --ti-textarea-disabled-bg-color: #f2f2f2; // 文本域exceed时的文本颜色 --ti-textarea-exceed-text-color: #c7000b; // 计数器的颜色 - --ti-textarea-count-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-textarea-count-color: var(--ti-common-color-text-weaken, #808080); // 文本框垂直方向内边距 - --ti-textarea-padding-vertical: var(--ti-common-space-2x); + --ti-textarea-padding-vertical: var(--ti-common-space-2x, 8px); // 文本框水平方向内边距 - --ti-textarea-padding-horizontal: var(--ti-common-space-3x); + --ti-textarea-padding-horizontal: var(--ti-common-space-3x, 12px); // 文本框右侧内边距 - --ti-textarea-padding-right: var(--ti-common-space-base); + --ti-textarea-padding-right: var(--ti-common-space-base, 4px); // 文本框底部内边距 - --ti-textarea-padding-bottom: var(--ti-common-space-4x); + --ti-textarea-padding-bottom: var(--ti-common-space-4x, 16px); // 计数器底部距离 --ti-textarea-count-bottom: 1px; // 计数器右侧距离 - --ti-textarea-count-right: var(--ti-common-font-size-2); + --ti-textarea-count-right: var(--ti-common-font-size-2, 16px); // 文本域active时显示的边框颜色 - --ti-textarea-active-border-color: var(--ti-common-color-line-active); + --ti-textarea-active-border-color: var(--ti-common-color-line-active, #191919); // 计数器宽度 --ti-textarea-count-width: calc(100% - 17px); // 文本域宽度 --ti-textarea-inner-width: 100%; // 计数器圆角 - --ti-textarea-count-border-radius: var(--ti-common-border-radius-3); + --ti-textarea-count-border-radius: var(--ti-common-border-radius-3, 6px); // 计数器文本字数颜色 - --ti-textarea-count-text-length-color: var(--ti-common-color-text-primary); + --ti-textarea-count-text-length-color: var(--ti-common-color-text-primary, #191919); // 计数器右侧内边距 - --ti-textarea-count-padding-right: var(--ti-common-space-base); + --ti-textarea-count-padding-right: var(--ti-common-space-base, 4px); // 文本框字体 --ti-textarea-font-family: var(--ti-common-font-family, 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei'); // 计数器行高 diff --git a/packages/theme/src/time-panel/vars.less b/packages/theme/src/time-panel/vars.less index 63c6cb23b7..82fdd13004 100644 --- a/packages/theme/src/time-panel/vars.less +++ b/packages/theme/src/time-panel/vars.less @@ -18,22 +18,22 @@ --ti-time-panel-btn-bg-color: transparent; --ti-time-panel-btn-padding-vertical: 0; --ti-time-panel-btn-padding-horizontal: 5px; - --ti-time-panel-btn-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-time-panel-btn-border-radius: var(--ti-common-border-radius-normal, 6px); --ti-time-panel-btn-height: 28px; - --ti-time-panel-padding-right: calc(var(--ti-common-size-4x) - 2px); + --ti-time-panel-padding-right: calc(var(--ti-common-size-4x, 16px) - 2px); --ti-time-panel-btn-min-width: inherit; --ti-time-panel-btn-font-weight: 800; --ti-time-panel-btn-confirm-hover-bg-color: transparent; - --ti-time-panel-footer-height: var(--ti-common-size-14x); - --ti-time-panel-footer-padding-top: var(--ti-common-size-4x); - --ti-time-panel-footer-padding-right: var(--ti-common-size-4x); + --ti-time-panel-footer-height: var(--ti-common-size-14x, 56px); + --ti-time-panel-footer-padding-top: var(--ti-common-size-4x, 16px); + --ti-time-panel-footer-padding-right: var(--ti-common-size-4x, 16px); --ti-time-panel-footer-margin-right: calc(2px - var(--ti-common-size-4x)); --ti-time-panel-width: 220px; --ti-time-spinner-list-margin-bottom: 0px; --ti-time-spinner-list-margin-top: 0px; --ti-time-panel-btn-text-color: #303133; - --ti-time-panel-btn-confirm-text-color: var(--ti-base-color-brand-7, #526ecc); - --ti-time-panel-bg-color: var(--ti-common-color-light, #fff); - --ti-time-panel-border-radius: var(--ti-common-border-radius-normal, 2px); - --ti-time-panel-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-time-panel-btn-confirm-text-color: var(--ti-base-color-brand-7, #b3d6ff); + --ti-time-panel-bg-color: var(--ti-common-color-light, #ffffff); + --ti-time-panel-border-radius: var(--ti-common-border-radius-normal, 6px); + --ti-time-panel-border-color: var(--ti-common-color-line-dividing, #f0f0f0); } diff --git a/packages/theme/src/time-range/vars.less b/packages/theme/src/time-range/vars.less index dce8110b75..bb088cfd2f 100644 --- a/packages/theme/src/time-range/vars.less +++ b/packages/theme/src/time-range/vars.less @@ -11,32 +11,32 @@ */ .component-css-vars-time-range-picker() { - --ti-time-range-picker-header-font-size: var(--ti-common-font-size-base); - --ti-time-range-picker-content-padding: var(--ti-common-space-0); - --ti-time-range-picker-cell-padding-top: var(--ti-common-space-0); + --ti-time-range-picker-header-font-size: var(--ti-common-font-size-base, 14px); + --ti-time-range-picker-content-padding: var(--ti-common-space-0, 0px); + --ti-time-range-picker-cell-padding-top: var(--ti-common-space-0, 0px); --ti-time-range-picker-content-right: 7px; --ti-time-range-picker-content-bottom: 7px; - --ti-time-range-picker-header-height: var(--ti-common-size-height-large); - --ti-time-range-picker-header-line-height: calc(var(--ti-common-line-height-6) - 2px); - --ti-time-range-picker-header-margin-bottom: var(--ti-common-space-0); + --ti-time-range-picker-header-height: var(--ti-common-size-height-large, 48px); + --ti-time-range-picker-header-line-height: calc(var(--ti-common-line-height-6, 48px) - 2px); + --ti-time-range-picker-header-margin-bottom: var(--ti-common-space-0, 0px); --ti-time-range-picker-header-title-display: flex; --ti-time-range-picker-header-text-align: left; - --ti-time-range-picker-header-border-bottom: var(--ti-common-color-line-dividing); - --ti-time-range-picker-header-color: var(--ti-base-color-common-2); - --ti-time-range-picker-header-margin-left: var(--ti-common-size-4x); - --ti-time-range-picker-footer-height: var(--ti-common-size-14x); - --ti-time-range-picker-footer-padding-top: var(--ti-common-size-4x); - --ti-time-range-picker-footer-padding-right: var(--ti-common-size-4x); + --ti-time-range-picker-header-border-bottom: var(--ti-common-color-line-dividing, #f0f0f0); + --ti-time-range-picker-header-color: var(--ti-base-color-common-2, #808080); + --ti-time-range-picker-header-margin-left: var(--ti-common-size-4x, 16px); + --ti-time-range-picker-footer-height: var(--ti-common-size-14x, 56px); + --ti-time-range-picker-footer-padding-top: var(--ti-common-size-4x, 16px); + --ti-time-range-picker-footer-padding-right: var(--ti-common-size-4x, 16px); --ti-time-range-picker-btn-cancel-display: inline-block; --ti-time-range-picker-btn-bg-color: transparent; --ti-time-range-picker-btn-padding-vertical: 0; --ti-time-range-picker-btn-padding-horizontal: 5px; - --ti-time-range-picker-btn-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-time-range-picker-btn-border-radius: var(--ti-common-border-radius-normal, 6px); --ti-time-range-picker-btn-height: 28px; --ti-time-range-picker-btn-min-width: inherit; --ti-time-range-picker-btn-font-weight: 800; --ti-time-range-picker-btn-confirm-hover-bg-color: transparent; --ti-time-range-picker-btn-text-color: #303133; - --ti-time-range-picker-btn-confirm-text-color: var(--ti-base-color-brand-7, #526ecc); - --ti-time-range-picker-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-time-range-picker-btn-confirm-text-color: var(--ti-base-color-brand-7, #b3d6ff); + --ti-time-range-picker-border-color: var(--ti-common-color-line-dividing, #f0f0f0); } diff --git a/packages/theme/src/time-select/vars.less b/packages/theme/src/time-select/vars.less index a5f6f85c05..dcb94a0c1c 100644 --- a/packages/theme/src/time-select/vars.less +++ b/packages/theme/src/time-select/vars.less @@ -12,26 +12,26 @@ .component-css-vars-time-select() { // 时间选择选项高度 - --ti-time-select-item-height: var(--ti-common-size-height-normal, 28px); + --ti-time-select-item-height: var(--ti-common-size-height-normal, 32px); // 时间选择选项字体色 - --ti-time-select-item-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-time-select-item-text-color: var(--ti-common-color-text-primary, #191919); // 时间选择选项字号 - --ti-time-select-item-font-size: var(--ti-common-font-size-base, 12px); + --ti-time-select-item-font-size: var(--ti-common-font-size-base, 14px); // 时间选择选项行高 - --ti-time-select-item-line-height: var(--ti-common-size-height-normal, 28px); + --ti-time-select-item-line-height: var(--ti-common-size-height-normal, 32px); // 时间选择选项左右内边距 - --ti-time-select-item-padding-horizontal: var(--ti-common-space-4x); + --ti-time-select-item-padding-horizontal: var(--ti-common-space-4x, 16px); // 时间选择选项悬浮背景色 - --ti-time-select-item-hover-bg-color: var(--ti-common-color-bg-normal); + --ti-time-select-item-hover-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 时间选择选项禁用文本色 - --ti-time-select-item-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-time-select-item-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 时间选择选项悬浮背景色(选中项) - --ti-time-select-item-select-hover-bg-color: var(--ti-common-color-selected-background, #5e7ce0); + --ti-time-select-item-select-hover-bg-color: var(--ti-common-color-selected-background, #f5f5f5); // 时间选择选项字体色(选中项) - --ti-time-select-item-selected-text-color: var(--ti-common-color-text-highlight); + --ti-time-select-item-selected-text-color: var(--ti-common-color-text-highlight, #1476ff); // 面板高度 --ti-time-select-height: 242px; --ti-time-select-scrollbar-height: 242px; --ti-time-select-scrollbar-wrap-max-height: unset; - --ti-time-select-content-padding-top: var(--ti-common-space-2x); + --ti-time-select-content-padding-top: var(--ti-common-space-2x, 8px); } diff --git a/packages/theme/src/time-spinner/vars.less b/packages/theme/src/time-spinner/vars.less index 38e56befdb..63e0f6d675 100644 --- a/packages/theme/src/time-spinner/vars.less +++ b/packages/theme/src/time-spinner/vars.less @@ -12,14 +12,14 @@ .component-css-vars-time-spinner() { --ti-time-spinner-arrow-text-color: #909399; - --ti-time-spinner-arrow-hover-text-color: var(--ti-base-color-brand-7, #526ecc); - --ti-time-spinner-item-active-text-color: var(--ti-common-color-selected-text-color); - --ti-time-spinner-item-active-font-weight: var(--ti-common-font-weight-6); - --ti-time-spinner-item-font-weight: var(--ti-common-font-weight-4); + --ti-time-spinner-arrow-hover-text-color: var(--ti-base-color-brand-7, #b3d6ff); + --ti-time-spinner-item-active-text-color: var(--ti-common-color-selected-text-color, #191919); + --ti-time-spinner-item-active-font-weight: var(--ti-common-font-weight-6, 600); + --ti-time-spinner-item-font-weight: var(--ti-common-font-weight-4, normal); --ti-time-spinner-item-bg-color: #deedff; --ti-time-spinner-list-border-color: transparent; - --ti-time-spinner-font-size: var(--ti-common-font-size-base, 12px); - --ti-time-spinner-text-color: var(--ti-common-color-selected-text-color); + --ti-time-spinner-font-size: var(--ti-common-font-size-base, 14px); + --ti-time-spinner-text-color: var(--ti-common-color-selected-text-color, #191919); --ti-time-spinner-bg-color: var(--ti-base-color-light); --ti-time-spinner-selected-bg-color: #deedff; --ti-time-spinner-wrapper-max-height: 252px; @@ -28,7 +28,7 @@ --ti-time-spinner-item-height: 28px; --ti-time-spinner-item-line-height: 28px; --ti-time-spinner-selected-border-radius: 16px; - --ti-time-spinner-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); - --ti-time-spinner-disabled-text-background: var(--ti-common-color-bg-disabled); - --ti-time-spinner-disabled-text-border-radius: var(--ti-common-size-4x); + --ti-time-spinner-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); + --ti-time-spinner-disabled-text-background: var(--ti-common-color-bg-disabled, #f0f0f0); + --ti-time-spinner-disabled-text-border-radius: var(--ti-common-size-4x, 16px); } diff --git a/packages/theme/src/toggle-menu/vars.less b/packages/theme/src/toggle-menu/vars.less index ccfd545ae3..fefd0d429d 100644 --- a/packages/theme/src/toggle-menu/vars.less +++ b/packages/theme/src/toggle-menu/vars.less @@ -14,25 +14,25 @@ // 收缩菜单宽度 --ti-toggle-menu-width: var(--ti-common-size-50x, 200px); // 收缩菜单字号 - --ti-toggle-menu-font-size: var(--ti-common-font-size-1); + --ti-toggle-menu-font-size: var(--ti-common-font-size-1, 14px); // 收缩菜单列表文本色 - --ti-toggle-menu-name-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-toggle-menu-name-text-color: var(--ti-common-color-text-primary, #191919); // 收缩菜单列表项高度 - --ti-toggle-menu-tree-node-height: var(--ti-common-size-8x); + --ti-toggle-menu-tree-node-height: var(--ti-common-size-8x, 32px); // 收缩菜单收缩搜索高度 --ti-toggle-menu-filter-search-size: var(--ti-common-size-7x, 28px); // 收缩菜单输入框搜索图标尺寸 --ti-toggle-menu-filter-search-font-size: var(--ti-common-font-size-2, 16px); // 收缩菜单搜索图标色 - --ti-toggle-menu-filter-search-icon-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-toggle-menu-filter-search-icon-color: var(--ti-base-color-brand-6, #191919); // 收缩菜单收缩图标色 - --ti-toggle-menu-toggle-icon-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-toggle-menu-toggle-icon-color: var(--ti-base-color-brand-6, #191919); // 收缩菜单收缩图标悬浮色 - --ti-toggle-menu-toggle-icon-color-hover: var(--ti-common-color-primary-hover, #7693f5); + --ti-toggle-menu-toggle-icon-color-hover: var(--ti-common-color-primary-hover, #595959); // 收缩菜单收缩按钮背景色 - --ti-toggle-menu-toggle-bg-color: var(--ti-common-color-border, #adb0b8); + --ti-toggle-menu-toggle-bg-color: var(--ti-common-color-border, #999999); // 收缩菜单选中字重色 - --ti-toggle-menu-toggle-font-weight: var(--ti-common-font-weight-6); + --ti-toggle-menu-toggle-font-weight: var(--ti-common-font-weight-6, 600); // 收缩菜单收缩标签悬浮背景色 - --ti-toggle-menu-toggle-bg-hover-color: var(--ti-common-color-hover-background); + --ti-toggle-menu-toggle-bg-hover-color: var(--ti-common-color-hover-background, #f5f5f5); } diff --git a/packages/theme/src/tooltip/vars.less b/packages/theme/src/tooltip/vars.less index d1b3993ae0..d1b16918fb 100644 --- a/packages/theme/src/tooltip/vars.less +++ b/packages/theme/src/tooltip/vars.less @@ -20,7 +20,7 @@ // 弹框三角默认边框色 --ti-tooltip-popper-border-color: #191919; // 弹框字体行高(hide) - --ti-tooltip-popper-font-line-height: var(--ti-common-line-height-number); + --ti-tooltip-popper-font-line-height: var(--ti-common-line-height-number, 1.5); // 弹框字体(hide) --ti-tooltip-popper-font-family: var( --ti-common-font-family, @@ -35,52 +35,52 @@ // 悬浮弹出框圆角 --ti-tooltip-popper-border-radius: 8px; // 悬浮弹出框字号 - --ti-tooltip-popper-font-size: var(--ti-common-font-size-base, 12px); + --ti-tooltip-popper-font-size: var(--ti-common-font-size-base, 14px); // 正常背景色 (hide) - --ti-tooltip-popper-normal-bg-color: var(--ti-common-color-bg-dark-deep, #464c59); + --ti-tooltip-popper-normal-bg-color: var(--ti-common-color-bg-dark-deep, #fff); // 文字提示正常文本色(hide) --ti-tooltip-popper-normal-text-color: #191919; // 弹框正常边框色 (hide) - --ti-tooltip-popper-normal-border-color: var(--ti-common-color-bg-dark-deep, #464c59); + --ti-tooltip-popper-normal-border-color: var(--ti-common-color-bg-dark-deep, #fff); // info类型弹框背景色 --ti-tooltip-popper-info-bg-color: #1476ff; // info类型弹框文本色 - --ti-tooltip-popper-info-text-color: var(--ti-common-color-light, #fff); + --ti-tooltip-popper-info-text-color: var(--ti-common-color-light, #ffffff); // info类型弹框三角边框色 --ti-tooltip-popper-info-border-color: #1476ff; // error类型弹框背景色 - --ti-tooltip-popper-error-bg-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-tooltip-popper-error-bg-color: var(--ti-common-color-danger-normal, #f23030); // error类型弹框文本色 - --ti-tooltip-popper-error-text-color: var(--ti-common-color-light, #fff); + --ti-tooltip-popper-error-text-color: var(--ti-common-color-light, #ffffff); // error类型弹框三角边框色 - --ti-tooltip-popper-error-border-color: var(--ti-common-color-danger-normal, #c7000b); + --ti-tooltip-popper-error-border-color: var(--ti-common-color-danger-normal, #f23030); // warning类型弹框背景色 - --ti-tooltip-popper-warning-bg-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-tooltip-popper-warning-bg-color: var(--ti-common-color-warning-normal, #ff8800); // warning类型弹框文本色 - --ti-tooltip-popper-warning-text-color: var(--ti-common-color-light, #fff); + --ti-tooltip-popper-warning-text-color: var(--ti-common-color-light, #ffffff); // warning类型弹框三角边框色 - --ti-tooltip-popper-warning-border-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-tooltip-popper-warning-border-color: var(--ti-common-color-warning-normal, #ff8800); // success类型弹框背景色 - --ti-tooltip-popper-success-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-tooltip-popper-success-bg-color: var(--ti-common-color-success-normal, #5cb300); // success类型弹框文本色 - --ti-tooltip-popper-success-text-color: var(--ti-common-color-light, #fff); + --ti-tooltip-popper-success-text-color: var(--ti-common-color-light, #ffffff); // success类型弹框三角边框色 - --ti-tooltip-popper-success-border-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-tooltip-popper-success-border-color: var(--ti-common-color-success-normal, #5cb300); // dark主题弹框背景色 --ti-tooltip-popper-dark-bg-color: #191919; // dark主题弹框文本色 --ti-tooltip-popper-dark-text-color: #fff; // light主题弹框背景色 - --ti-tooltip-popper-light-bg-color: var(--ti-common-color-light, #fff); + --ti-tooltip-popper-light-bg-color: var(--ti-common-color-light, #ffffff); // light主题|禁用弹框文本色 - --ti-tooltip-popper-light-text-color: var(--ti-common-color-text-primary); + --ti-tooltip-popper-light-text-color: var(--ti-common-color-text-primary, #191919); // light主题|禁用时弹框边框色 --ti-tooltip-popper-light-border-color: #fff; @@ -91,7 +91,7 @@ // 弹框水平内边距 --ti-tooltip-padding-horizontal: 16px; // 文字提示错误图标色 - --ti-tooltip-validate-icon-color: var(--ti-common-color-error, #f66f6a); + --ti-tooltip-validate-icon-color: var(--ti-common-color-error, #f23030); // 文本内容容器最大高度 --ti-tooltip-content-max-height: 50vh; } diff --git a/packages/theme/src/top-box/vars.less b/packages/theme/src/top-box/vars.less index 96c9738aaa..b9b701297f 100644 --- a/packages/theme/src/top-box/vars.less +++ b/packages/theme/src/top-box/vars.less @@ -11,11 +11,11 @@ */ .component-css-vars-top-box() { - --ti-top-box-bg-color: var(--ti-common-color-light, #fff); + --ti-top-box-bg-color: var(--ti-common-color-light, #ffffff); --ti-top-box-icon-font-size: var(--ti-common-font-size-5, 24px); - --ti-top-box-success-icon-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-top-box-success-icon-color: var(--ti-common-color-success-normal, #5cb300); --ti-top-box-error-icon-color: var(--ti-base-color-bg-8, #c7000b); - --ti-top-box-warning-icon-color: var(--ti-common-color-warning-normal, #fa9841); - --ti-top-box-help-icon-color: var(--ti-base-color-brand-6, #5e7ce0); - --ti-top-box-info-icon-color: var(--ti-common-color-info-normal, #252b3a); + --ti-top-box-warning-icon-color: var(--ti-common-color-warning-normal, #ff8800); + --ti-top-box-help-icon-color: var(--ti-base-color-brand-6, #191919); + --ti-top-box-info-icon-color: var(--ti-common-color-info-normal, #191919); } diff --git a/packages/theme/src/transfer/vars.less b/packages/theme/src/transfer/vars.less index 557e4ad70b..7a984ddee0 100644 --- a/packages/theme/src/transfer/vars.less +++ b/packages/theme/src/transfer/vars.less @@ -12,7 +12,7 @@ .component-css-vars-transfer() { // 字体基础大小 - --ti-transfer-font-size: var(--ti-common-font-size-1); + --ti-transfer-font-size: var(--ti-common-font-size-1, 14px); // 按钮组左侧内边距 --ti-transfer-buttons-padding-left: var(--ti-common-space-4x, 16px); // 按钮组右侧内边距 @@ -56,45 +56,45 @@ // 按钮底部内边距 --ti-transfer-button-padding-bottom: 2px; // 按钮圆角 - --ti-transfer-button-border-radius: var(--ti-common-size-base); + --ti-transfer-button-border-radius: var(--ti-common-size-base, 4px); // 按钮禁用时文本色 - --ti-transfer-button-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-transfer-button-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 按钮禁用时边框色 - --ti-transfer-button-disabled-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-transfer-button-disabled-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 按钮禁用时背景色 - --ti-transfer-button-disabled-bg-color: var(--ti-common-color-bg-disabled, #f5f5f6); + --ti-transfer-button-disabled-bg-color: var(--ti-common-color-bg-disabled, #f0f0f0); // 按钮禁用时行高 --ti-transfer-button-disabled-line-height: 1; // 第一个按钮的底部外边距 --ti-transfer-first-button-margin-bottom: var(--ti-common-space-3x, 12px); // 面板背景色 - --ti-transfer-panel-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-transfer-panel-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 面板内容区域高度 --ti-transfer-panel-body-height: 260px; // 面板内容区域边框色 - --ti-transfer-panel-border-color: var(--ti-common-color-line-normal); + --ti-transfer-panel-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 面板内容区域边框圆角 - --ti-transfer-panel-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-transfer-panel-border-radius: var(--ti-common-border-radius-normal, 6px); // 面板高度 - --ti-transfer-panel-item-height: var(--ti-common-size-8x); + --ti-transfer-panel-item-height: var(--ti-common-size-8x, 32px); // 面板文本色 - --ti-transfer-panel-item-text-color: var(--ti-common-color-info-normal); + --ti-transfer-panel-item-text-color: var(--ti-common-color-info-normal, #191919); // 面板悬浮时文本色 - --ti-transfer-panel-item-hover-text-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-transfer-panel-item-hover-text-color: var(--ti-common-color-icon-hover, #191919); // 面板悬浮时背景色 --ti-transfer-panel-item-hover-bg-color: var(ti-common-color-bg-normal, #f5f5f5); // 面板搜索框高度 - --ti-transfer-panel-filter-height: var(--ti-common-size-height-normal, 28px); + --ti-transfer-panel-filter-height: var(--ti-common-size-height-normal, 32px); // 面板搜索框字体大小 - --ti-transfer-panel-filter-font-size: var(--ti-common-font-size-base, 12px); + --ti-transfer-panel-filter-font-size: var(--ti-common-font-size-base, 14px); // 面板搜索框边框圆角 - --ti-transfer-panel-filter-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-transfer-panel-filter-border-radius: var(--ti-common-border-radius-normal, 6px); // 面板内容区域过滤后列表高度 --ti-transfer-panel-body-filter-height: calc(var(--ti-common-size-50x, 200px) + 16px); // 面板内容区域右内边距 --ti-transfer-panel-body-padding-right: calc(var(--ti-common-space-1, 1px) + 1px); // 面板内容区域左内边距 - --ti-transfer-panel-body-padding-left: var(--ti-common-space-0, 0); + --ti-transfer-panel-body-padding-left: var(--ti-common-space-0, 0px); // 面板内容区域存在底部时的内边距 --ti-transfer-panel-body-footer-padding-bottom: var(--ti-common-space-10x, 40px); // 面板内容区域存在底部时的高度 @@ -108,25 +108,25 @@ // 面板头部边框色 --ti-transfer-header-border-color: rgba(0, 0, 0, 0.08); // 面板头部文本色 - --ti-transfer-header-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-transfer-header-text-color: var(--ti-common-color-info-normal, #191919); // 面板头部span文本色 - --ti-transfer-header-span-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-transfer-header-span-text-color: var(--ti-common-color-info-normal, #191919); // 面板头部字体大小 - --ti-transfer-header-font-size: var(--ti-common-font-size-base, 12px); + --ti-transfer-header-font-size: var(--ti-common-font-size-base, 14px); // 面板头部排序图标宽度 --ti-transfer-header-sort-width: var(--ti-common-size-5x, 20px); // 面板头部排序图标文本色 - --ti-transfer-header-sort-text-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-transfer-header-sort-text-color: var(--ti-common-color-bg-emphasize, #191919); // 面板底部高度 --ti-transfer-footer-height: var(--ti-common-size-10x, 40px); // 面板底部背景色 - --ti-transfer-footer-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-transfer-footer-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 面板底部边框色 - --ti-transfer-footer-border-color: var(--ti-common-color-line-normal, #adb0b8); + --ti-transfer-footer-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 面板内容区域列表为空时显示的文本高度 - --ti-transfer-empty-height: var(--ti-common-size-height-minor); + --ti-transfer-empty-height: var(--ti-common-size-height-minor, 30px); // 面板内容区域列表为空时显示的文本色 - --ti-transfer-empty-text-color: var(--ti-common-color-text-weaken, #8a8e99); + --ti-transfer-empty-text-color: var(--ti-common-color-text-weaken, #808080); // 面板内容区域为嵌套树样式时的高度 --ti-transfer-panel-body-tree-height: 100%; // 面板内容区域为嵌套树样式时的左侧内边距 @@ -158,13 +158,13 @@ // 面板内容区域过滤后顶部内边距 --ti-transfer-panel-body-filter-padding-top: var(--ti-common-space-0, 0px); // 面板左侧内边距 - --ti-transfer-panel-item-padding-left: var(--ti-common-space-4x); + --ti-transfer-panel-item-padding-left: var(--ti-common-space-4x, 16px); // 面板多选框左侧内边距 --ti-transfer-panel-item-checkbox-padding-left: calc(var(--ti-common-space-5x, 20px) + 2px); // 面板搜索框左侧内边距 - --ti-transfer-panel-filter-padding-left: var(--ti-common-space-4x, 8px); + --ti-transfer-panel-filter-padding-left: var(--ti-common-space-4x, 16px); // 面板搜索框右侧内边距 - --ti-transfer-panel-filter-padding-right: var(--ti-common-space-4x, 8px); + --ti-transfer-panel-filter-padding-right: var(--ti-common-space-4x, 16px); // 面板搜索框顶部内边距 --ti-transfer-panel-filter-padding-top: var(--ti-common-space-2x, 8px); // 面板搜索框底部内边距 @@ -178,9 +178,9 @@ // 头部底部外边距 --ti-transfer-header-margin-bottom: var(--ti-common-space-0, 0px); // 头部左侧内边距 - --ti-transfer-header-padding-left: var(--ti-common-space-4x); + --ti-transfer-header-padding-left: var(--ti-common-space-4x, 16px); // 头部右侧内边距 - --ti-transfer-header-padding-right: var(--ti-common-space-4x); + --ti-transfer-header-padding-right: var(--ti-common-space-4x, 16px); // 头部顶部内边距 --ti-transfer-header-padding-top: var(--ti-common-space-0, 0px); // 头部底部内边距 @@ -236,9 +236,9 @@ // 多选框左侧内边距 --ti-transfer-checkbox-label-padding-left: var(--ti-common-space-2x, 8px); // 穿梭按钮宽度 - --ti-transfer-button-width: var(--ti-common-size-4x); + --ti-transfer-button-width: var(--ti-common-size-4x, 16px); // 穿梭按钮高度 - --ti-transfer-button-height: var(--ti-common-size-4x); + --ti-transfer-button-height: var(--ti-common-size-4x, 16px); // 穿梭箭头大小 --ti-transfer-svg-font-size: 10px; } diff --git a/packages/theme/src/tree-menu/vars.less b/packages/theme/src/tree-menu/vars.less index 7e676a6717..808f72da5a 100644 --- a/packages/theme/src/tree-menu/vars.less +++ b/packages/theme/src/tree-menu/vars.less @@ -16,39 +16,39 @@ // 节点高度 --ti-tree-menu-node-height: var(--ti-common-size-10x, 40px); // 空数据显示文本字号(hide) - --ti-tree-menu-font-size: var(--ti-common-font-size-base, 12px); + --ti-tree-menu-font-size: var(--ti-common-font-size-base, 14px); // 边框色 - --ti-tree-menu-border-color: var(--ti-common-color-light); + --ti-tree-menu-border-color: var(--ti-common-color-light, #ffffff); // 节点水平内边距 --ti-tree-menu-node-body-text-padding-horizontal: 0; // 选中节点的背景色 - --ti-tree-menu-node-selected-bg-color: var(--ti-common-color-bg-normal); + --ti-tree-menu-node-selected-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); // 选中节点文本色 - --ti-tree-menu-node-current-text-color: var(--ti-common-color-text-primary); + --ti-tree-menu-node-current-text-color: var(--ti-common-color-text-primary, #191919); // 选中节点左边框色 - --ti-tree-menu-square-left-border-color: var(--ti-common-color-icon-active); + --ti-tree-menu-square-left-border-color: var(--ti-common-color-icon-active, #191919); // 未选中节点文本色 - --ti-tree-menu-node-body-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-tree-menu-node-body-text-color: var(--ti-common-color-text-primary, #191919); // 节点悬浮背景色 - --ti-tree-menu-node-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-tree-menu-node-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); // 折叠图标颜色 - --ti-tree-menu-collapse-icon-fill-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-tree-menu-collapse-icon-fill-color: var(--ti-common-color-icon-normal, #808080); // 底部折叠按钮 --ti-tree-menu-collapse-icon-hover-color: var(--ti-common-bg-color-focus, #0067d1); // 折叠图标右边距 - --ti-tree-menu-collapse-icon-margin-right: var(--ti-common-size-5x); + --ti-tree-menu-collapse-icon-margin-right: var(--ti-common-size-5x, 20px); // 输入框下面的线 - --ti-tree-menu-border-top-color: var(--ti-common-color-light, #fff); + --ti-tree-menu-border-top-color: var(--ti-common-color-light, #ffffff); // 节点序号字号 - --ti-tree-menu-node-number-font-size: var(--ti-common-font-size-0); + --ti-tree-menu-node-number-font-size: var(--ti-common-font-size-0, 12px); // 活跃节点竖线与文本的间距 --ti-tree-menu-node-vertical-line-margin-right: var(--ti-common-size-4x, 16px); // 输入框与文本的间距 - --ti-tree-menu-padding-top: var(--ti-common-size-2x); + --ti-tree-menu-padding-top: var(--ti-common-size-2x, 8px); // 前缀图标右边距 --ti-tree-menu-prefix-icon-margin-right: var(--ti-common-size-2x, 8px); // 禁用文本色 - --ti-tree-menu-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-tree-menu-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 数字文本色 - --ti-tree-menu-node-number-color: var(--ti-common-color-text-weaken); + --ti-tree-menu-node-number-color: var(--ti-common-color-text-weaken, #808080); } diff --git a/packages/theme/src/tree/vars.less b/packages/theme/src/tree/vars.less index 367d03d38b..b90f19a6f0 100644 --- a/packages/theme/src/tree/vars.less +++ b/packages/theme/src/tree/vars.less @@ -12,31 +12,31 @@ .component-css-vars-tree() { // 顶部内边距 - --ti-tree-padding-top: var(--ti-common-space-4x); + --ti-tree-padding-top: var(--ti-common-space-4x, 16px); // 底部内边距 - --ti-tree-padding-bottom: var(--ti-common-space-4x); + --ti-tree-padding-bottom: var(--ti-common-space-4x, 16px); // 默认文本色 - --ti-tree-text-color: var(--ti-common-color-text-primary, #252b3a); + --ti-tree-text-color: var(--ti-common-color-text-primary, #191919); // 选中文本色 - --ti-tree-selected-text-color: var(--ti-common-color-text-highlight); + --ti-tree-selected-text-color: var(--ti-common-color-text-highlight, #1476ff); // 选中文本字重 - --ti-tree-selected-font-weight: var(--ti-common-font-weight-6); + --ti-tree-selected-font-weight: var(--ti-common-font-weight-6, 600); // 禁用文本色 - --ti-tree-disabled-text-color: var(--ti-common-color-text-disabled, #adb0b8); + --ti-tree-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); // 文本行高 --ti-tree-text-line-height: var(--ti-common-line-height-number, 1.5); // 背景色 - --ti-tree-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-tree-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 数据为空时文本色(hide) - --ti-tree-empty-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-tree-empty-text-color: var(--ti-common-color-text-secondary, #595959); // 数据为空时整体最小高度 --ti-tree-empty-min-height: var(--ti-common-size-15x, 60px); // 选中节点背景色 - --ti-tree-node-content-current-bg-color: var(--ti-common-color-light); + --ti-tree-node-content-current-bg-color: var(--ti-common-color-light, #ffffff); // 节点悬浮背景色 - --ti-tree-node-content-hover-bg-color: var(--ti-common-color-hover-background, #f2f5fc); + --ti-tree-node-content-hover-bg-color: var(--ti-common-color-hover-background, #f5f5f5); // 节点悬浮外层背景色(hide) - --ti-tree-node-hover-outter-bg-color: var(--ti-common-color-hover-background); + --ti-tree-node-hover-outter-bg-color: var(--ti-common-color-hover-background, #f5f5f5); // 节点悬浮内层背景色(hide) --ti-tree-node-hover-inner-bg-color: var(--ti-tree-node-content-hover-bg-color); // 节点字号 @@ -46,38 +46,38 @@ // 节点内容右边距 --ti-tree-node-content-padding-right: var(--ti-common-space-4x, 16px); // 节点文本背景色(hide) - --ti-tree-node-label-bg-color: var(--ti-common-color-bg-white-normal, #fff); + --ti-tree-node-label-bg-color: var(--ti-common-color-bg-white-normal, #ffffff); // 节点文本色(hide) - --ti-tree-node-label-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-tree-node-label-text-color: var(--ti-common-color-text-secondary, #595959); // 展开按钮图标尺寸 --ti-tree-node-icon-font-size: var(--ti-common-font-size-1, 14px); // 加载图标色(hide) - --ti-tree-node-loading-icon-color: var(--ti-common-color-icon-active, #5e7ce0); + --ti-tree-node-loading-icon-color: var(--ti-common-color-icon-active, #191919); // 展开按钮图标色 - --ti-tree-node-expand-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-tree-node-expand-icon-color: var(--ti-common-color-icon-normal, #808080); // 收起按钮图标色 - --ti-tree-node-collapse-icon-color: var(--ti-common-color-icon-active, #5e7ce0); + --ti-tree-node-collapse-icon-color: var(--ti-common-color-icon-active, #191919); // 编辑、删除、添加图标尺寸 --ti-tree-node-operate-icon-font-size: var(--ti-common-font-size-2, 16px); // 编辑、删除、添加图标间距 --ti-tree-node-operate-icon-margin-left: var(--ti-common-space-base, 4px); // 编辑、删除、添加图标色 - --ti-tree-node-operate-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-tree-node-operate-icon-color: var(--ti-common-color-icon-normal, #808080); // 悬浮图标色 - --ti-tree-node-checked-icon-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-tree-node-checked-icon-color: var(--ti-common-color-icon-hover, #191919); // 节点左内边距 - --ti-tree-node-padding-left: var(--ti-common-space-4x); + --ti-tree-node-padding-left: var(--ti-common-space-4x, 16px); // 节点高亮背景色 - --ti-tree-node-highlight-bg-color: var(--ti-base-text-color-2); + --ti-tree-node-highlight-bg-color: var(--ti-base-text-color-2, #f2f2f2); // 节点内容高度 - --ti-tree-node-content-height: var(--ti-common-space-8x); + --ti-tree-node-content-height: var(--ti-common-space-8x, 32px); // 节点内容边框弧度 --ti-tree-node-content-border-radius: 0; // 节点右键菜单内容字号 - --ti-tree-node-menu-font-size: var(--ti-common-font-size-base, 12px); + --ti-tree-node-menu-font-size: var(--ti-common-font-size-base, 14px); // 节点右键菜单字体色 - --ti-tree-node-menu-font-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-tree-node-menu-font-color: var(--ti-common-color-text-secondary, #595959); // 节点右键菜单字体系列 --ti-tree-node-menu-font-family: Helvetica, Arial, 'Microsoft YaHei', sans-serif; // 节点右键菜单阴影 @@ -85,14 +85,14 @@ // 节点缩进 --ti-tree-node-indent: var(--ti-common-space-4x, 16px); // 节点连接线颜色 - --ti-tree-node-guide-line-border-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-tree-node-guide-line-border-color: var(--ti-common-color-line-dividing, #f0f0f0); // 节点连接线宽度 --ti-tree-node-guide-line-width: var(--ti-common-space-2x, 8px); // 显示连接线时图标字号(hide) --ti-tree-node-showline-icon-size: var(--ti-common-font-size-2, 16px); // 底部分割线颜色 - --ti-tree-bottom-divider-bg-color: var(--ti-common-color-line-dividing, #dfe1e6); + --ti-tree-bottom-divider-bg-color: var(--ti-common-color-line-dividing, #f0f0f0); // 底部水平内边距 --ti-tree-bottom-padding-horizontal: var(--ti-common-space-3x, 12px); // 底部垂直内边距 @@ -108,17 +108,17 @@ // 平铺模式节点高度 --ti-tree-plain-node-height: calc(var(--ti-common-space-base, 4px) * 7); // 平铺模式节点字号 - --ti-tree-plain-font-size: var(--ti-common-line-height-base, 12px); + --ti-tree-plain-font-size: var(--ti-common-line-height-base, 18px); // 平铺模式节点左边距 --ti-tree-plain-node-padding-left: var(--ti-common-space-3x, 12px); // 平铺模式节点边框圆角 - --ti-tree-plain-node-border-radius: var(--ti-common-border-radius-1, 4px); + --ti-tree-plain-node-border-radius: var(--ti-common-border-radius-1, 2px); // 平铺模式节点标题图标尺寸 --ti-tree-plain-node-auxi-icon-font-size: var(--ti-common-font-size-2, 16px); // 平铺模式辅助文本左边距 --ti-tree-plain-node-auxi-margin-left: var(--ti-common-space-6x, 24px); // 平铺模式辅助文本色 - --ti-tree-plain-node-auxi-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-tree-plain-node-auxi-text-color: var(--ti-common-color-text-secondary, #595959); } // 删除节点提示框 @@ -126,7 +126,7 @@ // 警告图标尺寸 --ti-tree-popover-warn-icon-font-size: var(--ti-common-font-size-2, 16px); // 警告图标色 - --ti-tree-popover-warn-icon-bg-color: var(--ti-common-color-warn, #fa9841); + --ti-tree-popover-warn-icon-bg-color: var(--ti-common-color-warn, #ff8800); // 警告图标右边距 --ti-tree-popover-warn-icon-margin-right: var(--ti-common-space-base, 4px); // 复选框上边距 diff --git a/packages/theme/src/upload-dragger/vars.less b/packages/theme/src/upload-dragger/vars.less index e5d136a4cb..42672c5d39 100644 --- a/packages/theme/src/upload-dragger/vars.less +++ b/packages/theme/src/upload-dragger/vars.less @@ -18,11 +18,11 @@ // 拖拽上传框背景色 --ti-upload-dragger-bg-color: var(--ti-common-color-bg-gray, #fafafa); // 拖拽上传框边框色 - --ti-upload-dragger-border-color: var(--ti-common-color-border, #adb0b8); + --ti-upload-dragger-border-color: var(--ti-common-color-border, #999999); // 拖拽上传框圆角 - --ti-upload-dragger-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-upload-dragger-border-radius: var(--ti-common-border-radius-normal, 6px); // 拖拽上传框(链接文本|悬浮边框)色 - --ti-upload-dragger-hover-text-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-upload-dragger-hover-text-color: var(--ti-common-color-primary-hover, #595959); // 文件拖到框内上传框背景色 --ti-upload-dragger-dragover-bg-color: rgba(32, 159, 255, 0.06); // 拖拽上传框内图标色 @@ -30,9 +30,9 @@ // 拖拽上传框内图标尺寸 --ti-upload-dragger-icon-font-size: 24px; // 拖拽上传框内文本色 - --ti-upload-dragger-text-color: var(--ti-common-color-text-secondary, #575d6c); + --ti-upload-dragger-text-color: var(--ti-common-color-text-secondary, #595959); // 拖拽上传框内字号 - --ti-upload-dragger-text-font-size: var(--ti-common-font-size-base, 12px); + --ti-upload-dragger-text-font-size: var(--ti-common-font-size-base, 14px); // 拖拽上传框文件列表边框色(hide) --ti-upload-dragger-files-border-color: #dcdfe6; } diff --git a/packages/theme/src/upload-list/vars.less b/packages/theme/src/upload-list/vars.less index e585e8226a..84ab74a60c 100644 --- a/packages/theme/src/upload-list/vars.less +++ b/packages/theme/src/upload-list/vars.less @@ -14,61 +14,61 @@ // 上传文件列表字号 --ti-upload-list-item-font-size: var(--ti-common-font-size-1, 14px); // 上传文件列表文本色 - --ti-upload-list-item-text-color: var(--ti-common-color-text-secondary); + --ti-upload-list-item-text-color: var(--ti-common-color-text-secondary, #595959); // 上传文件列表项(图片框|悬浮背景)圆角 - --ti-upload-list-item-border-radius: var(--ti-common-border-radius-4); + --ti-upload-list-item-border-radius: var(--ti-common-border-radius-4, 8px); // 上传文件列表项悬浮背景色 - --ti-upload-list-item-hover-background-color: var(--ti-common-color-bg-normal); + --ti-upload-list-item-hover-background-color: var(--ti-common-color-bg-normal, #f5f5f5); // 上传成功列表项悬浮文本色 - --ti-upload-list-item-hover-text-color: var(--ti-common-color-primary-hover, #7693f5); + --ti-upload-list-item-hover-text-color: var(--ti-common-color-primary-hover, #595959); // 上传文件列表项悬浮下划线(hide) --ti-upload-list-item-hover-text-decoration: none; // 上传文件列表项前置图标色 - --ti-upload-list-item-name-icon-color: var(--ti-common-color-primary-normal); + --ti-upload-list-item-name-icon-color: var(--ti-common-color-primary-normal, #191919); // 上传文件列表项前置图标尺寸 --ti-upload-list-item-name-icon-font-size: var(--ti-common-font-size-2, 16px); // 上传文件列表项右侧图标色 - --ti-upload-list-svg-close-icon-color: var(--ti-common-color-icon-normal, #575d6c); + --ti-upload-list-svg-close-icon-color: var(--ti-common-color-icon-normal, #808080); // 上传文件列表项右侧悬浮图标色 - --ti-upload-list-svg-close-hover-icon-color: var(--ti-common-color-icon-hover, #5e7ce0); + --ti-upload-list-svg-close-hover-icon-color: var(--ti-common-color-icon-hover, #191919); // 上传文件列表项图标尺寸 - --ti-upload-list-svg-icon-font-size: var(--ti-common-font-size-2); + --ti-upload-list-svg-icon-font-size: var(--ti-common-font-size-2, 16px); // 上传文件列表项成功图标尺寸 --ti-upload-list-successful-icon-font-size: var(--ti-common-font-size-1, 14px); // 照片墙上传列表项上传中边框样式 --ti-upload-list-picture-card-loading-border-color: dashed; // 照片墙上传列表项边框色 - --ti-upload-list-picture-card-item-border-color: var(--ti-common-color-line-normal); + --ti-upload-list-picture-card-item-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 照片墙上传成功列表项边框厚度 --ti-upload-list-picture-success-border-weight: 0; // 照片墙上传列表项背景色 - --ti-upload-list-picture-card-item-bg-color: var(--ti-common-color-light, #fff); + --ti-upload-list-picture-card-item-bg-color: var(--ti-common-color-light, #ffffff); // 照片墙上传列表项右上角图标填充色 - --ti-upload-list-picture-card-item-text-color: var(--ti-common-color-light, #fff); + --ti-upload-list-picture-card-item-text-color: var(--ti-common-color-light, #ffffff); // 上传列表项成功状态图标色或背景色 - --ti-upload-list-successful-status-bg-color: var(--ti-common-color-success-normal, #50d4ab); + --ti-upload-list-successful-status-bg-color: var(--ti-common-color-success-normal, #5cb300); // 照片墙上传列表项宽度(new) - --ti-upload-list-picture-card-width: var(--ti-common-size-25x); + --ti-upload-list-picture-card-width: var(--ti-common-size-25x, 100px); // 照片墙上传列表项高度(new) - --ti-upload-list-picture-card-height: var(--ti-common-size-25x); + --ti-upload-list-picture-card-height: var(--ti-common-size-25x, 100px); // 照片墙上传列表项进度条尺寸(new) - --ti-upload-list-picture-card-progress-size: var(--ti-common-size-17x); + --ti-upload-list-picture-card-progress-size: var(--ti-common-size-17x, 68px); // 照片墙上传列表项按钮颜色(new) - --ti-upload-list-picture-card-item-icon-color: var(--ti-common-color-light); + --ti-upload-list-picture-card-item-icon-color: var(--ti-common-color-light, #ffffff); // 照片墙上传列表项右外边距(new) - --ti-upload-list-picture-card-item-margin-right: var(--ti-common-space-4x); + --ti-upload-list-picture-card-item-margin-right: var(--ti-common-space-4x, 16px); // 非picturecard模式上传列表进度条上外边距(hide) - --ti-upload-list-item-progress-top: calc(var(--ti-common-line-height-2) + 2px); + --ti-upload-list-item-progress-top: calc(var(--ti-common-line-height-2, 24px) + 2px); // 非picturecard模式上传文件列表文本行高(new) - --ti-upload-list-item-line-height: var(--ti-common-line-height-1); + --ti-upload-list-item-line-height: var(--ti-common-line-height-1, 22px); // 非picturecard模式上传文件列表文本上外边距(new) - --ti-upload-list-item-margin-top: var(--ti-common-space-2x); + --ti-upload-list-item-margin-top: var(--ti-common-space-2x, 8px); // 上传文件列表项失败文本和图标色 --ti-upload-list-item-fail-text-color: #f23030; // 上传文件列表项刷新图标右边距(hide) - --ti-upload-list-svg-refresh-position-right: var(--ti-common-space-8x); + --ti-upload-list-svg-refresh-position-right: var(--ti-common-space-8x, 32px); // 上传文件列表项删除图标右边距(hide) - --ti-upload-list-svg-close-position-right: var(--ti-common-space-2x); + --ti-upload-list-svg-close-position-right: var(--ti-common-space-2x, 8px); // 照片墙上传列表项悬浮背景色(new) - --ti-upload-list-picture-card-item-hover-bg-color: var(--ti-common-bg-color-hover-40); + --ti-upload-list-picture-card-item-hover-bg-color: var(--ti-common-bg-color-hover-40, var(--ti-base-bg-color-transparent-40)); } diff --git a/packages/theme/src/upload/vars.less b/packages/theme/src/upload/vars.less index 20b7722971..7f9aa67a00 100644 --- a/packages/theme/src/upload/vars.less +++ b/packages/theme/src/upload/vars.less @@ -12,19 +12,19 @@ .component-css-vars-upload() { // 自定义上传提示字号 - --ti-upload-tip-font-size: var(--ti-common-font-size-base, 12px); + --ti-upload-tip-font-size: var(--ti-common-font-size-base, 14px); // 自定义上传提示文本色 --ti-upload-tip-text-color: #808080; // 照片墙上传按钮背景色 --ti-upload-picture-card-bg-color: #FFFFFF; // 照片墙上传按钮边框色 - --ti-upload-picture-card-border-color: var(--ti-common-color-line-normal); + --ti-upload-picture-card-border-color: var(--ti-common-color-line-normal, #c2c2c2); // 照片墙上传按钮圆角 --ti-upload-picture-card-border-radius: 6px; // 照片墙上传按钮悬浮边框色 - --ti-upload-picture-card-hover-border-color: var(--ti-common-color-dash-line-hover, #526ecc); + --ti-upload-picture-card-hover-border-color: var(--ti-common-color-dash-line-hover, #191919); // 照片墙上传按钮图标尺寸 - --ti-upload-picture-card-icon-font-size: var(--ti-common-font-size-5); + --ti-upload-picture-card-icon-font-size: var(--ti-common-font-size-5, 24px); // 照片墙上传按钮图标色 --ti-upload-picture-card-icon-color: #191919; // 拖拽上传区域宽度 diff --git a/packages/theme/src/user-card/vars.less b/packages/theme/src/user-card/vars.less index ae4e528eea..acf27b3764 100644 --- a/packages/theme/src/user-card/vars.less +++ b/packages/theme/src/user-card/vars.less @@ -11,8 +11,8 @@ */ .component-css-vars-user-card() { - --ti-usercard-border-color: var(--ti-common-color-border, #adb0b8); - --ti-usercard-image-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-usercard-border-color: var(--ti-common-color-border, #999999); + --ti-usercard-image-border-radius: var(--ti-common-border-radius-normal, 6px); --ti-usercard-state-online-text-color: #33cc00; --ti-usercard-state-busy-text-color: #ff3300; --ti-usercard-state-goaway-text-color: #ffae00; diff --git a/packages/theme/src/user-contact/vars.less b/packages/theme/src/user-contact/vars.less index 4506b8a06d..3972b8f2a0 100644 --- a/packages/theme/src/user-contact/vars.less +++ b/packages/theme/src/user-contact/vars.less @@ -11,15 +11,15 @@ */ .component-css-vars-user-contact() { - --ti-user-contact-roleInfo-text-color: var(--ti-common-color-text-weaken); - --ti-user-contact-roleInfo-font-size: var(--ti-common-font-size-0); - --ti-user-contact-card-message-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-user-contact-roleInfo-text-color: var(--ti-common-color-text-weaken, #808080); + --ti-user-contact-roleInfo-font-size: var(--ti-common-font-size-0, 12px); + --ti-user-contact-card-message-text-color: var(--ti-common-color-placeholder, #808080); --ti-user-contact-card-border-color: #ddd; --ti-user-contact-card-header-bg-color: #3f4251; - --ti-user-contact-card-header-role-text-color: var(--ti-common-color-light, #fff); + --ti-user-contact-card-header-role-text-color: var(--ti-common-color-light, #ffffff); --ti-user-contact-card-header-role-font-size: var(--ti-common-font-size-2, 16px); --ti-user-contact-card-header-roleNum-text-color: #b9babc; - --ti-user-contact-card-espace-text-color: var(--ti-common-color-placeholder, #adb0b8); + --ti-user-contact-card-espace-text-color: var(--ti-common-color-placeholder, #808080); // 描述左外边距 - --ti-user-contact-role-desc-margin-left: var(--ti-common-space-0); + --ti-user-contact-role-desc-margin-left: var(--ti-common-space-0, 0px); } diff --git a/packages/theme/src/user-head/vars.less b/packages/theme/src/user-head/vars.less index f13bdc072f..646b79f2d9 100644 --- a/packages/theme/src/user-head/vars.less +++ b/packages/theme/src/user-head/vars.less @@ -15,6 +15,6 @@ --ti-userhead-head-small-size: 30px; --ti-userhead-head-icon-size-normal: var(--ti-common-size-10x, 40px); --ti-userhead-head-icon-small-size: 14px; - --ti-userhead-head-border-radius: var(--ti-common-border-radius-1, 4px); + --ti-userhead-head-border-radius: var(--ti-common-border-radius-1, 2px); --ti-userhead-head-bg-color: #bbbbbb; } diff --git a/packages/theme/src/user-link/vars.less b/packages/theme/src/user-link/vars.less index 4c96f6776a..810e9f25bc 100644 --- a/packages/theme/src/user-link/vars.less +++ b/packages/theme/src/user-link/vars.less @@ -11,8 +11,8 @@ */ .component-css-vars-user-link() { - --ti-user-link-font-size: var(--ti-common-font-size-base, 12px); - --ti-user-link-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-user-link-font-size: var(--ti-common-font-size-base, 14px); + --ti-user-link-text-color: var(--ti-common-color-info-normal, #191919); --ti-user-link-font-weight: var(--ti-common-font-weight-7, bold); - --ti-user-link-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-user-link-border-radius: var(--ti-common-border-radius-normal, 6px); } diff --git a/packages/theme/src/user/vars.less b/packages/theme/src/user/vars.less index 21c896d707..ee21a53f8a 100644 --- a/packages/theme/src/user/vars.less +++ b/packages/theme/src/user/vars.less @@ -11,7 +11,7 @@ */ .component-css-vars-user() { - --ti-user-font-size: var(--ti-common-font-size-base, 12px); - --ti-user-tag-bg-color: var(--ti-common-color-hover-background, #f2f5fc); - --ti-user-svg-text-color: var(--ti-base-color-brand-6, #5e7ce0); + --ti-user-font-size: var(--ti-common-font-size-base, 14px); + --ti-user-tag-bg-color: var(--ti-common-color-hover-background, #f5f5f5); + --ti-user-svg-text-color: var(--ti-base-color-brand-6, #191919); } diff --git a/packages/theme/src/wizard/vars.less b/packages/theme/src/wizard/vars.less index acfaf9389e..88388d15d7 100644 --- a/packages/theme/src/wizard/vars.less +++ b/packages/theme/src/wizard/vars.less @@ -12,65 +12,65 @@ .component-css-vars-wizard() { // 横向流程图默认字号(不含基础插槽) - --ti-wizard-font-size: var(--ti-common-font-size-base, 12px); + --ti-wizard-font-size: var(--ti-common-font-size-base, 14px); // 节点文本色|图标色 - --ti-wizard-icon-color: var(--ti-common-color-bg-emphasize); + --ti-wizard-icon-color: var(--ti-common-color-bg-emphasize, #191919); // 未完成节点文本色|图标色 - --ti-wizard-normal-icon-color: var(--ti-common-color-text-disabled); + --ti-wizard-normal-icon-color: var(--ti-common-color-text-disabled, #c2c2c2); // 时间线流程图节点两侧文本色 - --ti-wizard-text-color: var(--ti-common-color-info-normal, #252b3a); + --ti-wizard-text-color: var(--ti-common-color-info-normal, #191919); // 时间线流程图节点右侧文字悬浮圆角 - --ti-wizard-detail-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-wizard-detail-border-radius: var(--ti-common-border-radius-normal, 6px); // 时间线流程图节点右侧文字悬浮背景色 - --ti-wizard-detail-bg-color: var(--ti-common-color-warning-normal, #fa9841); + --ti-wizard-detail-bg-color: var(--ti-common-color-warning-normal, #ff8800); // 已完成的节点和线条背景色 - --ti-wizard-icon-bg-color: var(--ti-common-color-light); + --ti-wizard-icon-bg-color: var(--ti-common-color-light, #ffffff); // 已完成的节点边框色 - --ti-wizard-icon-border-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-wizard-icon-border-color: var(--ti-common-color-bg-emphasize, #191919); // 节点下方文本色 - --ti-wizard-node-text-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-wizard-node-text-color: var(--ti-common-color-bg-emphasize, #191919); // 节点尺寸 - --ti-wizard-node-size: var(--ti-common-font-size-6); + --ti-wizard-node-size: var(--ti-common-font-size-6, 32px); // 节点线高度 - --ti-wizard-lines-height: var(--ti-common-border-weight-normal); + --ti-wizard-lines-height: var(--ti-common-border-weight-normal, 1px); // 节点线宽度 - --ti-wizard-lines-width: var(--ti-common-size-width-minor); + --ti-wizard-lines-width: var(--ti-common-size-width-minor, 30px); // 节点线左右外边距 - --ti-wizard-lines-margin-horizontal: var(--ti-common-dropdown-gap); + --ti-wizard-lines-margin-horizontal: var(--ti-common-dropdown-gap, 4px); // 第一条节点线颜色 - --ti-wizard-first-lines-bg-color: var(--ti-common-color-transparent); + --ti-wizard-first-lines-bg-color: var(--ti-common-color-transparent, transparent); // 节点线颜色 - --ti-wizard-lines-bg-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-wizard-lines-bg-color: var(--ti-common-color-bg-emphasize, #191919); // 未完成节点线背景色 - --ti-wizard-lines-normal-bg-color: var(--ti-common-color-line-disabled); + --ti-wizard-lines-normal-bg-color: var(--ti-common-color-line-disabled, #dbdbdb); // 时间线节点线颜色 - --ti-wizard-time-lines-bg-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-wizard-time-lines-bg-color: var(--ti-common-color-bg-emphasize, #191919); // 时间线最后一条节点线颜色 - --ti-wizard-time-last-lines-bg-color: var(--ti-common-color-bg-emphasize); + --ti-wizard-time-last-lines-bg-color: var(--ti-common-color-bg-emphasize, #191919); // 最后一条节点线颜色 - --ti-wizard-last-lines-bg-color: var(--ti-common-color-transparent); + --ti-wizard-last-lines-bg-color: var(--ti-common-color-transparent, transparent); // 未完成的节点背景色 - --ti-wizard-chart-icon-bg-color: var(--ti-common-color-bg-light-normal); + --ti-wizard-chart-icon-bg-color: var(--ti-common-color-bg-light-normal, #f0f0f0); // doing节点右侧线背景色 - --ti-wizard-right-lines-doing-bg-color: var(--ti-common-color-line-disabled); + --ti-wizard-right-lines-doing-bg-color: var(--ti-common-color-line-disabled, #dbdbdb); // doing节点下方字重 - --ti-wizard-node-doing-font-weight: var(--ti-common-font-weight-bold); + --ti-wizard-node-doing-font-weight: var(--ti-common-font-weight-bold, 600); // 未完成节点边框色 - --ti-wizard-lines-normal-border-color: var(--ti-common-color-line-disabled, #5c6173); + --ti-wizard-lines-normal-border-color: var(--ti-common-color-line-disabled, #dbdbdb); // 未完成节点边框厚度 - --ti-wizard-lines-normal-border-weight: var(--ti-common-border-weight-normal); + --ti-wizard-lines-normal-border-weight: var(--ti-common-border-weight-normal, 1px); // 节点标题上外边距 - --ti-wizard-node-title-margin-top: var(--ti-common-dropdown-gap); + --ti-wizard-node-title-margin-top: var(--ti-common-dropdown-gap, 4px); // 页向导模式按钮组上外边距 - --ti-wizard-button-group-margin-top: calc(var(--ti-common-space-base) * 9); + --ti-wizard-button-group-margin-top: calc(var(--ti-common-space-base, 4px) * 9); // 页向导模式按钮左外边距 - --ti-wizard-button-margin-left: var(--ti-common-space-3x); + --ti-wizard-button-margin-left: var(--ti-common-space-3x, 12px); // 页向导模式按钮组上对齐方式(hide) --ti-wizard-button-group-text-align: left; // 垂直模式线条宽度 - --ti-wizard-vertical-line-width: var(--ti-common-border-weight-normal); + --ti-wizard-vertical-line-width: var(--ti-common-border-weight-normal, 1px); // 垂直模式线条高度 - --ti-wizard-vertical-line-height: var(--ti-common-line-height-8); + --ti-wizard-vertical-line-height: var(--ti-common-line-height-8, 60px); // 垂直模式图标定位模式(hide) --ti-wizard-vertical-icon-position: absolute; // 垂直模式文件外边距(hide) @@ -84,55 +84,55 @@ // 垂直模式节点文字左外边距 --ti-wizard-vertical-text-margin-left: 21.5px; // 垂直模式节点描述文字上外边距 - --ti-wizard-vertical-desc-margin-top: var(--ti-common-space-0); + --ti-wizard-vertical-desc-margin-top: var(--ti-common-space-0, 0px); // 垂直模式节点标题文字行高 - --ti-wizard-vertical-title-line-height: var(--ti-common-line-height-number); + --ti-wizard-vertical-title-line-height: var(--ti-common-line-height-number, 1.5); // 垂直模式节点标题字号 --ti-wizard-vertical-title-font-size: var(--ti-common-font-size-1, 14px); // 垂直模式节点描述字号 - --ti-wizard-vertical-desc-font-size: var(--ti-common-font-size-0); + --ti-wizard-vertical-desc-font-size: var(--ti-common-font-size-0, 12px); // 垂直模式节点描述文本色 - --ti-wizard-vertical-desc-text-color: var(--ti-common-color-text-weaken); + --ti-wizard-vertical-desc-text-color: var(--ti-common-color-text-weaken, #808080); // 垂直模式未完成节点描述文本色 - --ti-wizard-vertical-wait-desc-text-color: var(--ti-common-color-bg-emphasize); + --ti-wizard-vertical-wait-desc-text-color: var(--ti-common-color-bg-emphasize, #191919); // 时间线节点尺寸 - --ti-wizard-time-node-size: var(--ti-common-font-size-6); + --ti-wizard-time-node-size: var(--ti-common-font-size-6, 32px); // 时间线节点边框厚度 --ti-wizard-time-node-border-weight: 0; // 时间线节点内图标宽度 - --ti-wizard-time-node-icon-width: var(--ti-common-font-size-6); + --ti-wizard-time-node-icon-width: var(--ti-common-font-size-6, 32px); // 时间线节点内图标高度 - --ti-wizard-time-node-icon-height: var(--ti-common-font-size-6); + --ti-wizard-time-node-icon-height: var(--ti-common-font-size-6, 32px); // 时间线节点内图标色 - --ti-wizard-time-node-icon-color: var(--ti-common-color-bg-emphasize, #5e7ce0); + --ti-wizard-time-node-icon-color: var(--ti-common-color-bg-emphasize, #191919); // 时间线节点内图标背景色 - --ti-wizard-time-node-bg-color: var(--ti-common-color-light, #fff); + --ti-wizard-time-node-bg-color: var(--ti-common-color-light, #ffffff); // 时间线节点左侧日期最小宽度 - --ti-wizard-time-left-min-width: var(--ti-common-size-width-medium); + --ti-wizard-time-left-min-width: var(--ti-common-size-width-medium, 120px); // 时间线节点左侧日期右外边距 - --ti-wizard-time-left-margin-right: var(--ti-common-space-2x); + --ti-wizard-time-left-margin-right: var(--ti-common-space-2x, 8px); // 时间线节点左侧日期top定位(hide) --ti-wizard-time-left-position-top: -28px; // 时间线节点左侧时间top定位(hide) --ti-wizard-time-left-point-position-top: -15px; // 时间线节点左侧展开图标右外边距 - --ti-wizard-time-left-icon-margin-right: var(--ti-common-space-10); + --ti-wizard-time-left-icon-margin-right: var(--ti-common-space-10, 10px); // 时间线节点左侧展开图标色 - --ti-wizard-time-left-icon-color: var(--ti-common-color-icon-normal); + --ti-wizard-time-left-icon-color: var(--ti-common-color-icon-normal, #808080); // 时间线节点左侧日期图标左外边距 - --ti-wizard-time-left-icon-margin-left: var(--ti-common-space-2x); + --ti-wizard-time-left-icon-margin-left: var(--ti-common-space-2x, 8px); // 时间线节点左侧日期图标尺寸 - --ti-wizard-time-left-icon-size: var(--ti-common-font-size-2); + --ti-wizard-time-left-icon-size: var(--ti-common-font-size-2, 16px); // 时间线节点左侧文字行高 - --ti-wizard-time-left-line-height: var(--ti-common-line-height-number); + --ti-wizard-time-left-line-height: var(--ti-common-line-height-number, 1.5); // 时间线节点小圆点尺寸 - --ti-wizard-time-dot-size: var(--ti-common-size-3x); + --ti-wizard-time-dot-size: var(--ti-common-size-3x, 12px); // 时间线节点右侧文字对齐方式(hide) --ti-wizard-time-right-text-align: left; // 时间线节点右侧文字左外边距 --ti-wizard-time-right-margin-left: 15.5px; // 时间线节点右侧文字垂直内边距 - --ti-wizard-time-right-padding-vertical: var(--ti-common-space-0); + --ti-wizard-time-right-padding-vertical: var(--ti-common-space-0, 0px); // 时间线节点右侧标题底部外边距 - --ti-wizard-time-right-title-margin-bottom: var(--ti-common-space-0); + --ti-wizard-time-right-title-margin-bottom: var(--ti-common-space-0, 0px); } diff --git a/packages/theme/src/year-table/vars.less b/packages/theme/src/year-table/vars.less index 6423fb8abc..7b99c254b0 100644 --- a/packages/theme/src/year-table/vars.less +++ b/packages/theme/src/year-table/vars.less @@ -11,6 +11,6 @@ */ .component-css-vars-year-table() { - --ti-year-table-td-text-color: var(--ti-base-color-brand-7, #526ecc); + --ti-year-table-td-text-color: var(--ti-base-color-brand-7, #b3d6ff); --ti-year-table-td-icon-color: #303133; }