diff --git a/examples/sites/demos/pc/app/time-select/size-medium.spec.ts b/examples/sites/demos/pc/app/time-select/size-medium.spec.ts index c7b22eb26f..137f09d374 100644 --- a/examples/sites/demos/pc/app/time-select/size-medium.spec.ts +++ b/examples/sites/demos/pc/app/time-select/size-medium.spec.ts @@ -7,6 +7,6 @@ test('medium 尺寸', async ({ page }) => { const smallBox = page.getByRole('textbox', { name: '尺寸: small' }) const miniBox = page.getByRole('textbox', { name: '尺寸: mini' }) await expect(mediumBox).toHaveCSS('height', '40px') - await expect(smallBox).toHaveCSS('height', '32px') + await expect(smallBox).toHaveCSS('height', '28px') await expect(miniBox).toHaveCSS('height', '24px') }) diff --git a/packages/theme/src/time-select/index.less b/packages/theme/src/time-select/index.less index 7d8fb01b7f..431d9d1e9a 100644 --- a/packages/theme/src/time-select/index.less +++ b/packages/theme/src/time-select/index.less @@ -18,36 +18,36 @@ @time-select-scrollbar-cls: ~'@{css-prefix}scrollbar'; .@{time-select-prefix-cls} { - .component-css-vars-time-select(); + .inject-TimeSelect-vars(); - height: var(--ti-time-select-height); + height: 242px; .@{time-select-scrollbar-cls} { - height: var(--ti-time-select-scrollbar-height); + height: 242px; .@{css-prefix}scrollbar__wrap { - max-height: var(--ti-time-select-scrollbar-wrap-max-height); + max-height: unset; } } & &__item { - color: var(--ti-time-select-item-text-color); - font-size: var(--ti-time-select-item-font-size); - padding: 0 var(--ti-time-select-item-padding-horizontal); - line-height: var(--ti-time-select-item-line-height); - height: var(--ti-time-select-item-height); + color: var(--tv-TimeSelect-item-text-color); + font-size: var(--tv-TimeSelect-item-font-size); + padding: 0 var(--tv-TimeSelect-item-padding-horizontal); + line-height: 32px; + height: 32px; &.selected:not(.disabled) { - color: var(--ti-time-select-item-selected-text-color); - background-color: var(--ti-time-select-item-select-hover-bg-color); + color: var(--tv-TimeSelect-item-selected-text-color); + background-color: var(--tv-TimeSelect-item-select-hover-bg-color); } &:not(.disabled):hover { - background-color: var(--ti-time-select-item-hover-bg-color); + background-color: var(--tv-TimeSelect-item-hover-bg-color); cursor: pointer; } &.disabled { - color: var(--ti-time-select-item-disabled-text-color); + color: var(--tv-TimeSelect-item-disabled-text-color); cursor: not-allowed; } } @@ -55,7 +55,7 @@ &__content { padding-left: 0; padding-right: 0; - padding-top: var(--ti-time-select-content-padding-top); + padding-top: var(--tv-TimeSelect-content-padding-top); } } } diff --git a/packages/theme/src/time-select/vars.less b/packages/theme/src/time-select/vars.less index dcb94a0c1c..cc7506ef4d 100644 --- a/packages/theme/src/time-select/vars.less +++ b/packages/theme/src/time-select/vars.less @@ -10,28 +10,21 @@ * */ -.component-css-vars-time-select() { - // 时间选择选项高度 - --ti-time-select-item-height: var(--ti-common-size-height-normal, 32px); +.inject-TimeSelect-vars() { // 时间选择选项字体色 - --ti-time-select-item-text-color: var(--ti-common-color-text-primary, #191919); + --tv-TimeSelect-item-text-color: var(--tv-color-text); // 时间选择选项字号 - --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, 32px); + --tv-TimeSelect-item-font-size: var(--tv-font-size-md); // 时间选择选项左右内边距 - --ti-time-select-item-padding-horizontal: var(--ti-common-space-4x, 16px); + --tv-TimeSelect-item-padding-horizontal: var(--tv-space-xl); // 时间选择选项悬浮背景色 - --ti-time-select-item-hover-bg-color: var(--ti-common-color-bg-normal, #f5f5f5); + --tv-TimeSelect-item-hover-bg-color: var(--tv-color-bg-hover); // 时间选择选项禁用文本色 - --ti-time-select-item-disabled-text-color: var(--ti-common-color-text-disabled, #c2c2c2); + --tv-TimeSelect-item-disabled-text-color: var(--tv-color-text-disabled); // 时间选择选项悬浮背景色(选中项) - --ti-time-select-item-select-hover-bg-color: var(--ti-common-color-selected-background, #f5f5f5); + --tv-TimeSelect-item-select-hover-bg-color: var(--tv-color-bg-active); // 时间选择选项字体色(选中项) - --ti-time-select-item-selected-text-color: var(--ti-common-color-text-highlight, #1476ff); + --tv-TimeSelect-item-selected-text-color: var(--tv-color-text-active); // 面板高度 - --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, 8px); + --tv-TimeSelect-content-padding-top: var(--tv-space-md); }