diff --git a/examples/sites/demos/pc/app/date-picker/custom-suffix-icon-composition-api.vue b/examples/sites/demos/pc/app/date-picker/custom-suffix-icon-composition-api.vue index bd5cf3c1a..6dd722e04 100644 --- a/examples/sites/demos/pc/app/date-picker/custom-suffix-icon-composition-api.vue +++ b/examples/sites/demos/pc/app/date-picker/custom-suffix-icon-composition-api.vue @@ -19,6 +19,6 @@ const IconMinus = iconMinus() } .my-date-picker { - background: #f0f0f0; + background: #a1a1a1; } diff --git a/examples/sites/demos/pc/app/date-picker/custom-suffix-icon.vue b/examples/sites/demos/pc/app/date-picker/custom-suffix-icon.vue index ed14913a9..840ac69fc 100644 --- a/examples/sites/demos/pc/app/date-picker/custom-suffix-icon.vue +++ b/examples/sites/demos/pc/app/date-picker/custom-suffix-icon.vue @@ -27,6 +27,6 @@ export default { } .my-date-picker { - background-color: #f0f0f0; + background-color: #a1a1a1; } diff --git a/examples/sites/demos/pc/app/milestone/custom-flag-composition-api.vue b/examples/sites/demos/pc/app/milestone/custom-flag-composition-api.vue index 06e2d2a4d..773c301bc 100644 --- a/examples/sites/demos/pc/app/milestone/custom-flag-composition-api.vue +++ b/examples/sites/demos/pc/app/milestone/custom-flag-composition-api.vue @@ -13,11 +13,11 @@ import { ref } from 'vue' import { TinyMilestone } from '@opentiny/vue' const statusMap = ref({ - completed: '#f0f7ff', - doing: '#e8faff', - back: '#edf7df', - end: '#faad14', - cancel: '#f230301A' + completed: '#1890ff', + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }) const milestoneData = ref([ { diff --git a/examples/sites/demos/pc/app/milestone/custom-flag.vue b/examples/sites/demos/pc/app/milestone/custom-flag.vue index 5b619c107..449e419a2 100644 --- a/examples/sites/demos/pc/app/milestone/custom-flag.vue +++ b/examples/sites/demos/pc/app/milestone/custom-flag.vue @@ -18,11 +18,11 @@ export default { data() { return { statusMap: { - completed: '#f0f7ff', - doing: '#e8faff', - back: '#edf7df', - end: '#faad14', - cancel: '#f230301A' + completed: '#1890ff', + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }, milestoneData: [ { diff --git a/examples/sites/demos/pc/app/milestone/data-field-mapping-composition-api.vue b/examples/sites/demos/pc/app/milestone/data-field-mapping-composition-api.vue index adf060cba..ee06256f0 100644 --- a/examples/sites/demos/pc/app/milestone/data-field-mapping-composition-api.vue +++ b/examples/sites/demos/pc/app/milestone/data-field-mapping-composition-api.vue @@ -20,11 +20,11 @@ import { ref } from 'vue' import { TinyMilestone } from '@opentiny/vue' const statusMap = ref({ - completed: '#f0f7ff', - doing: '#e8faff', - back: '#edf7df', - end: '#faad14', - cancel: '#f230301A' + completed: '#1890ff', + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }) const milestoneData = ref([ { diff --git a/examples/sites/demos/pc/app/milestone/data-field-mapping.vue b/examples/sites/demos/pc/app/milestone/data-field-mapping.vue index 4d43de09a..e24dab8de 100644 --- a/examples/sites/demos/pc/app/milestone/data-field-mapping.vue +++ b/examples/sites/demos/pc/app/milestone/data-field-mapping.vue @@ -25,11 +25,11 @@ export default { data() { return { statusMap: { - completed: '#f0f7ff', - doing: '#e8faff', - back: '#edf7df', - end: '#faad14', - cancel: '#f230301A' + completed: '#1890ff', + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }, milestoneData: [ { diff --git a/examples/sites/demos/pc/app/milestone/flag-before-composition-api.vue b/examples/sites/demos/pc/app/milestone/flag-before-composition-api.vue index 1076cf60a..ccface4d8 100644 --- a/examples/sites/demos/pc/app/milestone/flag-before-composition-api.vue +++ b/examples/sites/demos/pc/app/milestone/flag-before-composition-api.vue @@ -14,10 +14,10 @@ import { TinyMilestone, TinyButton } from '@opentiny/vue' const isBefore = ref(false) const statusMap = ref({ completed: 'var(--tv-color-bg-disabled-control-active)', // 组件库基础变量 - doing: '#9edb58', - back: '#c2c2c2', - end: '#edf7df', - cancel: '#f23030' + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }) const milestoneData = ref([ { diff --git a/examples/sites/demos/pc/app/milestone/flag-before.spec.ts b/examples/sites/demos/pc/app/milestone/flag-before.spec.ts index 7f845b03e..c0f26015a 100644 --- a/examples/sites/demos/pc/app/milestone/flag-before.spec.ts +++ b/examples/sites/demos/pc/app/milestone/flag-before.spec.ts @@ -12,8 +12,8 @@ test('旗子数据来源', async ({ page }) => { const flagAfterContents = [/引导用户按照流程完成任务/, /test7欢迎使用 vui/, /test8/, /test6/] const flagBeforeContents = [/test1已完成/, /引导用户按照流程完成任务/, /test7欢迎使用 vui/, /test8/] const button = page.getByRole('button').filter({ hasText: '设置 flag-before 值为 true' }) - const flagAfterLineColors = ['rgb(194, 194, 194)', 'rgb(194, 194, 194)', 'rgb(158, 219, 88)', 'rgb(179, 214, 255)'] - const flagBeforeLineColors = ['rgb(179, 214, 255)', 'rgb(194, 194, 194)', 'rgb(194, 194, 194)', 'rgb(158, 219, 88)'] + const flagAfterLineColors = ['rgb(147, 253, 166)', 'rgb(147, 253, 166)', 'rgb(134, 237, 255)', 'rgb(179, 214, 255)'] + const flagBeforeLineColors = ['rgb(179, 214, 255)', 'rgb(147, 253, 166)', 'rgb(147, 253, 166)', 'rgb(134, 237, 255)'] for (let i = 0; i < flagCount; i++) { const { x, y, width, height } = await flags.nth(i).boundingBox() diff --git a/examples/sites/demos/pc/app/milestone/flag-before.vue b/examples/sites/demos/pc/app/milestone/flag-before.vue index 675e6a2e1..bde9fd805 100644 --- a/examples/sites/demos/pc/app/milestone/flag-before.vue +++ b/examples/sites/demos/pc/app/milestone/flag-before.vue @@ -20,10 +20,10 @@ export default { isBefore: false, statusMap: { completed: 'var(--tv-color-bg-disabled-control-active)', // 组件库基础变量 - doing: '#9edb58', - back: '#c2c2c2', - end: '#edf7df', - cancel: '#f23030' + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }, milestoneData: [ { diff --git a/examples/sites/demos/pc/app/milestone/milestone-events-composition-api.vue b/examples/sites/demos/pc/app/milestone/milestone-events-composition-api.vue index d96a056d7..13ae9089b 100644 --- a/examples/sites/demos/pc/app/milestone/milestone-events-composition-api.vue +++ b/examples/sites/demos/pc/app/milestone/milestone-events-composition-api.vue @@ -14,11 +14,11 @@ import { ref } from 'vue' import { TinyMilestone, TinyNotify } from '@opentiny/vue' const statusMap = ref({ - completed: '#f0f7ff', - doing: '#e8faff', - back: '#edf7df', - end: '#faad14', - cancel: '#f230301A' + completed: '#1890ff', + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }) const milestoneData = ref([ { diff --git a/examples/sites/demos/pc/app/milestone/milestone-events.vue b/examples/sites/demos/pc/app/milestone/milestone-events.vue index 16c65b2ce..da4cf3b8d 100644 --- a/examples/sites/demos/pc/app/milestone/milestone-events.vue +++ b/examples/sites/demos/pc/app/milestone/milestone-events.vue @@ -19,11 +19,11 @@ export default { data() { return { statusMap: { - completed: '#f0f7ff', - doing: '#e8faff', - back: '#edf7df', - end: '#faad14', - cancel: '#f230301A' + completed: '#1890ff', + doing: '#86edff', + back: '#93fda6', + end: '#faad18', + cancel: '#f230305A' }, milestoneData: [ { diff --git a/examples/sites/demos/pc/app/milestone/show-number.spec.ts b/examples/sites/demos/pc/app/milestone/show-number.spec.ts index fc3f1818f..040dd9eee 100644 --- a/examples/sites/demos/pc/app/milestone/show-number.spec.ts +++ b/examples/sites/demos/pc/app/milestone/show-number.spec.ts @@ -22,11 +22,11 @@ test('序号显示', async ({ page }) => { ] const iconStyles = [ { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(179, 214, 255)', 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(179, 214, 255)', 'box-shadow': 'none' }, { @@ -34,15 +34,15 @@ test('序号显示', async ({ page }) => { 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(217, 217, 217)', 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(245, 34, 45)', 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(250, 173, 20)', 'box-shadow': 'none' } ] diff --git a/examples/sites/demos/pc/app/milestone/solid-style.spec.ts b/examples/sites/demos/pc/app/milestone/solid-style.spec.ts index ba4d19989..e7fc72f4f 100644 --- a/examples/sites/demos/pc/app/milestone/solid-style.spec.ts +++ b/examples/sites/demos/pc/app/milestone/solid-style.spec.ts @@ -22,11 +22,11 @@ test('实心显示', async ({ page }) => { ] const iconStyles = [ { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(179, 214, 255)', 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(179, 214, 255)', 'box-shadow': 'none' }, { @@ -34,15 +34,15 @@ test('实心显示', async ({ page }) => { 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(217, 217, 217)', 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(245, 34, 45)', 'box-shadow': 'none' }, { - 'color': 'rgb(25, 25, 25)', + 'color': 'rgb(250, 173, 20)', 'box-shadow': 'none' } ] diff --git a/examples/sites/demos/pc/app/mind-map/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/mind-map/basic-usage-composition-api.vue index a5a5975e8..4d068017c 100644 --- a/examples/sites/demos/pc/app/mind-map/basic-usage-composition-api.vue +++ b/examples/sites/demos/pc/app/mind-map/basic-usage-composition-api.vue @@ -6,9 +6,15 @@ import { TinyMindMap } from '@opentiny/vue' - diff --git a/examples/sites/demos/pc/app/mind-map/basic-usage.vue b/examples/sites/demos/pc/app/mind-map/basic-usage.vue index 31e61452b..749fd8017 100644 --- a/examples/sites/demos/pc/app/mind-map/basic-usage.vue +++ b/examples/sites/demos/pc/app/mind-map/basic-usage.vue @@ -12,9 +12,15 @@ export default { } - diff --git a/examples/sites/demos/pc/app/mind-map/event-composition-api.vue b/examples/sites/demos/pc/app/mind-map/event-composition-api.vue index 60a68950a..18b2b2fec 100644 --- a/examples/sites/demos/pc/app/mind-map/event-composition-api.vue +++ b/examples/sites/demos/pc/app/mind-map/event-composition-api.vue @@ -85,9 +85,15 @@ const onExpandNode = () => { } - diff --git a/examples/sites/demos/pc/app/mind-map/event.vue b/examples/sites/demos/pc/app/mind-map/event.vue index 4b2a926ef..a8c512fca 100644 --- a/examples/sites/demos/pc/app/mind-map/event.vue +++ b/examples/sites/demos/pc/app/mind-map/event.vue @@ -98,9 +98,15 @@ export default { } - diff --git a/examples/sites/demos/pc/app/mind-map/export-data-composition-api.vue b/examples/sites/demos/pc/app/mind-map/export-data-composition-api.vue index a15c82025..e5dec37b8 100644 --- a/examples/sites/demos/pc/app/mind-map/export-data-composition-api.vue +++ b/examples/sites/demos/pc/app/mind-map/export-data-composition-api.vue @@ -97,10 +97,15 @@ const clearData = () => { } - diff --git a/examples/sites/demos/pc/app/mind-map/export-data.vue b/examples/sites/demos/pc/app/mind-map/export-data.vue index b2fb4041f..27480cd1d 100644 --- a/examples/sites/demos/pc/app/mind-map/export-data.vue +++ b/examples/sites/demos/pc/app/mind-map/export-data.vue @@ -110,10 +110,15 @@ export default { } - diff --git a/examples/sites/demos/pc/app/wizard/base-usage.spec.ts b/examples/sites/demos/pc/app/wizard/base-usage.spec.ts index 9c49c2c2b..56c7aa8c6 100644 --- a/examples/sites/demos/pc/app/wizard/base-usage.spec.ts +++ b/examples/sites/demos/pc/app/wizard/base-usage.spec.ts @@ -36,7 +36,7 @@ test('基本用法', async ({ page }) => { await expect(middle).toHaveCSS('background-color', 'rgb(255, 255, 255)') } else { await expect(first).toHaveCSS('background-color', 'rgb(219, 219, 219)') - await expect(middle).toHaveCSS('background-color', 'rgb(240, 240, 240)') + await expect(middle).toHaveCSS('background-color', 'rgb(245, 245, 245)') } } }) diff --git a/examples/sites/demos/pc/app/wizard/vertical.spec.ts b/examples/sites/demos/pc/app/wizard/vertical.spec.ts index c8adeaea6..07b6aa9ad 100644 --- a/examples/sites/demos/pc/app/wizard/vertical.spec.ts +++ b/examples/sites/demos/pc/app/wizard/vertical.spec.ts @@ -22,7 +22,7 @@ test('垂直流程图', async ({ page }) => { if (i === 4) { await expect(nodeLines.nth(i)).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)') - await expect(nodeIcons.nth(i)).toHaveCSS('background-color', 'rgb(240, 240, 240)') + await expect(nodeIcons.nth(i)).toHaveCSS('background-color', 'rgb(245, 245, 245)') } else if (i === 3) { await expect(nodeLines.nth(i)).toHaveCSS('background-color', 'rgb(219, 219, 219)') await expect(nodeIcons.nth(i)).toHaveCSS('background-color', 'rgb(255, 255, 255)') diff --git a/packages/renderless/src/picker/index.ts b/packages/renderless/src/picker/index.ts index 5772daffe..5e9fef857 100644 --- a/packages/renderless/src/picker/index.ts +++ b/packages/renderless/src/picker/index.ts @@ -940,10 +940,10 @@ export const handleClose = } export const handleFocus = - ({ emit, vm, state, api }) => + ({ emit, vm, state, api, props }) => () => { const type = state.type - if (state.pickerDisabled) { + if (props.readonly || state.pickerDisabled) { return } diff --git a/packages/renderless/src/picker/vue.ts b/packages/renderless/src/picker/vue.ts index 27b94a8c4..61a010e31 100644 --- a/packages/renderless/src/picker/vue.ts +++ b/packages/renderless/src/picker/vue.ts @@ -190,7 +190,7 @@ const initApi = ({ api, props, hooks, state, vnode, others, utils, parent }) => hidePicker: hidePicker({ destroyPopper, state }), handleSelectChange: ({ tz, date }) => !state.ranged && emit('select-change', { tz, date }), getPanel: getPanel(others), - handleFocus: handleFocus({ emit, vm, state, api }), + handleFocus: handleFocus({ emit, vm, state, api, props }), getTimezone: getTimezone({ props, utils }), emitChange: emitChange({ api, dispatch, emit, props, state }), parsedValue: parsedValue({ api, props, state, t }), diff --git a/packages/theme/src/date-table/vars.less b/packages/theme/src/date-table/vars.less index 085efa2ec..d5b73f885 100644 --- a/packages/theme/src/date-table/vars.less +++ b/packages/theme/src/date-table/vars.less @@ -69,7 +69,7 @@ // 单元格宽度度 --tv-DateTable-td-div-width: 28px; // 单元格顶部间距 - --tv-DateTable-td-span-top: 3px; + --tv-DateTable-td-span-top: 4px; // 开始日期圆角 --tv-DateTable-start-date-border-radius: var(--tv-border-radius-brand, 999px); // 选中日期圆角 @@ -80,4 +80,4 @@ --tv-DateTable-td-border-radius-disabled: var(--tv-border-radius-brand, 999px); // 星期行高 --tv-DateTable-week-height: var(--tv-size-height-md, 32px); -} +} \ No newline at end of file diff --git a/packages/theme/src/steps/index.less b/packages/theme/src/steps/index.less index f7afbfafc..fccd60b0e 100644 --- a/packages/theme/src/steps/index.less +++ b/packages/theme/src/steps/index.less @@ -226,7 +226,7 @@ } &.fault { - .block-status-mixin(var(--tv-Steps-advance-node-error-bg-color), var(--tv-Steps-advance-node-error-bg-color-hover),var(--tv-Steps-advance-node-error-bg-color)); + .block-status-mixin(var(--tv-Steps-advance-node-error-bg-color), var(--tv-Steps-advance-node-error-bg-color-hover), var(--tv-Steps-advance-node-error-bg-color)); color: var(--tv-Steps-advance-error-icon-color); .@{steps-prefix-cls}-text-name { @@ -236,11 +236,11 @@ &.disabled { cursor: not-allowed; - color: var(--tv-color-icon-inverse-disabled); + color: var(--tv-Steps-advance-node-disable-icon-color); .block-status-mixin(var(--tv-Steps-advance-node-disable-bg-color), var(--tv-Steps-advance-node-disable-bg-color-hover), var(--tv-Steps-advance-node-disable-bg-color-active)); .@{steps-prefix-cls}-icon { - border: 1px solid var(--tv-color-icon-inverse-disabled); + border: 1px solid var(--tv-Steps-advance-node-disable-icon-color); } } } @@ -266,6 +266,7 @@ height: 16px; margin-right: 8px; display: flex; + font-size: 12px; flex: none; align-items: center; justify-content: center; @@ -361,13 +362,13 @@ height: 48px; &:after { - border-top-width: 24px; - border-bottom-width: 24px; + border-top-width: 23px; + border-bottom-width: 23px; } &:before { - border-top-width: 24px; - border-bottom-width: 24px; + border-top-width: 23px; + border-bottom-width: 23px; } .@{steps-prefix-cls}-content { @@ -517,7 +518,6 @@ z-index: 10; border: 1px solid var(--tv-Steps-node-border-color); border-radius: 50%; - background-color: var(--tv-Steps-node-icon-bg-color); } } } @@ -542,7 +542,6 @@ .@{steps-prefix-cls}-icon { font-size: 14px; border-radius: 9999px; - background-color: var(--tv-Steps-node-icon-bg-color); color: var(--tv-Steps-unselected-icon-color); &:hover { @@ -769,7 +768,7 @@ } &.not-vertical { - margin-top: 10px; + margin-top: 8px; } } @@ -878,7 +877,6 @@ flex: none; border-radius: 9999px; border: 1px solid var(--tv-Steps-line-bg-color); - background-color: var(--tv-Steps-node-icon-bg-color); font-weight: 500; position: absolute; } @@ -1165,13 +1163,13 @@ } } &.icon-success { - .timeline-icon-status-mixin( none, var(--tv-Steps-node-done-border-color),var(--tv-Steps-done-icon-color)); + .timeline-icon-status-mixin(none, var(--tv-Steps-node-done-border-color), var(--tv-Steps-done-icon-color)); } &.icon-warning { .timeline-icon-status-mixin(var(--tv-Steps-warning-icon-bg-color), var(--tv-Steps-warning-icon-bg-color), var(--tv-Steps-warning-icon-color)); } &.icon-error { - .timeline-icon-status-mixin( none, var(--tv-Steps-error-border-color),var(--tv-Steps-error-icon-color)); + .timeline-icon-status-mixin(none, var(--tv-Steps-error-border-color), var(--tv-Steps-error-icon-color)); } .fixicon, diff --git a/packages/theme/src/steps/vars.less b/packages/theme/src/steps/vars.less index 37840d491..afe30b020 100644 --- a/packages/theme/src/steps/vars.less +++ b/packages/theme/src/steps/vars.less @@ -55,8 +55,8 @@ --tv-Steps-line-bg-color: var(--tv-color-border-divider, #f0f0f0); // 未完成节点的背景色 --tv-Steps-node-icon-bg-color: var(--tv-color-bg-dark, #ffffff); - // 未完成节点序号图标色 - --tv-Steps-unselected-icon-color: var(--tv-color-icon, #808080); + // 未完成节点序号图标文本色 + --tv-Steps-unselected-icon-color: var(--tv-color-text-weaken, #808080); // 未完成节点边框色 --tv-Steps-node-border-color: var(--tv-color-border-divider-short, #dbdbdb); // 未完成节点内容文本色 @@ -108,8 +108,7 @@ // 高级向导异常节点图标色 --tv-Steps-advance-error-icon-color: var(--tv-color-error-icon, #f23030); // 高级向导禁用节点文本以及图标色 - --tv-Steps-advance-node-disable-text-color: var(--tv-color-icon-inverse-disabled, #fff); - --tv-Steps-advance-node-disable-icon-color: var(--tv-color-icon-inverse-disabled, #fff); + --tv-Steps-advance-node-disable-icon-color: var(--tv-color-icon, #808080); // 高级向导禁用节点背景色 --tv-Steps-advance-node-disable-bg-color: var(--tv-color-bg-disabled-control-unactive, #dbdbdb); // 高级向导禁用节点悬浮背景色 diff --git a/packages/theme/src/tabs/index.less b/packages/theme/src/tabs/index.less index 69f48bb13..621d383d4 100644 --- a/packages/theme/src/tabs/index.less +++ b/packages/theme/src/tabs/index.less @@ -46,6 +46,7 @@ justify-content: space-between; .@{tabs-prefix-cls} { + // 活跃块 &__active-bar { position: absolute; @@ -607,7 +608,6 @@ &:hover { color: var(--tv-Tabs-button-card-item-hover-text-color); - font-weight: var(--tv-Tabs-button-card-font-weight); } &.is-active { diff --git a/packages/theme/src/tabs/vars.less b/packages/theme/src/tabs/vars.less index 1b4f09035..2c87bb590 100644 --- a/packages/theme/src/tabs/vars.less +++ b/packages/theme/src/tabs/vars.less @@ -38,7 +38,7 @@ // card类型(无size属性)标签项高度 --tv-Tabs-height: var(--tv-size-height-xl, 48px); // card类型未选中项文本色 - --tv-Tabs-header-font-normal-text-color: var(--tv-color-text, #191919); + --tv-Tabs-header-font-normal-text-color: var(--tv-color-text-secondary, #595959); // 分隔符类型未选中项文本色 --tv-Tabs-header-separator-normal-text-color: var(--tv-color-text-secondary, #595959); // 分隔符高度(new) @@ -84,7 +84,7 @@ // bordercard类型非选中项文本色 --tv-Tabs-dark-text-color: var(--tv-color-text-disabled, #c2c2c2); // bordercard类型标签项上外边距 - --tv-Tabs-dark-margin-top: 5px; + --tv-Tabs-dark-margin-top: 4px; // bordercard类型首个标签项左外边距 --tv-Tabs-dark-first-margin-left: 20px; // bordercard类型标签栏边框厚度 @@ -150,15 +150,15 @@ // buttoncard类型选项文本色 --tv-Tabs-button-card-item-text-color: var(--tv-color-text-secondary, #595959); // buttoncard类型选项悬浮文本色 - --tv-Tabs-button-card-item-hover-text-color: #191919; + --tv-Tabs-button-card-item-hover-text-color: var(--tv-color-text-hover, #191919); // buttoncard类型选项字号 --tv-Tabs-button-card-item-font-size: var(--tv-font-size-default, 14px); // buttoncard类型选项高度 --tv-Tabs-button-card-item-height: var(--tv-size-height-md, 32px); // buttoncard类型选中项背景色 - --tv-Tabs-button-card-item-active-bg-color: var(--tv-color-bg-active-emphasize-1, #ffffff); + --tv-Tabs-button-card-item-active-bg-color: var(--tv-color-bg-inverse-tint-1, #ffffff); // buttoncard类型选中项文本色 - --tv-Tabs-button-card-item-active-text-color: var(--tv-color-act-primary-text, #191919); + --tv-Tabs-button-card-item-active-text-color: var(--tv-color-text, #191919); // buttoncard类型选中项边框色 --tv-Tabs-button-card-item-active-border-color: var(--tv-color-border-active, #191919); // buttoncard类型圆角 @@ -167,4 +167,4 @@ --tv-Tabs-button-card-title-padding-horizontal: 24px; // buttoncard类型字重 --tv-Tabs-button-card-font-weight: var(--tv-font-weight-bold, bold); -} +} \ No newline at end of file diff --git a/packages/theme/src/upload-list/index.less b/packages/theme/src/upload-list/index.less index 31d5aa245..4cfb156f2 100644 --- a/packages/theme/src/upload-list/index.less +++ b/packages/theme/src/upload-list/index.less @@ -468,6 +468,7 @@ &:hover { opacity: 1; + background-color: var(--tv-UploadList-picture-card-item-bg-color-hover); span { display: inline-block; @@ -635,9 +636,10 @@ margin-right: 8px; border: 1px solid #dfdfdf; border-radius: 4px; + background-color: var(--tv-UploadList-bg-color); &:hover { - background-color: #f5f6f8; + background-color: var(--tv-UploadList-bg-color-hover); .operate-panel { visibility: visible; @@ -744,7 +746,6 @@ margin-right: 24px; font-size: 12px; line-height: 12px; - color: #191919; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/packages/theme/src/upload-list/vars.less b/packages/theme/src/upload-list/vars.less index b7fafe91e..d169f5427 100644 --- a/packages/theme/src/upload-list/vars.less +++ b/packages/theme/src/upload-list/vars.less @@ -29,6 +29,10 @@ --tv-UploadList-svg-close-icon-color: var(--tv-color-icon); // 上传文件列表项右侧悬浮图标色 --tv-UploadList-svg-close-hover-icon-color: var(--tv-color-icon-hover); + // 上传文件列表项悬浮背景色 + --tv-UploadList-bg-color: var(--tv-color-bg); + // 上传文件列表项悬浮背景色hover + --tv-UploadList-bg-color-hover: var(--tv-color-bg-hover-secondary); // 上传文件列表项图标尺寸 --tv-UploadList-svg-icon-font-size: var(--tv-icon-size); // 上传文件列表项成功图标尺寸 @@ -37,6 +41,8 @@ --tv-UploadList-picture-card-item-border-color: var(--tv-color-border); // 照片墙上传列表项背景色 --tv-UploadList-picture-card-item-bg-color: var(--tv-color-bg-secondary); + // 照片墙上传列表项背景色hover + --tv-UploadList-picture-card-item-bg-color-hover: var(--tv-color-bg-mask); // 照片墙上传列表项右上角图标填充色 --tv-UploadList-picture-card-item-icon-color: var(--tv-color-icon-inverse); // 上传列表项成功状态图标色或背景色 diff --git a/packages/theme/src/upload/index.less b/packages/theme/src/upload/index.less index e3e1e6c1b..e42ca8236 100644 --- a/packages/theme/src/upload/index.less +++ b/packages/theme/src/upload/index.less @@ -134,7 +134,7 @@ } .prompt-tip { - fill: #aeaeae; + fill: var(--tv-Upload-tip-text-color); margin-left: 8px; line-height: 30px; } diff --git a/packages/theme/src/wizard/index.less b/packages/theme/src/wizard/index.less index 30b714809..28dc7b17c 100644 --- a/packages/theme/src/wizard/index.less +++ b/packages/theme/src/wizard/index.less @@ -142,7 +142,7 @@ &__chart-name { position: relative; - top: -5px; + top: -15px; transform: translateY(-50%); margin-left: var(--tv-Wizard-vertical-text-margin-left); display: inline-flex;