Skip to content

Commit 99aba33

Browse files
discreted66discreted66
committed
fix:暗色主题适配
1 parent 9f49aa1 commit 99aba33

File tree

12 files changed

+62
-60
lines changed

12 files changed

+62
-60
lines changed

‎examples/sites/demos/pc/app/date-picker/custom-suffix-icon-composition-api.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,6 @@ const IconMinus = iconMinus()
1919
}
2020
2121
.my-date-picker {
22-
background: var(--tv-color-bg-active-emphasize);
22+
background: var(--tv-color-bg-2);
2323
}
2424
</style>

‎examples/sites/demos/pc/app/date-picker/custom-suffix-icon.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,6 @@ export default {
2727
}
2828
2929
.my-date-picker {
30-
background: var(--tv-color-bg-active-emphasize);
30+
background: var(--tv-color-bg-2);
3131
}
3232
</style>

‎examples/sites/demos/pc/app/tabs/custom-more-icon.spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ test('"定义更多按钮"', async ({ page }) => {
1818

1919
await expect(listWidth).toBeGreaterThan(boxWidth)
2020
await expect(tabItems).toHaveCount(8)
21-
await expect(dropdownItems).toHaveCount(3)
21+
await expect(dropdownItems).toHaveCount(2)
2222
await expect(headerBox).toHaveCSS('overflow', 'hidden')
2323
await moreIcon.hover()
2424
await dropdownLastItem.click()

‎packages/renderless/src/date-range/vue.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ const initState = ({ reactive, computed, api, constants, designConfig, props })
131131
enableYearArrow: computed(() => api.computerEnableYearArrow()),
132132
// tiny 新增
133133
confirmButtonProps: {
134-
plain: true,
134+
plain: false,
135135
type: 'default',
136136
...designConfig?.state?.confirmButtonProps
137137
}

‎packages/theme/src/search/index.less

+2-2
Original file line numberDiff line numberDiff line change
@@ -110,8 +110,8 @@
110110
transform: translateY(-50%);
111111
width: 1px;
112112
height: 16px;
113-
background-color: #000000;
114-
opacity: 8%;
113+
background-color: var(--tv-Search-border-short-color);
114+
opacity: 1;
115115
}
116116
}
117117

‎packages/theme/src/search/vars.less

+2
Original file line numberDiff line numberDiff line change
@@ -69,4 +69,6 @@
6969
--tv-Search-list-hover-bg-color: var(--tv-color-bg-hover, #f5f5f5);
7070
// 搜索下拉框选项水平内边距
7171
--tv-Search-selector-list-padding-x: 10px;
72+
// 搜索图标分割线
73+
--tv-Search-border-short-color: var(--tv-color-border-divider-short, #dbdbdb);
7274
}

‎packages/theme/src/steps/index.less

+40-39
Original file line numberDiff line numberDiff line change
@@ -651,10 +651,6 @@
651651
.left-line {
652652
border-top: 1px solid var(--tv-Steps-line-active-bg-color);
653653
}
654-
655-
.right-line {
656-
border-color: var(--tv-Steps-line-doing-border-color);
657-
}
658654
}
659655

