@douyinfe/semi-foundation 2.23.0-beta.0 → 2.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/anchor/animation.scss +2 -2
- package/autoComplete/animation.scss +2 -2
- package/breadcrumb/animation.scss +2 -2
- package/button/animation.scss +26 -26
- package/carousel/animation.scss +2 -2
- package/cascader/animation.scss +2 -2
- package/cascader/cascader.scss +15 -0
- package/cascader/variables.scss +1 -0
- package/checkbox/animation.scss +4 -4
- package/checkbox/variables.scss +1 -1
- package/collapsible/animation.scss +2 -2
- package/datePicker/animation.scss +2 -2
- package/dropdown/animation.scss +1 -1
- package/dropdown/foundation.ts +16 -9
- package/dropdown/menuFoundation.ts +1 -12
- package/form/form.scss +3 -4
- package/form/rtl.scss +0 -1
- package/form/variables.scss +38 -35
- package/input/animation.scss +6 -6
- package/inputNumber/animation.scss +4 -4
- package/lib/cjs/anchor/anchor.css +1 -1
- package/lib/cjs/anchor/animation.scss +2 -2
- package/lib/cjs/autoComplete/animation.scss +2 -2
- package/lib/cjs/autoComplete/autoComplete.css +1 -1
- package/lib/cjs/breadcrumb/animation.scss +2 -2
- package/lib/cjs/breadcrumb/breadcrumb.css +1 -1
- package/lib/cjs/button/animation.scss +26 -26
- package/lib/cjs/button/button.css +7 -7
- package/lib/cjs/carousel/animation.scss +2 -2
- package/lib/cjs/carousel/carousel.css +6 -6
- package/lib/cjs/cascader/animation.scss +2 -2
- package/lib/cjs/cascader/cascader.css +13 -1
- package/lib/cjs/cascader/cascader.scss +15 -0
- package/lib/cjs/cascader/variables.scss +1 -0
- package/lib/cjs/checkbox/animation.scss +4 -4
- package/lib/cjs/checkbox/checkbox.css +2 -2
- package/lib/cjs/checkbox/variables.scss +1 -1
- package/lib/cjs/collapsible/animation.scss +2 -2
- package/lib/cjs/collapsible/collapsible.css +1 -1
- package/lib/cjs/datePicker/animation.scss +2 -2
- package/lib/cjs/dropdown/animation.scss +1 -1
- package/lib/cjs/dropdown/dropdown.css +1 -1
- package/lib/cjs/dropdown/foundation.d.ts +4 -3
- package/lib/cjs/dropdown/foundation.js +21 -8
- package/lib/cjs/dropdown/menuFoundation.d.ts +0 -1
- package/lib/cjs/dropdown/menuFoundation.js +0 -11
- package/lib/cjs/form/form.css +0 -2
- package/lib/cjs/form/form.scss +3 -4
- package/lib/cjs/form/rtl.scss +0 -1
- package/lib/cjs/form/variables.scss +38 -35
- package/lib/cjs/input/animation.scss +6 -6
- package/lib/cjs/input/input.css +2 -2
- package/lib/cjs/input/textarea.css +1 -1
- package/lib/cjs/inputNumber/animation.scss +4 -4
- package/lib/cjs/inputNumber/inputNumber.css +1 -1
- package/lib/cjs/navigation/animation.scss +2 -2
- package/lib/cjs/navigation/navigation.css +1 -1
- package/lib/cjs/pagination/animation.scss +4 -4
- package/lib/cjs/pagination/pagination.css +1 -1
- package/lib/cjs/radio/animation.scss +4 -4
- package/lib/cjs/radio/radio.css +4 -4
- package/lib/cjs/rating/animation.scss +2 -2
- package/lib/cjs/rating/rating.css +1 -1
- package/lib/cjs/scrollList/animation.scss +1 -1
- package/lib/cjs/scrollList/scrollList.css +1 -1
- package/lib/cjs/select/animation.scss +6 -6
- package/lib/cjs/select/select.css +2 -2
- package/lib/cjs/slider/animation.scss +2 -2
- package/lib/cjs/slider/slider.css +1 -1
- package/lib/cjs/steps/animation.scss +6 -6
- package/lib/cjs/steps/steps.css +7 -7
- package/lib/cjs/switch/animation.scss +1 -1
- package/lib/cjs/switch/switch.css +1 -1
- package/lib/cjs/table/animation.scss +1 -1
- package/lib/cjs/table/table.css +2 -2
- package/lib/cjs/tabs/animation.scss +8 -8
- package/lib/cjs/tabs/tabs.css +46 -6
- package/lib/cjs/tabs/tabs.scss +43 -2
- package/lib/cjs/tabs/variables.scss +20 -0
- package/lib/cjs/tagInput/animation.scss +4 -4
- package/lib/cjs/tagInput/tagInput.css +1 -1
- package/lib/cjs/timePicker/utils/animation.scss +4 -4
- package/lib/cjs/tooltip/constants.d.ts +1 -0
- package/lib/cjs/tooltip/constants.js +2 -2
- package/lib/cjs/tooltip/foundation.d.ts +21 -2
- package/lib/cjs/tooltip/foundation.js +360 -77
- package/lib/cjs/transfer/animation.scss +2 -2
- package/lib/cjs/transfer/transfer.css +1 -1
- package/lib/cjs/tree/animation.scss +2 -2
- package/lib/cjs/tree/tree.css +1 -1
- package/lib/es/anchor/anchor.css +1 -1
- package/lib/es/anchor/animation.scss +2 -2
- package/lib/es/autoComplete/animation.scss +2 -2
- package/lib/es/autoComplete/autoComplete.css +1 -1
- package/lib/es/breadcrumb/animation.scss +2 -2
- package/lib/es/breadcrumb/breadcrumb.css +1 -1
- package/lib/es/button/animation.scss +26 -26
- package/lib/es/button/button.css +7 -7
- package/lib/es/carousel/animation.scss +2 -2
- package/lib/es/carousel/carousel.css +6 -6
- package/lib/es/cascader/animation.scss +2 -2
- package/lib/es/cascader/cascader.css +13 -1
- package/lib/es/cascader/cascader.scss +15 -0
- package/lib/es/cascader/variables.scss +1 -0
- package/lib/es/checkbox/animation.scss +4 -4
- package/lib/es/checkbox/checkbox.css +2 -2
- package/lib/es/checkbox/variables.scss +1 -1
- package/lib/es/collapsible/animation.scss +2 -2
- package/lib/es/collapsible/collapsible.css +1 -1
- package/lib/es/datePicker/animation.scss +2 -2
- package/lib/es/dropdown/animation.scss +1 -1
- package/lib/es/dropdown/dropdown.css +1 -1
- package/lib/es/dropdown/foundation.d.ts +4 -3
- package/lib/es/dropdown/foundation.js +21 -8
- package/lib/es/dropdown/menuFoundation.d.ts +0 -1
- package/lib/es/dropdown/menuFoundation.js +1 -12
- package/lib/es/form/form.css +0 -2
- package/lib/es/form/form.scss +3 -4
- package/lib/es/form/rtl.scss +0 -1
- package/lib/es/form/variables.scss +38 -35
- package/lib/es/input/animation.scss +6 -6
- package/lib/es/input/input.css +2 -2
- package/lib/es/input/textarea.css +1 -1
- package/lib/es/inputNumber/animation.scss +4 -4
- package/lib/es/inputNumber/inputNumber.css +1 -1
- package/lib/es/navigation/animation.scss +2 -2
- package/lib/es/navigation/navigation.css +1 -1
- package/lib/es/pagination/animation.scss +4 -4
- package/lib/es/pagination/pagination.css +1 -1
- package/lib/es/radio/animation.scss +4 -4
- package/lib/es/radio/radio.css +4 -4
- package/lib/es/rating/animation.scss +2 -2
- package/lib/es/rating/rating.css +1 -1
- package/lib/es/scrollList/animation.scss +1 -1
- package/lib/es/scrollList/scrollList.css +1 -1
- package/lib/es/select/animation.scss +6 -6
- package/lib/es/select/select.css +2 -2
- package/lib/es/slider/animation.scss +2 -2
- package/lib/es/slider/slider.css +1 -1
- package/lib/es/steps/animation.scss +6 -6
- package/lib/es/steps/steps.css +7 -7
- package/lib/es/switch/animation.scss +1 -1
- package/lib/es/switch/switch.css +1 -1
- package/lib/es/table/animation.scss +1 -1
- package/lib/es/table/table.css +2 -2
- package/lib/es/tabs/animation.scss +8 -8
- package/lib/es/tabs/tabs.css +46 -6
- package/lib/es/tabs/tabs.scss +43 -2
- package/lib/es/tabs/variables.scss +20 -0
- package/lib/es/tagInput/animation.scss +4 -4
- package/lib/es/tagInput/tagInput.css +1 -1
- package/lib/es/timePicker/utils/animation.scss +4 -4
- package/lib/es/tooltip/constants.d.ts +1 -0
- package/lib/es/tooltip/constants.js +2 -2
- package/lib/es/tooltip/foundation.d.ts +21 -2
- package/lib/es/tooltip/foundation.js +360 -77
- package/lib/es/transfer/animation.scss +2 -2
- package/lib/es/transfer/transfer.css +1 -1
- package/lib/es/tree/animation.scss +2 -2
- package/lib/es/tree/tree.css +1 -1
- package/navigation/animation.scss +2 -2
- package/package.json +2 -2
- package/pagination/animation.scss +4 -4
- package/radio/animation.scss +4 -4
- package/rating/animation.scss +2 -2
- package/scrollList/animation.scss +1 -1
- package/select/animation.scss +6 -6
- package/slider/animation.scss +2 -2
- package/steps/animation.scss +6 -6
- package/switch/animation.scss +1 -1
- package/table/animation.scss +1 -1
- package/tabs/animation.scss +8 -8
- package/tabs/tabs.scss +43 -2
- package/tabs/variables.scss +20 -0
- package/tagInput/animation.scss +4 -4
- package/timePicker/utils/animation.scss +4 -4
- package/tooltip/constants.ts +1 -0
- package/tooltip/foundation.ts +322 -78
- package/transfer/animation.scss +2 -2
- package/tree/animation.scss +2 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
$transition_duration_transfer_item-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration_transfer_item-bg: var(--semi-transition_duration-none);//穿梭框条目-背景色-动画持续时间
|
|
2
2
|
$transition_function_transfer_item-bg: var(--semi-transition_function-easeIn);//穿梭框条目-背景色-过渡曲线
|
|
3
|
-
$transition_delay_transfer_item-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay_transfer_item-bg: var(--semi-transition_delay-none);//穿梭框条目-背景色-延迟时间
|
|
4
4
|
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
flex-wrap: nowrap;
|
|
72
72
|
color: var(--semi-color-text-1);
|
|
73
73
|
cursor: pointer;
|
|
74
|
-
transition: background-color var(--semi-transition_duration-
|
|
74
|
+
transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
|
|
75
75
|
}
|
|
76
76
|
.semi-transfer-item:hover {
|
|
77
77
|
background-color: var(--semi-color-fill-0);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
$transition_duration-tree_option-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-tree_option-bg: var(--semi-transition_duration-none);//树选项-背景色-动画持续时间
|
|
2
2
|
$transition_function-tree_option-bg: var(--semi-transition_function-easeIn);//树选项-背景色-过渡曲线
|
|
3
|
-
$transition_delay-tree_option-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-tree_option-bg: var(--semi-transition_delay-none);//树选项-背景色-延迟时间
|
|
4
4
|
|
|
5
5
|
//transform token
|
|
6
6
|
|
package/lib/es/tree/tree.css
CHANGED
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
display: flex;
|
|
46
46
|
align-items: center;
|
|
47
47
|
cursor: pointer;
|
|
48
|
-
transition: background-color var(--semi-transition_duration-
|
|
48
|
+
transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
|
|
49
49
|
transform: scale(var(--semi-transform_scale-none));
|
|
50
50
|
font-size: 14px;
|
|
51
51
|
line-height: 20px;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
$transition_duration-navigation_itemL1-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-navigation_itemL1-bg: var(--semi-transition_duration-none);//导航一级菜单-背景色-动画持续时间
|
|
2
2
|
$transition_function-navigation_itemL1-bg: var(--semi-transition_function-easeIn);//导航一级菜单-背景色-过渡曲线
|
|
3
|
-
$transition_delay-navigation_itemL1-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-navigation_itemL1-bg: var(--semi-transition_delay-none);//导航一级菜单-背景色-延迟时间
|
|
4
4
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@douyinfe/semi-foundation",
|
|
3
|
-
"version": "2.23.0
|
|
3
|
+
"version": "2.23.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"build:lib": "node ./scripts/compileLib.js",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"*.scss",
|
|
24
24
|
"*.css"
|
|
25
25
|
],
|
|
26
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "a5195872c7df1a97551c6c23357bdb941b8fa807",
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@babel/plugin-transform-runtime": "^7.15.8",
|
|
29
29
|
"@babel/preset-env": "^7.15.8",
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
$transition_duration-pagination_item-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-pagination_item-bg: var(--semi-transition_duration-none);//翻页器页码-背景色-动画持续时间
|
|
2
2
|
$transition_function-pagination_item-bg: var(--semi-transition_function-easeIn);//翻页器页码-背景色-过渡曲线
|
|
3
|
-
$transition_delay-pagination_item-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-pagination_item-bg: var(--semi-transition_delay-none);//翻页器页码-背景色-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-pagination_item-text: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-pagination_item-text: var(--semi-transition_duration-none);//翻页器页码文本-背景色-动画持续时间
|
|
6
6
|
$transition_function-pagination_item-text: var(--semi-transition_function-easeIn);//翻页器页码文本-背景色-过渡曲线
|
|
7
|
-
$transition_delay-pagination_item-text: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-pagination_item-text: var(--semi-transition_delay-none);//翻页器页码文本-背景色-延迟时间
|
|
8
8
|
|
|
9
9
|
//transform token
|
|
10
10
|
|
package/radio/animation.scss
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
$transition_duration-radio-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-radio-bg: var(--semi-transition_duration-none);//单选框-背景色-动画持续时间
|
|
2
2
|
$transition_function-radio-bg: var(--semi-transition_function-easeIn);//单选框-背景色-过渡曲线
|
|
3
|
-
$transition_delay-radio-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-radio-bg: var(--semi-transition_delay-none);//单选框-背景色-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-radio-border: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-radio-border: var(--semi-transition_duration-none);//单选框-边框-动画持续时间
|
|
6
6
|
$transition_function-radio-border: var(--semi-transition_function-easeIn);//单选框-边框-过渡曲线
|
|
7
|
-
$transition_delay-radio-border: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-radio-border: var(--semi-transition_delay-none);//单选框-边框-延迟时间
|
|
8
8
|
|
|
9
9
|
// transform token
|
|
10
10
|
$transform_scale-radio: var(--semi-transform_scale-none);//单选框-变大
|
package/rating/animation.scss
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
$transition_duration-rating-color: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-rating-color: var(--semi-transition_duration-none);//评分-背景色-动画持续时间
|
|
2
2
|
$transition_function-rating-color: var(--semi-transition_function-easeIn);//评分-背景色-过渡曲线
|
|
3
|
-
$transition_delay-rating-color: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-rating-color: var(--semi-transition_delay-none);//评分-背景色-延迟时间
|
|
4
4
|
|
|
5
5
|
// transform token
|
|
6
6
|
$transform_scale-rating: var(--semi-transform_scale-none);//评分-变大
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
$transition_duration-scrollList_selected_item-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-scrollList_selected_item-bg: var(--semi-transition_duration-none); // 滚动列表选中选项-背景颜色-动画持续时间
|
|
2
2
|
$transition_function-scrollList_selected_item-bg: var(--semi-transition_function-easeOut); // 滚动列表选中选项-背景颜色-过渡曲线
|
|
3
3
|
$transition_delay-scrollList_selected_item-bg: 0ms; // 滚动列表选中选项-背景颜色-延迟时间
|
package/select/animation.scss
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
$transition_duration-select-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-select-bg: var(--semi-transition_duration-none);//选择器-背景色-动画持续时间
|
|
2
2
|
$transition_function-select-bg: var(--semi-transition_function-easeIn);//选择器-背景色-过渡曲线
|
|
3
|
-
$transition_delay-select-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-select-bg: var(--semi-transition_delay-none);//选择器-背景色-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-select-border: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-select-border: var(--semi-transition_duration-none);//选择器-边框-动画持续时间
|
|
6
6
|
$transition_function-select-border: var(--semi-transition_function-easeIn);//选择器-边框-过渡曲线
|
|
7
|
-
$transition_delay-select-border: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-select-border: var(--semi-transition_delay-none);//选择器-边框-延迟时间
|
|
8
8
|
|
|
9
|
-
$transition_duration-select_option-bg: var(--semi-transition_duration-
|
|
9
|
+
$transition_duration-select_option-bg: var(--semi-transition_duration-none);//选择器-选项-动画持续时间
|
|
10
10
|
$transition_function-select_option-bg: var(--semi-transition_function-easeIn);//选择器-选项-过渡曲线
|
|
11
|
-
$transition_delay-select_option-bg: var(--semi-transition_delay-
|
|
11
|
+
$transition_delay-select_option-bg: var(--semi-transition_delay-none);//选择器-选项-延迟时间
|
|
12
12
|
|
|
13
13
|
// transform token
|
|
14
14
|
$transform_scale-select: var(--semi-transform_scale-none);//选择框-变大
|
package/slider/animation.scss
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
$transition_duration-slider_handle-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-slider_handle-bg: var(--semi-transition_duration-none);//滑动条圆形按钮-背景色-动画持续时间
|
|
2
2
|
$transition_function-slider_handle-bg: var(--semi-transition_function-easeIn);//滑动条圆形按钮-背景色-过渡曲线
|
|
3
|
-
$transition_delay-slider_handle-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-slider_handle-bg: var(--semi-transition_delay-none);//滑动条圆形按钮-背景色-延迟时间
|
|
4
4
|
|
|
5
5
|
//transform token
|
|
6
6
|
|
package/steps/animation.scss
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
$transition_duration-steps_item_title-text: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-steps_item_title-text: var(--semi-transition_duration-none);//步骤条标题文字-背景色-动画持续时间
|
|
2
2
|
$transition_function-steps_item_title-text: var(--semi-transition_function-easeIn);//步骤条标题文字-背景色-过渡曲线
|
|
3
|
-
$transition_delay-steps_item_title-text: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-steps_item_title-text: var(--semi-transition_delay-none);//步骤条标题文字-背景色-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-steps_item_title-icon: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-steps_item_title-icon: var(--semi-transition_duration-none);//步骤条标题文字-背景色-动画持续时间
|
|
6
6
|
$transition_function-steps_item_title-icon: var(--semi-transition_function-easeIn);//步骤条标题文字-背景色-过渡曲线
|
|
7
|
-
$transition_delay-steps_item_title-icon: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-steps_item_title-icon: var(--semi-transition_delay-none);//步骤条标题文字-背景色-延迟时间
|
|
8
8
|
|
|
9
|
-
$transition_duration-steps_item_backgroundColor: var(--semi-transition_duration-
|
|
9
|
+
$transition_duration-steps_item_backgroundColor: var(--semi-transition_duration-none);//步骤条标题文字-背景色-动画持续时间
|
|
10
10
|
$transition_function-steps_item_backgroundColor: var(--semi-transition_function-easeIn);//步骤条标题文字-背景色-过渡曲线
|
|
11
|
-
$transition_delay-steps_item_backgroundColor: var(--semi-transition_delay-
|
|
11
|
+
$transition_delay-steps_item_backgroundColor: var(--semi-transition_delay-none);//步骤条标题文字-背景色-延迟时间
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
|
package/switch/animation.scss
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
$transition_duration-switch-bg: 200ms;//开关-背景色-动画持续时间
|
|
2
2
|
$transition_function-switch-bg: var(--semi-transition_function-easeIn);//开关-背景色-过渡曲线
|
|
3
|
-
$transition_delay-switch-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-switch-bg: var(--semi-transition_delay-none);//开关-背景色-延迟时间
|
|
4
4
|
|
package/table/animation.scss
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
$transition_duration-table_body-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-table_body-bg: var(--semi-transition_duration-none); // 表格-背景颜色-动画持续时间
|
|
2
2
|
$transition_function-table_body-bg: var(--semi-transition_function-easeOut); // 表格-背景颜色-过渡曲线
|
|
3
3
|
$transition_delay-table_body-bg: 0ms; // 表格-背景颜色-延迟时间
|
package/tabs/animation.scss
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
$transition_duration-tabs_tab_line-border: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-tabs_tab_line-border: var(--semi-transition_duration-none); //线条式标签页标示线-边框-动画持续时间
|
|
2
2
|
$transition_function-tabs_tab_line-border: var(--semi-transition_function-easeIn); //线条式标签页标示线-边框-过渡曲线
|
|
3
|
-
$transition_delay-tabs_tab_line-border: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-tabs_tab_line-border: var(--semi-transition_delay-none); //线条式标签页标示线-边框-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-tabs_tab_line-text: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-tabs_tab_line-text: var(--semi-transition_duration-none); //线条式标签页-文字-动画持续时间
|
|
6
6
|
$transition_function-tabs_tab_line-text: var(--semi-transition_function-easeIn); //线条式标签页-文字-过渡曲线
|
|
7
|
-
$transition_delay-tabs_tab_line-text: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-tabs_tab_line-text: var(--semi-transition_delay-none); //线条式标签页-文字-延迟时间
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
$transition_duration-tabs_tab_button-bg: var(--semi-transition_duration-
|
|
10
|
+
$transition_duration-tabs_tab_button-bg: var(--semi-transition_duration-none); //按钮式标签页-背景色-动画持续时间
|
|
11
11
|
$transition_function-tabs_tab_button-bg: var(--semi-transition_function-easeIn); //按钮式标签页-背景色-过渡曲线
|
|
12
|
-
$transition_delay-tabs_tab_button-bg: var(--semi-transition_delay-
|
|
12
|
+
$transition_delay-tabs_tab_button-bg: var(--semi-transition_delay-none); //按钮式标签页-背景色-延迟时间
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
$transition_duration-tabs_tab_card-bg: var(--semi-transition_duration-
|
|
15
|
+
$transition_duration-tabs_tab_card-bg: var(--semi-transition_duration-none); //卡片式标签页文字-背景色-动画持续时间
|
|
16
16
|
$transition_function-tabs_tab_card-bg: var(--semi-transition_function-easeIn); //卡片式标签页文字-背景色-过渡曲线
|
|
17
|
-
$transition_delay-tabs_tab_card-bg: var(--semi-transition_delay-
|
|
17
|
+
$transition_delay-tabs_tab_card-bg: var(--semi-transition_delay-none); //卡片式标签页文字-背景色-延迟时间
|
|
18
18
|
|
|
19
19
|
//transform token
|
|
20
20
|
|
package/tabs/tabs.scss
CHANGED
|
@@ -134,14 +134,55 @@ $module: #{$prefix}-tabs;
|
|
|
134
134
|
outline-offset: $width-tabs-outline-offset;
|
|
135
135
|
}
|
|
136
136
|
}
|
|
137
|
+
& > .#{$prefix}-button-disabled{
|
|
138
|
+
color: $color-tabs_tab-pane_arrow_disabled-text-default;
|
|
139
|
+
background-color: $color-tabs_tab-pane_arrow_disabled-bg-default;
|
|
140
|
+
&:hover{
|
|
141
|
+
color: $color-tabs_tab-pane_arrow_disabled-text-hover;
|
|
142
|
+
background-color: $color-tabs_tab-pane_arrow_disabled-bg-hover;
|
|
143
|
+
}
|
|
144
|
+
}
|
|
137
145
|
}
|
|
138
146
|
|
|
139
147
|
.#{$module}-bar-arrow-start {
|
|
140
148
|
margin-right: $spacing-tabs_overflow_icon-marginRight;
|
|
149
|
+
& > .#{$prefix}-button{
|
|
150
|
+
color: $color-tabs_tab-pane_arrow-text-default;
|
|
151
|
+
padding: $spacing-tabs_tab-pane_arrow;
|
|
152
|
+
border: $width-tabs_tab-pane_arrow-border solid $color-tabs_tab-pane_arrow-border-default;
|
|
153
|
+
background-color: $color-tabs_tab-pane_arrow-bg-default;
|
|
154
|
+
&:hover{
|
|
155
|
+
background-color: var(--semi-color-fill-0);
|
|
156
|
+
color: $color-tabs_tab-pane_arrow-text-hover;
|
|
157
|
+
border-color: $color-tabs_tab-pane_arrow-border-hover;
|
|
158
|
+
}
|
|
159
|
+
&:active{
|
|
160
|
+
background-color: var(--semi-color-fill-1);
|
|
161
|
+
color: $color-tabs_tab-pane_arrow-text-active;
|
|
162
|
+
border-color: $color-tabs_tab-pane_arrow-border-active;
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
|
|
141
166
|
}
|
|
142
167
|
|
|
143
168
|
.#{$module}-bar-arrow-end {
|
|
144
169
|
margin-left: $spacing-tabs_overflow_icon-marginLeft;
|
|
170
|
+
& > .#{$prefix}-button{
|
|
171
|
+
color: $color-tabs_tab-pane_arrow-text-default;
|
|
172
|
+
padding: $spacing-tabs_tab-pane_arrow;
|
|
173
|
+
border: $width-tabs_tab-pane_arrow-border solid $color-tabs_tab-pane_arrow-border-default;
|
|
174
|
+
background-color: $color-tabs_tab-pane_arrow-bg-default;
|
|
175
|
+
&:hover{
|
|
176
|
+
background-color: var(--semi-color-fill-0);
|
|
177
|
+
color: $color-tabs_tab-pane_arrow-text-hover;
|
|
178
|
+
border-color: $color-tabs_tab-pane_arrow-border-hover;
|
|
179
|
+
}
|
|
180
|
+
&:active{
|
|
181
|
+
background-color: var(--semi-color-fill-1);
|
|
182
|
+
color: $color-tabs_tab-pane_arrow-text-active;
|
|
183
|
+
border-color: $color-tabs_tab-pane_arrow-border-active;
|
|
184
|
+
}
|
|
185
|
+
}
|
|
145
186
|
}
|
|
146
187
|
}
|
|
147
188
|
|
|
@@ -160,13 +201,13 @@ $module: #{$prefix}-tabs;
|
|
|
160
201
|
&-bar-line {
|
|
161
202
|
&.#{$module}-bar-top {
|
|
162
203
|
border-bottom: $width-tabs_bar_line-border solid $color-tabs_tab_line_default-border-default;
|
|
163
|
-
transition: color $transition_duration-tabs_tab_line-text $transition_function-tabs_tab_line-text $transition_delay-tabs_tab_line-text
|
|
204
|
+
transition: color $transition_duration-tabs_tab_line-text $transition_function-tabs_tab_line-text $transition_delay-tabs_tab_line-text; //线条式tabs的 color的transition
|
|
164
205
|
transform:scale($transform_scale-tabs_tab_line-item);
|
|
165
206
|
|
|
166
207
|
.#{$module}-tab {
|
|
167
208
|
padding: $spacing-tabs_bar_line_tab-paddingTop $spacing-tabs_bar_line_tab-paddingRight $spacing-tabs_bar_line_tab-paddingBottom $spacing-tabs_bar_line_tab-paddingLeft;
|
|
168
209
|
transition: border-bottom-color $transition_duration-tabs_tab_line-border $transition_function-tabs_tab_line-border $transition_delay-tabs_tab_line-border,
|
|
169
|
-
color $transition_duration-tabs_tab_line-text $transition_function-tabs_tab_line-text $transition_delay-tabs_tab_line-text
|
|
210
|
+
color $transition_duration-tabs_tab_line-text $transition_function-tabs_tab_line-text $transition_delay-tabs_tab_line-text; //线条式tabs的border-color 的 transition
|
|
170
211
|
&:nth-of-type(1) {
|
|
171
212
|
padding-left: 0;
|
|
172
213
|
}
|
package/tabs/variables.scss
CHANGED
|
@@ -48,6 +48,23 @@ $color-tabs_tab-outline-focus: var(--semi-color-primary-light-active); // 页签
|
|
|
48
48
|
|
|
49
49
|
$color-tabs_tab-pane-text-default: var(--semi-color-text-0); // 标签页内容文本颜色 - 默认
|
|
50
50
|
|
|
51
|
+
$color-tabs_tab-pane_arrow-text-default: var(--semi-color-primary); // 滚动折叠箭头颜色 - 默认
|
|
52
|
+
$color-tabs_tab-pane_arrow-border-default: transparent; // 滚动折叠箭头边框颜色 - 默认
|
|
53
|
+
$color-tabs_tab-pane_arrow-bg-default:transparent; // 滚动折叠箭头背景色 - 默认
|
|
54
|
+
|
|
55
|
+
$color-tabs_tab-pane_arrow-text-hover: var(--semi-color-primary); // 滚动折叠箭头颜色 - 悬浮
|
|
56
|
+
$color-tabs_tab-pane_arrow-border-hover: transparent; // 滚动折叠箭头边框颜色 - 悬浮
|
|
57
|
+
$color-tabs_tab-pane_arrow-bg-hover: var(--semi-color-fill-0); // 滚动折叠箭头背景色 - 悬浮
|
|
58
|
+
|
|
59
|
+
$color-tabs_tab-pane_arrow-text-active: var(--semi-color-primary); // 滚动折叠箭头颜色 - 按下
|
|
60
|
+
$color-tabs_tab-pane_arrow-border-active: transparent; // 滚动折叠箭头边框颜色 - 按下
|
|
61
|
+
$color-tabs_tab-pane_arrow-bg-active: var(--semi-color-fill-1); // 滚动折叠箭头背景色 - 按下
|
|
62
|
+
|
|
63
|
+
$color-tabs_tab-pane_arrow_disabled-bg-default: transparent;
|
|
64
|
+
$color-tabs_tab-pane_arrow_disabled-bg-hover: transparent;
|
|
65
|
+
$color-tabs_tab-pane_arrow_disabled-text-default: var(--semi-color-disabled-text);
|
|
66
|
+
$color-tabs_tab-pane_arrow_disabled-text-hover: var(--semi-color-disabled-text);
|
|
67
|
+
|
|
51
68
|
$font-tabs_tab-fontWeight: $font-weight-regular; // 页签文本字重 - 默认
|
|
52
69
|
$font-tabs_tab_active-fontWeight: $font-weight-bold; // 页签文本字重 - 选中
|
|
53
70
|
|
|
@@ -60,6 +77,7 @@ $width-tabs_bar_card-border: $border-thickness-control; // 卡片式页签底部
|
|
|
60
77
|
$width-tabs-outline: 2px; // 聚焦轮廓宽度
|
|
61
78
|
$width-tabs-outline-offset: -2px; // 聚焦轮廓偏移宽度
|
|
62
79
|
$width-tabs_bar_line-outline-offset: -1px; // 线条式页签聚焦轮廓偏移宽度
|
|
80
|
+
$width-tabs_tab-pane_arrow-border:0px; // 滚动折叠箭头边框宽度
|
|
63
81
|
|
|
64
82
|
$height-tabs_bar_extra_large: 50px; // 大尺寸页签高度
|
|
65
83
|
$font-tabs_bar_extra_large-lineHeight: $height-tabs_bar_extra_large; // 大尺寸页签文字行高
|
|
@@ -67,6 +85,7 @@ $font-tabs_bar_extra_large-lineHeight: $height-tabs_bar_extra_large; // 大尺
|
|
|
67
85
|
$height-tabs_bar_extra_small: 36px; // 小尺寸页签高度
|
|
68
86
|
$font-tabs_bar_extra_small-lineHeight: $height-tabs_bar_extra_small; // 小尺寸页签文字行高
|
|
69
87
|
|
|
88
|
+
$spacing-tabs_tab-pane_arrow: 8px; //滚动折叠箭头内边距
|
|
70
89
|
$spacing-tabs_bar_extra-paddingY: 0px; // 附加操作垂直内边距
|
|
71
90
|
$spacing-tabs_bar_extra-paddingX: 5px; // 附加操作水平内边距
|
|
72
91
|
$spacing-tabs_tab_icon-marginRight: $spacing-tight; // 附加操作垂直内边距
|
|
@@ -119,3 +138,4 @@ $spacing-tabs_bar_button_tab-paddingX: $spacing-base-tight; // 按钮式页签
|
|
|
119
138
|
$radius-tabs_tab_card: var(--semi-border-radius-small) var(--semi-border-radius-small) 0 0; // 卡片式页签四向圆角
|
|
120
139
|
$radius-tabs_tab_card_left: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small); // 垂直卡片式页签四向圆角
|
|
121
140
|
$radius-tabs_tab_button: var(--semi-border-radius-small); // 按钮式页签圆角
|
|
141
|
+
|
package/tagInput/animation.scss
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
$transition_duration-tagInput-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-tagInput-bg: var(--semi-transition_duration-none);//标签输入框-背景色-动画持续时间
|
|
2
2
|
$transition_function-tagInput-bg: var(--semi-transition_function-easeIn);//标签输入框-背景色-过渡曲线
|
|
3
|
-
$transition_delay-tagInput-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-tagInput-bg: var(--semi-transition_delay-none);//标签输入框-背景色-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-tagInput-border: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-tagInput-border: var(--semi-transition_duration-none);//标签输入框-边框-动画持续时间
|
|
6
6
|
$transition_function-tagInput-border: var(--semi-transition_function-easeIn);//标签输入框-边框-过渡曲线
|
|
7
|
-
$transition_delay-tagInput-border: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-tagInput-border: var(--semi-transition_delay-none);//标签输入框-边框-延迟时间
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
$transition_duration-timePicker-bg: var(--semi-transition_duration-
|
|
1
|
+
$transition_duration-timePicker-bg: var(--semi-transition_duration-none);//标签输入框-背景色-动画持续时间
|
|
2
2
|
$transition_function-tagInput-bg: var(--semi-transition_function-easeIn);//标签输入框-背景色-过渡曲线
|
|
3
|
-
$transition_delay-tagInput-bg: var(--semi-transition_delay-
|
|
3
|
+
$transition_delay-tagInput-bg: var(--semi-transition_delay-none);//标签输入框-背景色-延迟时间
|
|
4
4
|
|
|
5
|
-
$transition_duration-tagInput-border: var(--semi-transition_duration-
|
|
5
|
+
$transition_duration-tagInput-border: var(--semi-transition_duration-none);//标签输入框-边框-动画持续时间
|
|
6
6
|
$transition_function-tagInput-border: var(--semi-transition_function-easeIn);//标签输入框-边框-过渡曲线
|
|
7
|
-
$transition_delay-tagInput-border: var(--semi-transition_delay-
|
|
7
|
+
$transition_delay-tagInput-border: var(--semi-transition_delay-none);//标签输入框-边框-延迟时间
|