diff --git a/examples/sites/demos/pc/app/image/lazy-composition-api.vue b/examples/sites/demos/pc/app/image/lazy-composition-api.vue index 5ea65399be..f0901be369 100644 --- a/examples/sites/demos/pc/app/image/lazy-composition-api.vue +++ b/examples/sites/demos/pc/app/image/lazy-composition-api.vue @@ -23,7 +23,6 @@ const srcList = ref([ .demo-image__lazy { height: 300px; overflow-y: auto; - background-color: #f5f5f5; } .demo-image__lazy .tiny-image { display: block; diff --git a/examples/sites/demos/pc/app/image/lazy.vue b/examples/sites/demos/pc/app/image/lazy.vue index 2ab416305b..c8158b2424 100644 --- a/examples/sites/demos/pc/app/image/lazy.vue +++ b/examples/sites/demos/pc/app/image/lazy.vue @@ -31,7 +31,6 @@ export default { .demo-image__lazy { height: 300px; overflow-y: auto; - background-color: #f5f5f5; } .demo-image__lazy .tiny-image { display: block; diff --git a/examples/sites/demos/pc/app/loading/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/loading/basic-usage-composition-api.vue index 99597f2159..13449ac401 100644 --- a/examples/sites/demos/pc/app/loading/basic-usage-composition-api.vue +++ b/examples/sites/demos/pc/app/loading/basic-usage-composition-api.vue @@ -26,7 +26,6 @@ onMounted(() => { #tiny-basic-loading1 { width: 100%; height: 120px; - border: 1px solid beige; margin-top: 10px; } diff --git a/examples/sites/demos/pc/app/loading/basic-usage.vue b/examples/sites/demos/pc/app/loading/basic-usage.vue index 30874c434d..fb68ca2297 100644 --- a/examples/sites/demos/pc/app/loading/basic-usage.vue +++ b/examples/sites/demos/pc/app/loading/basic-usage.vue @@ -34,7 +34,6 @@ export default { #tiny-basic-loading1 { width: 100%; height: 120px; - border: 1px solid beige; margin-top: 10px; } diff --git a/examples/sites/demos/pc/app/milestone/basic-usage.spec.ts b/examples/sites/demos/pc/app/milestone/basic-usage.spec.ts index 5d32720692..40e4dd4508 100644 --- a/examples/sites/demos/pc/app/milestone/basic-usage.spec.ts +++ b/examples/sites/demos/pc/app/milestone/basic-usage.spec.ts @@ -24,11 +24,11 @@ test('基本用法', async ({ page }) => { ] const iconStyles = [ { - 'color': 'rgb(24, 144, 255)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(24, 144, 255)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { @@ -36,15 +36,15 @@ test('基本用法', async ({ page }) => { 'box-shadow': 'none' }, { - 'color': 'rgba(242, 48, 48, 0.1)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(237, 247, 223)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(250, 173, 20)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' } ] 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 040dd9eeee..fc3f1818ff 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(179, 214, 255)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(179, 214, 255)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { @@ -34,15 +34,15 @@ test('序号显示', async ({ page }) => { 'box-shadow': 'none' }, { - 'color': 'rgb(217, 217, 217)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(245, 34, 45)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(250, 173, 20)', + 'color': 'rgb(25, 25, 25)', '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 e7fc72f4fa..ba4d19989f 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(179, 214, 255)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(179, 214, 255)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { @@ -34,15 +34,15 @@ test('实心显示', async ({ page }) => { 'box-shadow': 'none' }, { - 'color': 'rgb(217, 217, 217)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(245, 34, 45)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' }, { - 'color': 'rgb(250, 173, 20)', + 'color': 'rgb(25, 25, 25)', 'box-shadow': 'none' } ] diff --git a/packages/renderless/src/milestone/index.ts b/packages/renderless/src/milestone/index.ts index 255b9f7058..76c644710c 100644 --- a/packages/renderless/src/milestone/index.ts +++ b/packages/renderless/src/milestone/index.ts @@ -75,10 +75,7 @@ export const getMileIcon = if (statusColor) { return { 'background-color': props.solid || status === constants.STATUS_MAP.DOING ? statusColor : '', - color: (props.solid - && status !== constants.STATUS_MAP.COMPLETED - || status === constants.STATUS_MAP.DOING) - ? '#FFFFFF' : statusColor, + // color: props.solid && status !== constants.STATUS_MAP.COMPLETED ? '#191919' : statusColor, 'border-color': statusColor, boxShadow: 'unset' } diff --git a/packages/theme/src/calendar-view/index.less b/packages/theme/src/calendar-view/index.less index 2dc1cb97eb..42d2c3e945 100644 --- a/packages/theme/src/calendar-view/index.less +++ b/packages/theme/src/calendar-view/index.less @@ -21,9 +21,10 @@ width: 100%; height: auto; padding-top: var(--tv-CalendarView-padding); - border: 1px solid #ebebeb; + border: 1px solid var(--tv-CalendarView-date-border-color); background-color: var(--tv-CalendarView-bg-color); overflow: auto; + border-bottom: none; &__header { display: flex; @@ -49,7 +50,7 @@ height: 32px; &:hover { - background-color: #ededed; + background-color: var(--tv-CalendarView-radio-icon-hover-color); } svg { @@ -124,7 +125,7 @@ &__main { width: 100%; overflow: hidden; - border-top: 1px solid #ebebeb; + border-top: 1px solid var(--tv-CalendarView-date-border-color); .main-container { width: 100%; @@ -135,7 +136,7 @@ width: 100%; display: flex; justify-content: space-around; - border-bottom: 1px solid #ebebeb; + border-bottom: 1px solid var(--tv-CalendarView-date-border-color); > li { font-size: var(--tv-CalendarView-main-li-font-size); @@ -143,7 +144,7 @@ position: relative; height: 80px; overflow: hidden; - border-right: 1px solid #ebebeb; + border-right: 1px solid var(--tv-CalendarView-date-border-color); background-color: var(--tv-CalendarView-main-li-bg-color); &.is-selected { @@ -184,6 +185,10 @@ } } + ul li:last-of-type { + border-right: none; + } + .day-selected { position: absolute; top: 0; diff --git a/packages/theme/src/calendar-view/vars.less b/packages/theme/src/calendar-view/vars.less index d50d592a04..38ff83afd8 100644 --- a/packages/theme/src/calendar-view/vars.less +++ b/packages/theme/src/calendar-view/vars.less @@ -20,8 +20,9 @@ // radio 文本色、背景色、悬浮色 --tv-CalendarView-radio-font-size: var(--tv-font-size-lg); --tv-CalendarView-radio-icon-color: var(--tv-color-icon); + --tv-CalendarView-radio-icon-hover-color: var(--tv-color-bg); --tv-CalendarView-radio-active-icon-color: var(--tv-color-text-control); - --tv-CalendarView-radio-active-inner-bg-color: var(--tv-color-bg-inverse); + --tv-CalendarView-radio-active-inner-bg-color: var(--tv-color-bg-3, #fff); --tv-CalendarView-radio-active-border-color: var(--tv-color-border-active); --tv-CalendarView-header-main-font-size: var(--tv-font-size-default); --tv-CalendarView-header-main-text-color: var(--tv-color-text-weaken); @@ -31,6 +32,7 @@ --tv-CalendarView-main-li-font-size: var(--tv-font-size-default); --tv-CalendarView-date-margin-left: var(--tv-space-xl); --tv-CalendarView-date-text-color: var(--tv-color-text); + --tv-CalendarView-date-border-color: var(--tv-color-border); --tv-CalendarView-date-weaken-text-color: var(--tv-color-text-weaken); --tv-CalendarView-main-li-padding: var(--tv-space-xs); --tv-CalendarView-main-li-bg-color: var(--tv-color-bg-secondary); diff --git a/packages/theme/src/milestone/vars.less b/packages/theme/src/milestone/vars.less index 7e3fcf717c..291b6ec0ad 100644 --- a/packages/theme/src/milestone/vars.less +++ b/packages/theme/src/milestone/vars.less @@ -62,13 +62,13 @@ // 旗子圆角 --tv-Milestone-flag-border-radius: 0 var(--tv-border-radius-lg, 8px) var(--tv-border-radius-lg, 8px) 0; // 旗子文本色 - --tv-Milestone-text-color: var(--tv-color-text-active-1, #191919); + --tv-Milestone-text-color: var(--tv-color-text-inverse-black, #191919); // 旗子背景色 --tv-Milestone-flag-bg-color: var(--tv-color-bg, #f5f5f5); // 旗子标题字重 --tv-Milestone-flag-name-font-weight: var(--tv-font-weight-bold, 600); // 旗子描述文本色 - --tv-Milestone-flag-desc-text-color: var(--tv-color-text-active-1, #191919); + --tv-Milestone-flag-desc-text-color: var(--tv-color-text-inverse-black, #191919); // 旗子描述字号大小 --tv-Milestone-flag-desc-font-size: var(--tv-font-size-sm, 12px); diff --git a/packages/theme/src/steps/index.less b/packages/theme/src/steps/index.less index ce454d91af..8a93ba889d 100644 --- a/packages/theme/src/steps/index.less +++ b/packages/theme/src/steps/index.less @@ -230,6 +230,7 @@ align-items: center; justify-content: center; overflow: hidden; + border: solid 1px var(--tv-Steps-advance-border-color); &:hover .@{steps-prefix-cls}-icon.doing { background-color: #fff; @@ -245,7 +246,7 @@ align-items: center; justify-content: center; border-radius: 9999px; - border: 1px solid var(--tv-Steps-advance-node-disable-bg-color); + border: 1px solid var(--tv-Steps-node-done-border-color); &.done, &.doing { @@ -875,7 +876,7 @@ .label { font-weight: bold; background: var(--tv-Steps-node-bg-color-active); - color: var(--tv-Steps-advance-li-text-color); + color: var(--tv-Steps-line-doing-active-icon-color); &::after { border-left-color: var(--tv-Steps-node-bg-color-active); @@ -892,7 +893,6 @@ text-align: center; text-decoration: none; white-space: nowrap; - color: var(--tv-Steps-advance-text-color); &::after { content: ''; @@ -1210,11 +1210,11 @@ .icon { font-size: var(--tv-Steps-font-size); border-color: var(--tv-Steps-advance-active-border-color); - color: var(--tv-Steps-advance-li-text-color); + color: var(--tv-Steps-line-doing-active-icon-color); background: var(--tv-Steps-node-bg-color-active); .fixicons { - fill: var(--tv-Steps-advance-li-text-color); + fill: var(--tv-Steps-line-doing-active-icon-color); } } diff --git a/packages/theme/src/steps/vars.less b/packages/theme/src/steps/vars.less index ff837015eb..3bd3a7db87 100644 --- a/packages/theme/src/steps/vars.less +++ b/packages/theme/src/steps/vars.less @@ -26,7 +26,7 @@ // 已完成节点边框色 --tv-Steps-node-done-border-color: var(--tv-color-border-active, #191919); // 已完成节点背景色 - --tv-Steps-node-done-bg-color: var(--tv-color-bg-active-secondary, #ffffff); + --tv-Steps-node-done-bg-color: var(--tv-color-text-inverse-black, #191919); // 高级向导当前项和计数标记点的文本色 --tv-Steps-advance-li-text-color: var(--tv-color-text-inverse, #fff); @@ -50,7 +50,7 @@ // 已完成节点线条色 --tv-Steps-line-active-bg-color: var(--tv-color-bg-active-primary, #191919); // 已完成节点图标色 - --tv-Steps-done-icon-color: var(--tv-color-icon-active, #191919); + --tv-Steps-done-icon-color: var(--tv-color-icon-inverse, #191919); // 未完成的线条色 --tv-Steps-line-bg-color: var(--tv-color-border-divider, #f0f0f0); // 未完成节点的背景色 @@ -96,7 +96,7 @@ // 高级向导已完成节点悬浮背景色 --tv-Steps-advance-node-done-bg-color-hover: var(--tv-color-bg-disabled, #f0f0f0); // 高级向导进行中节点背景色 - --tv-Steps-advance-node-doing-bg-color: var(--tv-color-bg-header, #f0f0f0); + --tv-Steps-advance-node-doing-bg-color: var(--tv-color-bg-3, #f0f0f0); // 高级向导已完成节点悬浮背景色 --tv-Steps-advance-node-doing-bg-color-hover: var(--tv-color-bg-disabled, #f0f0f0); // 高级向导异常节点背景色 @@ -160,7 +160,7 @@ // 高级向导边框色 --tv-Steps-advance-border-color: var(--tv-color-border, #c2c2c2); // 高级向导未选中项文本色 - --tv-Steps-advance-text-color: var(--tv-color-text, #191919); + --tv-Steps-advance-text-color: var(--tv-color-text-inverse, #191919); // 高级向导节点悬浮背景色 --tv-Steps-advance-li-hover-bg-color: var(--tv-color-bg-header, #f0f0f0); // 高级向导节点悬浮文本色 @@ -260,5 +260,5 @@ // mini尺寸节点内容字号 --tv-Steps-mini-font-size-base: var(--tv-font-size-sm, 12px); // 条状进度条角标背景色 - --tv-Steps-border-left-color: var(--tv-color-act-primary-text-inverse-tint); + --tv-Steps-border-left-color: var(--tv-color-bg-active-dark, #f5f5f5); }