660656
&.done {
@@ -703,6 +699,7 @@
703699
font-size: var(--tv-Steps-font-size);
704700
margin-left: var(--tv-Steps-text-margin-left);
705701
font-weight: 500;
702+
padding-top: 2px;
706703
overflow: hidden;
707704
display: -webkit-box;
708705
-webkit-box-orient: vertical;
@@ -1028,27 +1025,36 @@
10281025
.@{steps-prefix-cls} {
10291026
&-block.fault {
10301027
& > .block-left .left-dot {
1031-
border-color: #f23030;
1028+
border-color: var(--tv-Steps-error-icon-color);
10321029
}
10331030

10341031
& > .block-right .title-vertical {
1035-
color: #f23030;
1032+
color: var(--tv-Steps-error-text-color);
10361033
}
10371034
}
10381035

1039-
&-block.disabled {
1040-
cursor: not-allowed;
1036+
&-block {
1037+
display: flex;
10411038

1042-
& > .block-right {
1043-
.title-vertical,
1044-
.description {
1045-
color: var(--tv-Steps-disabled-text-color);
1039+
& > .block-left {
1040+
margin-top: 6.5px;
1041+
margin-right: 12px;
1042+
1043+
& .left-dot {
1044+
width: 10px;
1045+
height: 10px;
1046+
border: 1px solid var(--tv-Steps-dot-vertical-undo-dot-color);
1047+
border-radius: 50%;
1048+
box-sizing: border-box;
10461049
}
1047-
}
1048-
}
10491050

1050-
&-block {
1051-
display: flex;
1051+
& .left-line {
1052+
margin: 4px auto 0;
1053+
height: calc(100% - 11.5px);
1054+
width: 1px;
1055+
background-color: var(--tv-Steps-dot-vertical-undo-dot-color);
1056+
}
1057+
}
10521058

10531059
&.done,
10541060
&.doing,
@@ -1058,8 +1064,7 @@
10581064
}
10591065
}
10601066

1061-
&.done,
1062-
&.doing {
1067+
&.done {
10631068
& > .block-left > .left-line {
10641069
background-color: var(--tv-Steps-dot-vertical-current-bg-color);
10651070
}
@@ -1075,33 +1080,13 @@
10751080
}
10761081
}
10771082

1078-
& > .block-left {
1079-
margin-top: 6.5px;
1080-
margin-right: 12px;
1081-
1082-
& .left-dot {
1083-
width: 10px;
1084-
height: 10px;
1085-
border: 1px solid var(--tv-Steps-dot-vertical-current-bg-color);
1086-
border-radius: 50%;
1087-
box-sizing: border-box;
1088-
}
1089-
1090-
& .left-line {
1091-
margin: 4px auto 0;
1092-
height: calc(100% - 11.5px);
1093-
width: 1px;
1094-
background-color: var(--tv-Steps-dot-vertical-current-bg-color);
1095-
}
1096-
}
1097-
10981083
& > .block-right {
10991084
font-size: 14px;
11001085
line-height: 1.5;
11011086
padding-bottom: 12px;
11021087

11031088
.title-vertical {
1104-
color: #595959;
1089+
color: var(--tv-Steps-dot-title-undo-text-color);
11051090
}
11061091

11071092
.description {
@@ -1116,6 +1101,22 @@
11161101
display: none;
11171102
}
11181103
}
1104+
1105+
&.disabled {
1106+
cursor: not-allowed;
1107+
1108+
& .left-dot {
1109+
background-color: var(--tv-Steps-disabled-icon-bg-color);
1110+
border-color: var(--tv-Steps-disabled-border-color);
1111+
}
1112+
1113+
& > .block-right {
1114+
.title-vertical,
1115+
.description {
1116+
color: var(--tv-Steps-disabled-text-color);
1117+
}
1118+
}
1119+
}
11191120
}
11201121
}
11211122
}

‎packages/theme/src/steps/vars.less

+4-1
Original file line numberDiff line numberDiff line change
@@ -184,7 +184,10 @@
184184

185185
// 垂直点状形场景
186186
// 垂直点状形当前节点颜色
187-
--tv-Steps-dot-vertical-current-bg-color: var(--tv-color-border, #808080);
187+
--tv-Steps-dot-vertical-current-bg-color: var(--tv-color-border-active, #191919);
188+
--tv-Steps-dot-vertical-undo-border-color: var(--tv-color-border-disabled, #c2c2c2);
189+
--tv-Steps-dot-vertical-undo-dot-color: var(--tv-color-bg-4, #c2c2c2);
190+
--tv-Steps-dot-title-undo-text-color: var(--tv-color-text-secondary, #595959);
188191

189192
/** timline场景 */
190193
// timeline图标字号

‎packages/theme/src/tabs/index.less

+6-10
Original file line numberDiff line numberDiff line change
@@ -34,17 +34,13 @@
3434
overflow: hidden;
3535
}
3636

37-
&__nav-scroll {
38-
margin-right: 16px;
39-
}
4037

4138
/** 头部场景 */
4239
&__header {
4340
position: relative;
4441
margin: 0;
4542
padding: 0;
4643
display: flex;
47-
justify-content: space-between;
4844
align-items: center;
4945

5046
.@{tabs-prefix-cls} {
@@ -63,10 +59,9 @@
6359

6460
// 添加按钮
6561
&__new-tab {
66-
margin-left: 16px;
6762
margin-top: 3px;
6863
height: 16px;
69-
padding: 0 16px;
64+
padding-left: 12px;
7065
font-size: var(--tv-Tabs-header-separator-height);
7166
display: inline-flex;
7267
border-left: 1px solid var(--tv-Tabs-border-color);
@@ -78,6 +73,8 @@
7873

7974
svg {
8075
fill: var(--tv-Tabs-header-icon-color);
76+
font-size: var(--tv-Tabs-more-icon-size);
77+
padding: 4px;
8178

8279
&:hover {
8380
fill: var(--tv-Tabs-header-icon-color-hover);
@@ -92,7 +89,6 @@
9289
display: flex;
9390
align-items: center;
9491
position: relative;
95-
width: 100%;
9692

9793
&.is-scrollable {
9894
padding: 0 20px;
@@ -292,8 +288,6 @@
292288
}
293289

294290
&:hover {
295-
background-color: var(--tv-Tabs-icon-close-hover-bg-color);
296-
297291
svg {
298292
fill: var(--tv-Tabs-icon-close-hover-text-color);
299293
}
@@ -315,10 +309,11 @@
315309
// 更多按钮场景
316310
&__more-container {
317311
position: absolute;
318-
right: 0px;
312+
right: 0;
319313
font-size: var(--tv-Tabs-font-size-base);
320314
color: var(--tv-Tabs-header-font-normal-text-color);
321315
line-height: var(--tv-Tabs-height);
316+
padding-top: 5px;
322317

323318
.tiny-dropdown__suffix-inner {
324319
display: none;
@@ -358,6 +353,7 @@
358353

359354
.tiny-svg {
360355
font-size: var(--tv-Tabs-more-icon-size);
356+
padding: 4px;
361357
vertical-align: middle;
362358
fill: var(--tv-Tabs-more-icon-color);
363359

‎packages/theme/src/tabs/vars.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,7 @@
141141
// 头部更多图标盒子高度
142142
--tv-Tabs-more-icon-height: 52px;
143143
// 头部更多图标尺寸
144-
--tv-Tabs-more-icon-size: var(--tv-font-size-heading-xs, 16px);
144+
--tv-Tabs-more-icon-size: var(--tv-font-size-heading-lg, 24px);
145145
// 头部更多图标颜色
146146
--tv-Tabs-more-icon-color: var(--tv-color-icon-control, #191919);
147147
// 头部更多按钮左侧盒子阴影高度

‎packages/vue/src/tabs/src/tab-nav/pc.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -251,7 +251,7 @@ export default defineComponent({
251251
})
252252

253253
// 根据生成的子元素宽度动态设置tabslist盒子的padding-right
254-
const paddingRight = this.$refs.more ? `${this.$refs.more.offsetWidth}px` : '46px'
254+
const paddingRight = this.$refs.more ? `${this.$refs.more.offsetWidth}px` : '0'
255255

256256
return (
257257
<div

‎packages/vue/src/upload-list/src/pc.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -335,7 +335,7 @@ import {
335335
iconDownload,
336336
iconCueL,
337337
iconRefresh,
338-
iconOperationfaild,
338+
IconError,
339339
iconFullscreenLeft,
340340
iconRight,
341341
iconPause,
@@ -374,7 +374,7 @@ export default defineComponent({
374374
IconDownload: iconDownload(),
375375
IconCueL: iconCueL(),
376376
IconRefresh: iconRefresh(),
377-
IconOperationfaild: iconOperationfaild(),
377+
IconOperationfaild: IconError(),
378378
IconFullscreenLeft: iconFullscreenLeft(),
379379
IconRight: iconRight(),
380380
IconPause: iconPause(),

0 commit comments

Comments
 (0)