diff --git a/packages/cdk/resize/style/index.less b/packages/cdk/resize/style/index.less
index 4651ef7b9..90b5ca1cd 100644
--- a/packages/cdk/resize/style/index.less
+++ b/packages/cdk/resize/style/index.less
@@ -1,6 +1,6 @@
.cdk-resizable {
position: relative;
-
+
&-handle {
position: absolute;
user-select: none;
@@ -22,14 +22,14 @@
&-start {
width: 10px;
- height: 100%;
+ height: inherit;
top: 0;
left: -5px;
}
&-end {
width: 10px;
- height: 100%;
+ height: inherit;
top: 0;
right: -5px;
}
diff --git a/packages/components/_private/overlay/style/index.less b/packages/components/_private/overlay/style/index.less
index d7160c9b9..495509d4e 100644
--- a/packages/components/_private/overlay/style/index.less
+++ b/packages/components/_private/overlay/style/index.less
@@ -1,4 +1,4 @@
-@import "../../../style/mixins/reset.less";
+@import '../../../style/mixins/reset.less';
.@{overlay-prefix} {
.reset-component-new();
diff --git a/packages/components/_private/selector/style/index.less b/packages/components/_private/selector/style/index.less
index 579c94e39..d9abead81 100644
--- a/packages/components/_private/selector/style/index.less
+++ b/packages/components/_private/selector/style/index.less
@@ -52,11 +52,24 @@
overflow: hidden;
color: @select-placeholder-color;
position: absolute;
- right: @select-padding-horizontal-md;
- left: @select-padding-horizontal-md;
.ellipsis();
}
+ &-sm &-placeholder {
+ right: @form-new-padding-horizontal-sm;
+ left: @form-new-padding-horizontal-sm;
+ }
+
+ &-md &-placeholder {
+ right: @form-new-padding-horizontal-md;
+ left: @form-new-padding-horizontal-md;
+ }
+
+ &-lg &-placeholder {
+ right: @form-new-padding-horizontal-lg;
+ left: @form-new-padding-horizontal-lg;
+ }
+
&-sm &-suffix,
&-sm &-clear {
.selector-icon(@select-height-sm);
@@ -145,4 +158,4 @@
font-size: @select-icon-font-size;
color: @select-icon-color;
transition: color @transition-duration-base @ease-in-out;
-}
\ No newline at end of file
+}
diff --git a/packages/components/_private/selector/style/single.less b/packages/components/_private/selector/style/single.less
index 17bad692f..626adc633 100644
--- a/packages/components/_private/selector/style/single.less
+++ b/packages/components/_private/selector/style/single.less
@@ -44,14 +44,14 @@
}
&.@{selector-prefix}-sm {
- .select-size(@select-height-sm, @select-padding-horizontal-sm, @select-font-size-sm);
+ .select-size(@select-height-sm, @form-new-padding-horizontal-sm, @select-font-size-sm);
}
&.@{selector-prefix}-md {
- .select-size(@select-height-md, @select-padding-horizontal-md, @select-font-size-md);
+ .select-size(@select-height-md, @form-new-padding-horizontal-md, @select-font-size-md);
}
&.@{selector-prefix}-lg {
- .select-size(@select-height-lg, @select-padding-horizontal-lg, @select-font-size-lg);
+ .select-size(@select-height-lg, @form-new-padding-horizontal-lg, @select-font-size-lg);
}
}
diff --git a/packages/components/_private/trigger/style/index.less b/packages/components/_private/trigger/style/index.less
index a5c446bfc..e72455510 100644
--- a/packages/components/_private/trigger/style/index.less
+++ b/packages/components/_private/trigger/style/index.less
@@ -26,15 +26,15 @@
@icon-padding: @trigger-icon-margin-left + @trigger-icon-margin-right;
&-sm {
- .trigger-size(@trigger-height-sm, @trigger-padding-vertical-sm, @trigger-padding-horizontal-sm, @trigger-font-size-sm);
+ .trigger-size(@trigger-height-sm, @trigger-padding-vertical-sm, @form-new-padding-horizontal-sm, @trigger-font-size-sm);
}
&-md {
- .trigger-size(@trigger-height-md, @trigger-padding-vertical-md, @trigger-padding-horizontal-md, @trigger-font-size-md);
+ .trigger-size(@trigger-height-md, @trigger-padding-vertical-md, @form-new-padding-horizontal-md, @trigger-font-size-md);
}
&-lg {
- .trigger-size(@trigger-height-lg, @trigger-padding-vertical-lg, @trigger-padding-horizontal-lg, @trigger-font-size-lg);
+ .trigger-size(@trigger-height-lg, @trigger-padding-vertical-lg, @form-new-padding-horizontal-lg, @trigger-font-size-lg);
}
&:hover:not(&-disabled):not(&-borderless) {
diff --git a/packages/components/_private/trigger/style/themes/default.ts b/packages/components/_private/trigger/style/themes/default.ts
index 47fe656f7..290ba717c 100644
--- a/packages/components/_private/trigger/style/themes/default.ts
+++ b/packages/components/_private/trigger/style/themes/default.ts
@@ -1,3 +1,4 @@
// style dependencies
+import '@idux/components/icon/style/themes/default'
import './default.less'
diff --git a/packages/components/_private/trigger/style/themes/default.variable.less b/packages/components/_private/trigger/style/themes/default.variable.less
index 722b03e7a..16d7cedca 100644
--- a/packages/components/_private/trigger/style/themes/default.variable.less
+++ b/packages/components/_private/trigger/style/themes/default.variable.less
@@ -5,9 +5,6 @@
@trigger-height-sm: @form-height-sm;
@trigger-height-md: @form-height-md;
@trigger-height-lg: @form-height-lg;
-@trigger-padding-horizontal-sm: @form-padding-horizontal-sm;
-@trigger-padding-horizontal-md: @form-padding-horizontal-md;
-@trigger-padding-horizontal-lg: @form-padding-horizontal-lg;
@trigger-padding-vertical-sm: @form-padding-vertical-sm;
@trigger-padding-vertical-md: @form-padding-vertical-md;
@trigger-padding-vertical-lg: @form-padding-vertical-lg;
diff --git a/packages/components/_private/trigger/style/themes/seer.ts b/packages/components/_private/trigger/style/themes/seer.ts
index 8f61ab076..4f3afb4c4 100644
--- a/packages/components/_private/trigger/style/themes/seer.ts
+++ b/packages/components/_private/trigger/style/themes/seer.ts
@@ -1,3 +1,4 @@
// style dependencies
+import '@idux/components/icon/style/themes/seer'
import './seer.less'
diff --git a/packages/components/_private/trigger/style/themes/seer.variable.less b/packages/components/_private/trigger/style/themes/seer.variable.less
index 498793af1..2dbf39c14 100644
--- a/packages/components/_private/trigger/style/themes/seer.variable.less
+++ b/packages/components/_private/trigger/style/themes/seer.variable.less
@@ -1 +1,6 @@
@import './default.variable.less';
+
+@trigger-icon-margin-right: @spacing-sm;
+@trigger-icon-font-size: @font-size-lg;
+@trigger-icon-color: @color-graphite-l10;
+@trigger-clear-icon-color: @color-graphite-d20;
diff --git a/packages/components/breadcrumb/style/index.less b/packages/components/breadcrumb/style/index.less
index f37151937..957b474ba 100644
--- a/packages/components/breadcrumb/style/index.less
+++ b/packages/components/breadcrumb/style/index.less
@@ -24,7 +24,7 @@
}
&-item {
- display: inline-block;
+ display: inline-flex;
&-separator {
margin: @breadcrumb-separator-margin;
diff --git a/packages/components/card/style/themes/default.ts b/packages/components/card/style/themes/default.ts
index a38f13af8..883bf4d44 100644
--- a/packages/components/card/style/themes/default.ts
+++ b/packages/components/card/style/themes/default.ts
@@ -3,5 +3,6 @@
import '@idux/components/button/style/themes/default'
import '@idux/components/grid/style/themes/default'
import '@idux/components/header/style/themes/default'
+import '@idux/components/icon/style/themes/default'
import './default.less'
diff --git a/packages/components/card/style/themes/seer.ts b/packages/components/card/style/themes/seer.ts
index 9b8119388..1ea7b62ff 100644
--- a/packages/components/card/style/themes/seer.ts
+++ b/packages/components/card/style/themes/seer.ts
@@ -3,5 +3,6 @@
import '@idux/components/button/style/themes/seer'
import '@idux/components/grid/style/themes/seer'
import '@idux/components/header/style/themes/seer'
+import '@idux/components/icon/style/themes/seer'
import './seer.less'
diff --git a/packages/components/date-picker/style/themes/default.ts b/packages/components/date-picker/style/themes/default.ts
index 5597435d5..cb6538304 100644
--- a/packages/components/date-picker/style/themes/default.ts
+++ b/packages/components/date-picker/style/themes/default.ts
@@ -1,6 +1,7 @@
// style dependencies
import '@idux/components/_private/overlay/style/themes/default'
+import '@idux/components/_private/trigger/style/themes/default'
import '@idux/components/icon/style/themes/default'
import '@idux/components/input/style/themes/default'
diff --git a/packages/components/date-picker/style/themes/seer.ts b/packages/components/date-picker/style/themes/seer.ts
index 1d6addce8..af77436ca 100644
--- a/packages/components/date-picker/style/themes/seer.ts
+++ b/packages/components/date-picker/style/themes/seer.ts
@@ -1,6 +1,8 @@
// style dependencies
import '@idux/components/_private/overlay/style/themes/seer'
+import '@idux/components/_private/trigger/style/themes/seer'
import '@idux/components/icon/style/themes/seer'
+import '@idux/components/input/style/themes/seer'
import './seer.less'
diff --git a/packages/components/form/docs/Theme.zh.md b/packages/components/form/docs/Theme.zh.md
index f7c7d4094..8002ab269 100644
--- a/packages/components/form/docs/Theme.zh.md
+++ b/packages/components/form/docs/Theme.zh.md
@@ -9,9 +9,9 @@
| `@form-height-sm` | `@height-sm` | - | - |
| `@form-height-md` | `@height-md` | - | - |
| `@form-height-lg` | `@height-lg` | - | - |
-| `@form-padding-horizontal-sm` | `@spacing-sm - 2px` | - | - |
-| `@form-padding-horizontal-md` | `@spacing-md` | - | - |
-| `@form-padding-horizontal-lg` | `@spacing-sm + 2px` | - | - |
+| `@form-padding-horizontal-sm` | `7px` | `11px` | - |
+| `@form-padding-horizontal-md` | `11px` | - | - |
+| `@form-padding-horizontal-lg` | `11px` | - | - |
| `@form-padding-vertical-sm` | `max( (round(((@form-height-sm - @form-font-size-sm * @form-line-height) / 2) * 10) / 10) - @form-border-width, 0)` | - | - |
| `@form-padding-vertical-md` | `max( (round(((@form-height-md - @form-font-size-md * @form-line-height) / 2) * 10) / 10) - @form-border-width, 2px)` | - | - |
| `@form-padding-vertical-lg` | `(ceil(((@form-height-lg - @form-font-size-lg * @form-line-height) / 2) * 10) / 10) - @form-border-width` | - | - |
@@ -36,6 +36,31 @@
| `@form-disabled-background-color` | `var(--ix-background-color-deep)` | - | - |
| `@form-icon-color` | `@color-graphite-d20` | - | - |
| `@form-icon-hover-color` | `@color-graphite-d20` | `@color-primary` | - |
+| `@form-new-height-sm` | `var(--ix-height-sm)` | - | - |
+| `@form-new-height-md` | `var(--ix-height-md)` | - | - |
+| `@form-new-height-lg` | `var(--ix-height-lg)` | - | - |
+| `@form-new-padding-horizontal-sm` | `7px` | - | - |
+| `@form-new-padding-horizontal-md` | `11px` | - | - |
+| `@form-new-padding-horizontal-lg` | `11px` | - | - |
+| `@form-new-font-size-sm` | `var(--ix-font-size-sm)` | `var(--ix-font-size-sm)` | - |
+| `@form-new-font-size-md` | `var(--ix-font-size-md)` | `var(--ix-font-size-sm)` | - |
+| `@form-new-font-size-lg` | `var(--ix-font-size-lg)` | `var(--ix-font-size-md)` | - |
+| `@form-new-border-radius-sm` | `var(--ix-border-radius-sm)` | - | - |
+| `@form-new-border-radius-md` | `var(--ix-border-radius-md)` | `var(--ix-border-radius-sm)` | - |
+| `@form-new-border-radius-lg` | `var(--ix-border-radius-lg)` | `var(--ix-border-radius-sm)` | - |
+| `@form-new-placeholder-color` | `var(--ix-text-color-disabled)` | - | - |
+| `@form-new-color` | `var(--ix-text-color)` | - | - |
+| `@form-new-color-invalid` | `var(--ix-color-red)` | - | - |
+| `@form-new-color-disabled` | `var(--ix-text-color-disabled)` | - | - |
+| `@form-new-background-color` | `var(--ix-background-color)` | - | - |
+| `@form-new-background-color-disabled` | `var(--ix-background-color-deep)` | - | - |
+| `@form-new-border-color` | `var(--ix-border-color)` | - | - |
+| `@form-new-border-color-focus` | `var(--ix-color-primary)` | - | - |
+| `@form-new-box-shadow-focus` | `0 0 0 2px fade(@color-primary, 20%)` | - | - |
+| `@form-new-box-shadow-invalid` | `0 0 0 2px fade(@color-red, 20%)` | - | - |
+| `@form-new-icon-color` | `var(--ix-text-color-title-secondary)` | - | - |
+| `@form-new-icon-color-hover` | `var(--ix-color-primary)` | - | - |
+| `@form-new-icon-font-size` | `var(--ix-font-size-lg)` | - | - |
| `@form-item-valid-color` | `@color-success` | `@color-success-d10` | - |
| `@form-item-validating-color` | `@color-pending` | `@color-pending-d10` | - |
| `@form-item-invalid-color` | `@color-error` | `@color-error-d10` | - |
diff --git a/packages/components/form/style/themes/default.variable.less b/packages/components/form/style/themes/default.variable.less
index 120a999e0..4b85807f9 100644
--- a/packages/components/form/style/themes/default.variable.less
+++ b/packages/components/form/style/themes/default.variable.less
@@ -7,9 +7,9 @@
@form-height-sm: @height-sm;
@form-height-md: @height-md;
@form-height-lg: @height-lg;
-@form-padding-horizontal-sm: @spacing-sm - 2px;
-@form-padding-horizontal-md: @spacing-md;
-@form-padding-horizontal-lg: @spacing-sm + 2px;
+@form-padding-horizontal-sm: 7px;
+@form-padding-horizontal-md: 11px;
+@form-padding-horizontal-lg: 11px;
@form-padding-vertical-sm: max(
(round(((@form-height-sm - @form-font-size-sm * @form-line-height) / 2) * 10) / 10) - @form-border-width,
0
@@ -43,6 +43,42 @@
@form-disabled-background-color: var(--ix-background-color-deep);
@form-icon-color: @color-graphite-d20;
@form-icon-hover-color: @color-graphite-d20;
+
+@form-new-height-sm: var(--ix-height-sm);
+@form-new-height-md: var(--ix-height-md);
+@form-new-height-lg: var(--ix-height-lg);
+
+@form-new-padding-horizontal-sm: 7px;
+@form-new-padding-horizontal-md: 11px;
+@form-new-padding-horizontal-lg: 11px;
+
+@form-new-font-size-sm: var(--ix-font-size-sm);
+@form-new-font-size-md: var(--ix-font-size-md);
+@form-new-font-size-lg: var(--ix-font-size-lg);
+
+@form-new-border-radius-sm: var(--ix-border-radius-sm);
+@form-new-border-radius-md: var(--ix-border-radius-md);
+@form-new-border-radius-lg: var(--ix-border-radius-lg);
+
+@form-new-placeholder-color: var(--ix-text-color-disabled);
+
+@form-new-color: var(--ix-text-color);
+@form-new-color-invalid: var(--ix-color-red);
+@form-new-color-disabled: var(--ix-text-color-disabled);
+
+@form-new-background-color: var(--ix-background-color);
+@form-new-background-color-disabled: var(--ix-background-color-deep);
+
+@form-new-border-color: var(--ix-border-color);
+@form-new-border-color-focus: var(--ix-color-primary);
+
+@form-new-box-shadow-focus: 0 0 0 2px fade(@color-primary, 20%);
+@form-new-box-shadow-invalid: 0 0 0 2px fade(@color-red, 20%);
+
+@form-new-icon-color: var(--ix-text-color-title-secondary);
+@form-new-icon-color-hover: var(--ix-color-primary);
+@form-new-icon-font-size: var(--ix-font-size-lg);
+
// input common end
@form-item-valid-color: @color-success;
diff --git a/packages/components/form/style/themes/seer.variable.less b/packages/components/form/style/themes/seer.variable.less
index 0694c9c36..2e1c139a8 100644
--- a/packages/components/form/style/themes/seer.variable.less
+++ b/packages/components/form/style/themes/seer.variable.less
@@ -5,6 +5,17 @@
@form-font-size-md: @font-size-sm;
@form-font-size-lg: @font-size-md;
+@form-padding-horizontal-sm: 11px;
+
+@form-new-padding-horizontal-sm: 11px;
+
+@form-new-font-size-sm: var(--ix-font-size-sm);
+@form-new-font-size-md: var(--ix-font-size-sm);
+@form-new-font-size-lg: var(--ix-font-size-md);
+
+@form-new-border-radius-md: var(--ix-border-radius-sm);
+@form-new-border-radius-lg: var(--ix-border-radius-sm);
+
@form-item-valid-color: @color-success-d10;
@form-item-validating-color: @color-pending-d10;
@form-item-invalid-color: @color-error-d10;
diff --git a/packages/components/input-number/docs/Theme.zh.md b/packages/components/input-number/docs/Theme.zh.md
index 695e77784..f74ff3132 100644
--- a/packages/components/input-number/docs/Theme.zh.md
+++ b/packages/components/input-number/docs/Theme.zh.md
@@ -1,5 +1,2 @@
| 名称 | default | seer | 备注 |
| --- | --- | --- | --- |
-| `@input-number-color-disabled` | `@input-color-disabled` | - | - |
-| `@input-number-icon-color-hover` | `@input-icon-color-hover` | - | - |
-| `@input-number-invalid-color` | `@form-invalid-color` | - | - |
diff --git a/packages/components/input-number/style/index.less b/packages/components/input-number/style/index.less
index c794d3a84..3d58b2f04 100644
--- a/packages/components/input-number/style/index.less
+++ b/packages/components/input-number/style/index.less
@@ -18,12 +18,12 @@
transition: color var(--ix-transition-duration-fast);
&:hover {
- color: @input-number-icon-color-hover;
+ color: @form-new-icon-color-hover;
}
&&-disabled {
cursor: not-allowed;
- color: @input-number-color-disabled;
+ color: @form-new-color-disabled;
}
}
@@ -33,7 +33,7 @@
&-illegal {
.@{input-prefix}-inner {
- color: @input-number-invalid-color;
+ color: @form-new-color-invalid;
}
}
diff --git a/packages/components/input-number/style/themes/default.variable.less b/packages/components/input-number/style/themes/default.variable.less
index db4e47b51..e69de29bb 100644
--- a/packages/components/input-number/style/themes/default.variable.less
+++ b/packages/components/input-number/style/themes/default.variable.less
@@ -1,3 +0,0 @@
-@input-number-color-disabled: @input-color-disabled;
-@input-number-icon-color-hover: @input-icon-color-hover;
-@input-number-invalid-color: @form-invalid-color;
diff --git a/packages/components/input/demo/Addon.vue b/packages/components/input/demo/Addon.vue
index 30ef68887..ce7383033 100644
--- a/packages/components/input/demo/Addon.vue
+++ b/packages/components/input/demo/Addon.vue
@@ -3,13 +3,13 @@
-
+
-
+
diff --git a/packages/components/input/demo/PrefixSuffix.vue b/packages/components/input/demo/PrefixSuffix.vue
index 69e03a313..304c42b2a 100644
--- a/packages/components/input/demo/PrefixSuffix.vue
+++ b/packages/components/input/demo/PrefixSuffix.vue
@@ -1,6 +1,6 @@
-
+
¥
RMB
diff --git a/packages/components/input/docs/Theme.zh.md b/packages/components/input/docs/Theme.zh.md
index fe32f30da..219efece6 100644
--- a/packages/components/input/docs/Theme.zh.md
+++ b/packages/components/input/docs/Theme.zh.md
@@ -1,23 +1,3 @@
| 名称 | default | seer | 备注 |
| --- | --- | --- | --- |
-| `@input-height-sm` | `var(--ix-height-sm)` | - | - |
-| `@input-height-md` | `var(--ix-height-md)` | - | - |
-| `@input-height-lg` | `var(--ix-height-lg)` | - | - |
-| `@input-font-size-sm` | `var(--ix-font-size-sm)` | `var(--ix-font-size-sm)` | - |
-| `@input-font-size-md` | `var(--ix-font-size-md)` | `var(--ix-font-size-sm)` | - |
-| `@input-font-size-lg` | `var(--ix-font-size-lg)` | `var(--ix-font-size-md)` | - |
-| `@input-border-radius-sm` | `var(--ix-border-radius-sm)` | - | - |
-| `@input-border-radius-md` | `var(--ix-border-radius-md)` | `var(--ix-border-radius-sm)` | - |
-| `@input-border-radius-lg` | `var(--ix-border-radius-lg)` | `var(--ix-border-radius-sm)` | - |
-| `@input-color` | `var(--ix-text-color)` | - | - |
-| `@input-color-disabled` | `var(--ix-text-color-disabled)` | - | - |
-| `@input-placeholder-color` | `@form-placeholder-color` | - | - |
-| `@input-background-color` | `var(--ix-background-color)` | - | - |
-| `@input-background-color-disabled` | `var(--ix-background-color-deep)` | - | - |
-| `@input-border-color` | `var(--ix-border-color)` | - | - |
-| `@input-border-color-focus` | `var(--ix-color-primary)` | - | - |
-| `@input-box-shadow-focus` | `0 0 0 2px fade(@color-primary, 20%)` | - | - |
-| `@input-icon-color` | `var(--ix-text-color-title-secondary)` | - | - |
-| `@input-icon-color-hover` | `var(--ix-color-primary)` | - | - |
-| `@input-icon-font-size` | `var(--ix-font-size-lg)` | - | - |
| `@input-addon-background-color` | `var(--ix-background-color-light)` | - | - |
diff --git a/packages/components/input/src/Input.tsx b/packages/components/input/src/Input.tsx
index 113813335..80c2ce732 100644
--- a/packages/components/input/src/Input.tsx
+++ b/packages/components/input/src/Input.tsx
@@ -65,11 +65,12 @@ export default defineComponent({
disabled={accessor.disabled}
focused={isFocused.value}
prefix={prefix}
+ readonly={props.readonly}
size={mergedSize.value}
status={mergedStatus.value}
suffix={suffix}
+ value={accessor.value}
onClear={handleClear}
- readonly={props.readonly}
onInput={handleInput}
onCompositionstart={handleCompositionStart}
onCompositionend={handleCompositionEnd}
diff --git a/packages/components/input/style/index.less b/packages/components/input/style/index.less
index 57219d4a8..fd71df570 100644
--- a/packages/components/input/style/index.less
+++ b/packages/components/input/style/index.less
@@ -4,18 +4,18 @@
.@{input-prefix} {
.reset-component-new();
- .reset-color(@input-color, @input-background-color);
+ .reset-color(@form-new-color, @form-new-background-color);
&-sm {
- .input-size(@input-height-sm, @input-font-size-sm, @input-border-radius-sm);
+ .input-size(@form-new-height-sm, @form-new-font-size-sm, @form-new-padding-horizontal-sm, @form-new-border-radius-sm);
}
&-md {
- .input-size(@input-height-md, @input-font-size-md, @input-border-radius-md);
+ .input-size(@form-new-height-md, @form-new-font-size-md, @form-new-padding-horizontal-md, @form-new-border-radius-md);
}
&-lg {
- .input-size(@input-height-lg, @input-font-size-lg, @input-border-radius-lg);
+ .input-size(@form-new-height-lg, @form-new-font-size-lg, @form-new-padding-horizontal-lg, @form-new-border-radius-lg);
}
&,
@@ -26,18 +26,18 @@
&:hover,
&-inner:hover,
&-wrapper:hover {
- border-color: @input-border-color-focus;
+ border-color: @form-new-border-color-focus;
}
&:focus,
&-focused {
- border-color: @input-border-color-focus;
- box-shadow: @input-box-shadow-focus;
+ border-color: @form-new-border-color-focus;
+ box-shadow: @form-new-box-shadow-focus;
.@{input-prefix}-inner,
.@{input-prefix}-wrapper {
- border-color: @input-border-color-focus;
- box-shadow: @input-box-shadow-focus;
+ border-color: @form-new-border-color-focus;
+ box-shadow: @form-new-box-shadow-focus;
}
}
@@ -87,30 +87,6 @@
transition: all var(--ix-transition-duration-fast) var(--ix-ease-in-out);
}
- &,
- &-wrapper,
- &-inner {
- // border-width: 1px
- padding: 0 7px 0 11px;
- }
-
- &-addon {
- padding: 0 11px;
-
- .@{selector-prefix} {
- margin: 0 -11px;
- }
- }
-
- &-clear {
- right: 7px;
- }
-
- &-clearable:not(&-with-suffix) &-inner {
- // icon-font-size + 4px
- padding-right: 20px;
- }
-
&-with-addon-after,
&-with-addon-before {
display: inline-flex;
@@ -123,11 +99,21 @@
}
}
+ &-with-addon-before &-inner {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+
+ &-with-addon-after &-inner {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ }
+
&-addon {
display: inline-block;
text-align: center;
background-color: @input-addon-background-color;
- border: 1px solid @input-border-color;
+ border: 1px solid @form-new-border-color;
white-space: nowrap;
&:first-child {
@@ -163,6 +149,12 @@
box-shadow: none;
}
+ // TODO: select 那边要去掉这两个样式
+ &-item {
+ left: unset !important;
+ width: unset !important;
+ }
+
&-item-label {
width: 100%;
}
@@ -189,8 +181,8 @@
&-prefix {
display: inline-flex;
align-items: center;
- color: @input-icon-color;
- font-size: @input-icon-font-size;
+ color: @form-new-icon-color;
+ font-size: @form-new-icon-font-size;
}
&-prefix {
@@ -202,18 +194,23 @@
cursor: pointer;
}
+ &-clearable:not(&-with-suffix) &-inner {
+ padding-right: @form-new-icon-font-size;
+ }
+
&-clear {
position: absolute;
z-index: 1;
- color: @input-icon-color;
- font-size: @input-icon-font-size;
+ right: 7px;
+ color: @form-new-icon-color;
+ font-size: @form-new-icon-font-size;
cursor: pointer;
opacity: 0;
- background: @input-background-color;
+ background: @form-new-background-color;
transition: all var(--ix-transition-duration-fast) var(--ix-ease-in-out);
&:hover {
- color: @input-icon-color-hover;
+ color: @form-new-icon-color-hover;
}
&.visible {
@@ -226,7 +223,7 @@
display: inline-flex;
align-items: center;
width: 100%;
- border: 1px solid @input-border-color;
+ border: 1px solid @form-new-border-color;
.@{input-prefix}-inner {
padding: 0;
@@ -237,25 +234,25 @@
// form status
&&-invalid {
- border-color: @form-invalid-color;
+ border-color: @form-new-color-invalid;
&:hover {
- border-color: @form-invalid-color;
+ border-color: @form-new-color-invalid;
}
.@{input-prefix}-wrapper,
.@{input-prefix}-inner {
- border-color: @form-invalid-color;
+ border-color: @form-new-color-invalid;
&:hover {
- border-color: @form-invalid-color;
+ border-color: @form-new-color-invalid;
}
}
&:focus,
&.@{input-prefix}-focused {
- border-color: @form-invalid-color;
- box-shadow: @form-invalid-box-shadow;
+ border-color: @form-new-color-invalid;
+ box-shadow: @form-new-box-shadow-invalid;
.@{input-prefix}-wrapper,
.@{input-prefix}-inner {
@@ -264,8 +261,8 @@
}
.@{input-prefix}-addon {
- color: @form-invalid-color;
- border-color: @form-invalid-color;
+ color: @form-new-color-invalid;
+ border-color: @form-new-color-invalid;
.@{selector-prefix} {
&:hover &-content,
diff --git a/packages/components/input/style/mixin.less b/packages/components/input/style/mixin.less
index 7c8c3bb8b..d3665d4d9 100644
--- a/packages/components/input/style/mixin.less
+++ b/packages/components/input/style/mixin.less
@@ -4,22 +4,40 @@
width: 100%;
min-width: 0;
outline: 0;
- color: @input-color;
- border: 1px solid @input-border-color;
+ color: @form-new-color;
+ border: 1px solid @form-new-border-color;
&[disabled] {
cursor: not-allowed;
}
- .placeholder(@input-placeholder-color);
+ .placeholder(@form-new-placeholder-color);
}
-.input-size(@height, @font-size, @border-radius) {
+.input-size(@height, @font-size, @padding-horizontal, @border-radius) {
.reset-font-size(@font-size);
height: @height;
&,
+ .@{input-prefix}-addon,
+ .@{input-prefix}-inner,
+ .@{input-prefix}-wrapper {
+ padding: 0 @padding-horizontal;
+ }
+
+ .@{input-prefix}-suffix {
+ margin-right: calc(7px - @padding-horizontal);
+ }
+
+ .@{input-prefix}-addon {
+ .@{selector-prefix} {
+ margin: -5px -@padding-horizontal;
+ }
+ }
+
+ &,
+ .@{input-prefix}-inner,
.@{input-prefix}-addon {
border-radius: @border-radius;
}
@@ -31,13 +49,13 @@
}
.input-disabled() {
- color: @input-color-disabled;
- background-color: @input-background-color-disabled;
- border-color: @input-border-color;
+ color: @form-new-color-disabled;
+ background-color: @form-new-background-color-disabled;
+ border-color: @form-new-border-color;
box-shadow: none;
cursor: not-allowed;
&:hover {
- border-color: @input-border-color;
+ border-color: @form-new-border-color;
}
}
diff --git a/packages/components/input/style/themes/default.variable.less b/packages/components/input/style/themes/default.variable.less
index 19c0dac65..06ca978a6 100644
--- a/packages/components/input/style/themes/default.variable.less
+++ b/packages/components/input/style/themes/default.variable.less
@@ -1,29 +1 @@
-@input-height-sm: var(--ix-height-sm);
-@input-height-md: var(--ix-height-md);
-@input-height-lg: var(--ix-height-lg);
-
-@input-font-size-sm: var(--ix-font-size-sm);
-@input-font-size-md: var(--ix-font-size-md);
-@input-font-size-lg: var(--ix-font-size-lg);
-
-@input-border-radius-sm: var(--ix-border-radius-sm);
-@input-border-radius-md: var(--ix-border-radius-md);
-@input-border-radius-lg: var(--ix-border-radius-lg);
-
-@input-color: var(--ix-text-color);
-@input-color-disabled: var(--ix-text-color-disabled);
-@input-placeholder-color: @form-placeholder-color;
-
-@input-background-color: var(--ix-background-color);
-@input-background-color-disabled: var(--ix-background-color-deep);
-
-@input-border-color: var(--ix-border-color);
-@input-border-color-focus: var(--ix-color-primary);
-
-@input-box-shadow-focus: 0 0 0 2px fade(@color-primary, 20%);
-
-@input-icon-color: var(--ix-text-color-title-secondary);
-@input-icon-color-hover: var(--ix-color-primary);
-@input-icon-font-size: var(--ix-font-size-lg);
-
@input-addon-background-color: var(--ix-background-color-light);
diff --git a/packages/components/input/style/themes/seer.variable.less b/packages/components/input/style/themes/seer.variable.less
index e51089fb7..498793af1 100644
--- a/packages/components/input/style/themes/seer.variable.less
+++ b/packages/components/input/style/themes/seer.variable.less
@@ -1,8 +1 @@
@import './default.variable.less';
-
-@input-font-size-sm: var(--ix-font-size-sm);
-@input-font-size-md: var(--ix-font-size-sm);
-@input-font-size-lg: var(--ix-font-size-md);
-
-@input-border-radius-md: var(--ix-border-radius-sm);
-@input-border-radius-lg: var(--ix-border-radius-sm);
diff --git a/packages/components/locales/src/langs/en-US.ts b/packages/components/locales/src/langs/en-US.ts
index 6b2279ec0..a53eb43ef 100644
--- a/packages/components/locales/src/langs/en-US.ts
+++ b/packages/components/locales/src/langs/en-US.ts
@@ -67,8 +67,8 @@ const enUS: Locale = {
totalSuffix: 'entries in total',
},
popconfirm: {
- cancelText: 'No',
- okText: 'Yes',
+ cancelText: 'Cancel',
+ okText: 'OK',
},
select: {
limitMessage: 'Select ${0} or fewer items',
diff --git a/packages/components/menu/docs/Theme.zh.md b/packages/components/menu/docs/Theme.zh.md
index f9dea866a..db7503482 100644
--- a/packages/components/menu/docs/Theme.zh.md
+++ b/packages/components/menu/docs/Theme.zh.md
@@ -10,8 +10,8 @@
| `@menu-background-color-disabled` | `var(--ix-background-color)` | - | - |
| `@menu-horizontal-background-color-active` | `var(--ix-background-color-medium)` | - | - |
| `@menu-border-color` | `var(--ix-border-color-secondary)` | - | - |
-| `@menu-height` | `var(--ix-height-md)` | `36px` | - |
-| `@menu-height-level-1` | `var(--ix-height-lg)` | `44px` | - |
+| `@menu-height` | `var(--ix-height-md)` | - | - |
+| `@menu-height-level-1` | `var(--ix-height-lg)` | `40px` | - |
| `@menu-border-radius` | `var(--ix-border-radius-md)` | `0` | - |
| `@menu-font-size` | `var(--ix-font-size-md)` | `var(--ix-font-size-sm)` | - |
| `@menu-font-size-level-1` | `var(--ix-font-size-md)` | - | - |
diff --git a/packages/components/modal/style/index.less b/packages/components/modal/style/index.less
index 5578d6bbb..f0a9dc238 100644
--- a/packages/components/modal/style/index.less
+++ b/packages/components/modal/style/index.less
@@ -69,7 +69,7 @@
&-only-title {
align-items: center;
flex-direction: row;
- justify-content: start;
+ justify-content: flex-start;
.@{modal-prefix}-body-title {
margin-bottom: 0;
diff --git a/packages/components/popconfirm/style/index.less b/packages/components/popconfirm/style/index.less
index 652ff162e..3cd5ecd15 100644
--- a/packages/components/popconfirm/style/index.less
+++ b/packages/components/popconfirm/style/index.less
@@ -48,7 +48,7 @@
&-footer {
display: flex;
align-items: center;
- justify-content: end;
+ justify-content: flex-end;
padding: 8px 16px;
.@{button-prefix} + .@{button-prefix} {
diff --git a/packages/components/select/docs/Theme.zh.md b/packages/components/select/docs/Theme.zh.md
index 33daa009b..0bc12c072 100644
--- a/packages/components/select/docs/Theme.zh.md
+++ b/packages/components/select/docs/Theme.zh.md
@@ -7,9 +7,6 @@
| `@select-height-sm` | `@form-height-sm` | - | - |
| `@select-height-md` | `@form-height-md` | - | - |
| `@select-height-lg` | `@form-height-lg` | - | - |
-| `@select-padding-horizontal-sm` | `@form-padding-horizontal-sm` | `12px` | - |
-| `@select-padding-horizontal-md` | `@form-padding-horizontal-md` | `12px` | - |
-| `@select-padding-horizontal-lg` | `@form-padding-horizontal-lg` | `12px` | - |
| `@select-padding-vertical-sm` | `@form-padding-vertical-sm` | - | - |
| `@select-padding-vertical-md` | `@form-padding-vertical-md` | - | - |
| `@select-padding-vertical-lg` | `@form-padding-vertical-lg` | - | - |
diff --git a/packages/components/select/style/themes/default.variable.less b/packages/components/select/style/themes/default.variable.less
index 3dd5726f1..64a3c4f9e 100644
--- a/packages/components/select/style/themes/default.variable.less
+++ b/packages/components/select/style/themes/default.variable.less
@@ -5,9 +5,7 @@
@select-height-sm: @form-height-sm;
@select-height-md: @form-height-md;
@select-height-lg: @form-height-lg;
-@select-padding-horizontal-sm: @form-padding-horizontal-sm;
-@select-padding-horizontal-md: @form-padding-horizontal-md;
-@select-padding-horizontal-lg: @form-padding-horizontal-lg;
+
@select-padding-vertical-sm: @form-padding-vertical-sm;
@select-padding-vertical-md: @form-padding-vertical-md;
@select-padding-vertical-lg: @form-padding-vertical-lg;
diff --git a/packages/components/select/style/themes/seer.variable.less b/packages/components/select/style/themes/seer.variable.less
index 716bcc8ef..d8d3a28c1 100644
--- a/packages/components/select/style/themes/seer.variable.less
+++ b/packages/components/select/style/themes/seer.variable.less
@@ -1,12 +1,8 @@
-@import './default.variable.less';
+@import './default.variable.less';
@select-font-size-lg: @form-font-size-md;
@select-font-size-md: @form-font-size-sm;
-@select-padding-horizontal-sm: 12px;
-@select-padding-horizontal-md: 12px;
-@select-padding-horizontal-lg: 12px;
-
@select-icon-color: @color-graphite-l10;
@select-icon-hover-color: @color-primary;
@select-icon-font-size: @font-size-lg;
diff --git a/packages/components/style/motion/fade.less b/packages/components/style/motion/fade.less
index e5107a2e1..b8a39818b 100644
--- a/packages/components/style/motion/fade.less
+++ b/packages/components/style/motion/fade.less
@@ -8,7 +8,9 @@
transition-timing-function: linear;
}
+ .@{idux-prefix}-@{className}-enter,
.@{idux-prefix}-@{className}-enter-from,
+ .@{idux-prefix}-@{className}-leave,
.@{idux-prefix}-@{className}-leave-to {
opacity: 0;
}
@@ -18,7 +20,7 @@
.fade-motion(fade-fast, @transition-duration-fast);
.@{idux-prefix}-fade-down {
- &-enter-active{
+ &-enter-active {
transition: opacity @transition-duration-fast @ease-in-out, transform @transition-duration-fast @ease-in-out;
}
diff --git a/packages/components/style/motion/move.less b/packages/components/style/motion/move.less
index 43f89dc59..66d247cd0 100644
--- a/packages/components/style/motion/move.less
+++ b/packages/components/style/motion/move.less
@@ -15,7 +15,9 @@
transition-timing-function: @ease-in-circ;
}
+ .@{idux-prefix}-@{className}-enter,
.@{idux-prefix}-@{className}-enter-from,
+ .@{idux-prefix}-@{className}-leave,
.@{idux-prefix}-@{className}-leave-to {
transform: @translate;
opacity: 0;
diff --git a/packages/components/style/motion/zoom.less b/packages/components/style/motion/zoom.less
index 94620f184..a1a682e5d 100644
--- a/packages/components/style/motion/zoom.less
+++ b/packages/components/style/motion/zoom.less
@@ -17,6 +17,7 @@
transition-timing-function: var(--ix-ease-in-circ);
}
+ .@{idux-prefix}-@{className}-enter,
.@{idux-prefix}-@{className}-enter-from,
.@{idux-prefix}-@{className}-leave-to {
opacity: 0;
diff --git a/packages/components/switch/docs/Theme.zh.md b/packages/components/switch/docs/Theme.zh.md
index 63f8f57e0..13f22b44d 100644
--- a/packages/components/switch/docs/Theme.zh.md
+++ b/packages/components/switch/docs/Theme.zh.md
@@ -5,9 +5,6 @@
| `@switch-height-sm` | `@form-height-xs` | - | - |
| `@switch-height-md` | `@form-height-sm` | - | - |
| `@switch-height-lg` | `@form-height-md` | - | - |
-| `@switch-padding-horizontal-sm` | `@form-padding-horizontal-sm` | - | - |
-| `@switch-padding-horizontal-md` | `@form-padding-horizontal-md` | - | - |
-| `@switch-padding-horizontal-lg` | `@form-padding-horizontal-lg` | - | - |
| `@switch-border-radius` | `@border-radius-full` | - | - |
| `@switch-color` | `@form-background-color` | - | - |
| `@switch-background-color` | `@form-placeholder-color` | `@color-graphite-l10` | - |
diff --git a/packages/components/switch/style/index.less b/packages/components/switch/style/index.less
index 1939758ff..f3c8bea51 100644
--- a/packages/components/switch/style/index.less
+++ b/packages/components/switch/style/index.less
@@ -58,14 +58,14 @@
}
&-sm {
- .switch-size(@switch-height-sm, @switch-icon-font-size-sm, @switch-box-size-sm, @switch-box-size-padding, 0px, @switch-padding-horizontal-sm);
+ .switch-size(@switch-height-sm, @switch-icon-font-size-sm, @switch-box-size-sm, @switch-box-size-padding, 0px, @form-new-padding-horizontal-sm);
}
&-md {
- .switch-size(@switch-height-md, @switch-icon-font-size-md, @switch-box-size-md, @switch-box-size-padding, 1px, @switch-padding-horizontal-md);
+ .switch-size(@switch-height-md, @switch-icon-font-size-md, @switch-box-size-md, @switch-box-size-padding, 1px, @form-new-padding-horizontal-md);
}
&-lg {
- .switch-size(@switch-height-lg, @switch-icon-font-size-lg, @switch-box-size-lg, @switch-box-size-padding, 1px, @switch-padding-horizontal-lg);
+ .switch-size(@switch-height-lg, @switch-icon-font-size-lg, @switch-box-size-lg, @switch-box-size-padding, 1px, @form-new-padding-horizontal-lg);
}
}
diff --git a/packages/components/switch/style/themes/default.variable.less b/packages/components/switch/style/themes/default.variable.less
index 6df7f8e79..94c2dee1d 100644
--- a/packages/components/switch/style/themes/default.variable.less
+++ b/packages/components/switch/style/themes/default.variable.less
@@ -3,9 +3,7 @@
@switch-height-sm: @form-height-xs;
@switch-height-md: @form-height-sm;
@switch-height-lg: @form-height-md;
-@switch-padding-horizontal-sm: @form-padding-horizontal-sm;
-@switch-padding-horizontal-md: @form-padding-horizontal-md;
-@switch-padding-horizontal-lg: @form-padding-horizontal-lg;
+
@switch-border-radius: @border-radius-full;
@switch-color: @form-background-color;
diff --git a/packages/components/table/style/index.less b/packages/components/table/style/index.less
index 172285c8f..b46e14eef 100644
--- a/packages/components/table/style/index.less
+++ b/packages/components/table/style/index.less
@@ -110,7 +110,7 @@
text-align: end;
.@{table-prefix}-cell-triggers {
- justify-content: end;
+ justify-content: flex-end;
}
}
}
diff --git a/packages/components/textarea/docs/Theme.zh.md b/packages/components/textarea/docs/Theme.zh.md
index ef2a1968e..5c561447f 100644
--- a/packages/components/textarea/docs/Theme.zh.md
+++ b/packages/components/textarea/docs/Theme.zh.md
@@ -4,9 +4,6 @@
| `@textarea-font-size-md` | `@form-font-size-md` | - | - |
| `@textarea-font-size-lg` | `@form-font-size-lg` | - | - |
| `@textarea-line-height` | `@form-line-height` | - | - |
-| `@textarea-padding-horizontal-sm` | `@form-padding-horizontal-sm` | - | - |
-| `@textarea-padding-horizontal-md` | `@form-padding-horizontal-md` | - | - |
-| `@textarea-padding-horizontal-lg` | `@form-padding-horizontal-lg` | - | - |
| `@textarea-padding-vertical-sm` | `@form-padding-vertical-sm` | - | - |
| `@textarea-padding-vertical-md` | `@form-padding-vertical-md` | - | - |
| `@textarea-padding-vertical-lg` | `@form-padding-vertical-lg` | - | - |
diff --git a/packages/components/textarea/style/index.less b/packages/components/textarea/style/index.less
index 850899905..baaeae88c 100644
--- a/packages/components/textarea/style/index.less
+++ b/packages/components/textarea/style/index.less
@@ -32,15 +32,15 @@
}
&-sm {
- .textarea-size(@textarea-font-size-sm, @textarea-padding-vertical-sm, @textarea-padding-horizontal-sm);
+ .textarea-size(@textarea-font-size-sm, @textarea-padding-vertical-sm, @form-new-padding-horizontal-sm);
}
&-md {
- .textarea-size(@textarea-font-size-md, @textarea-padding-vertical-md, @textarea-padding-horizontal-md);
+ .textarea-size(@textarea-font-size-md, @textarea-padding-vertical-md, @form-new-padding-horizontal-md);
}
&-lg {
- .textarea-size(@textarea-font-size-lg, @textarea-padding-vertical-lg, @textarea-padding-horizontal-lg);
+ .textarea-size(@textarea-font-size-lg, @textarea-padding-vertical-lg, @form-new-padding-horizontal-lg);
}
&-focused {
diff --git a/packages/components/textarea/style/themes/default.variable.less b/packages/components/textarea/style/themes/default.variable.less
index b20bc7acf..0ca07df95 100644
--- a/packages/components/textarea/style/themes/default.variable.less
+++ b/packages/components/textarea/style/themes/default.variable.less
@@ -2,9 +2,7 @@
@textarea-font-size-md: @form-font-size-md;
@textarea-font-size-lg: @form-font-size-lg;
@textarea-line-height: @form-line-height;
-@textarea-padding-horizontal-sm: @form-padding-horizontal-sm;
-@textarea-padding-horizontal-md: @form-padding-horizontal-md;
-@textarea-padding-horizontal-lg: @form-padding-horizontal-lg;
+
@textarea-padding-vertical-sm: @form-padding-vertical-sm;
@textarea-padding-vertical-md: @form-padding-vertical-md;
@textarea-padding-vertical-lg: @form-padding-vertical-lg;
diff --git a/packages/components/tree/style/mixin.less b/packages/components/tree/style/mixin.less
index d34e2d176..3d26784b1 100644
--- a/packages/components/tree/style/mixin.less
+++ b/packages/components/tree/style/mixin.less
@@ -1,13 +1,24 @@
// https://www.zhangxinxu.com/study/201710/css3-linear-gradient-dashed-generate.html
.horizontal-line() {
- height: @tree-node-line-size;
- background: linear-gradient(to right, @tree-node-line-color, @tree-node-line-color 2.25px, transparent 2.25px, transparent);
- background-size: 3px 100%;
- }
-
- .vertical-line() {
- width: @tree-node-line-size;
- background: linear-gradient(to bottom, @tree-node-line-color, @tree-node-line-color 2.25px, transparent 2.25px, transparent);
- background-size: 100% 3px;
- }
-
\ No newline at end of file
+ height: @tree-node-line-size;
+ background: linear-gradient(
+ to right,
+ @tree-node-line-color,
+ @tree-node-line-color 2.25px,
+ transparent 2.25px,
+ transparent
+ );
+ background-size: 3px 100%;
+}
+
+.vertical-line() {
+ width: @tree-node-line-size;
+ background: linear-gradient(
+ to bottom,
+ @tree-node-line-color,
+ @tree-node-line-color 2.25px,
+ transparent 2.25px,
+ transparent
+ );
+ background-size: 100% 3px;
+}
diff --git a/packages/pro/textarea/docs/Theme.zh.md b/packages/pro/textarea/docs/Theme.zh.md
index baabe84f3..2ebe5552e 100644
--- a/packages/pro/textarea/docs/Theme.zh.md
+++ b/packages/pro/textarea/docs/Theme.zh.md
@@ -6,9 +6,6 @@
| `@pro-textarea-font-size-sm` | `@form-font-size-sm` | - | - |
| `@pro-textarea-font-size-md` | `@form-font-size-md` | - | - |
| `@pro-textarea-font-size-lg` | `@form-font-size-lg` | - | - |
-| `@pro-textarea-padding-horizontal-sm` | `@form-padding-horizontal-sm` | - | - |
-| `@pro-textarea-padding-horizontal-md` | `@form-padding-horizontal-md` | - | - |
-| `@pro-textarea-padding-horizontal-lg` | `@form-padding-horizontal-lg` | - | - |
| `@pro-textarea-padding-vertical-sm` | `@form-padding-vertical-sm` | - | - |
| `@pro-textarea-padding-vertical-md` | `@form-padding-vertical-md` | - | - |
| `@pro-textarea-padding-vertical-lg` | `@form-padding-vertical-lg` | - | - |
diff --git a/packages/pro/textarea/style/index.less b/packages/pro/textarea/style/index.less
index 10477b846..1dcbd2d68 100644
--- a/packages/pro/textarea/style/index.less
+++ b/packages/pro/textarea/style/index.less
@@ -16,15 +16,15 @@
overflow: hidden;
&-sm {
- .textarea-size(@pro-textarea-font-size-sm, @pro-textarea-padding-vertical-sm, @pro-textarea-padding-horizontal-sm);
+ .textarea-size(@pro-textarea-font-size-sm, @pro-textarea-padding-vertical-sm, @form-new-padding-horizontal-sm);
}
&-md {
- .textarea-size(@pro-textarea-font-size-md, @pro-textarea-padding-vertical-md, @pro-textarea-padding-horizontal-md);
+ .textarea-size(@pro-textarea-font-size-md, @pro-textarea-padding-vertical-md, @form-new-padding-horizontal-md);
}
&-lg {
- .textarea-size(@pro-textarea-font-size-lg, @pro-textarea-padding-vertical-lg, @pro-textarea-padding-horizontal-lg);
+ .textarea-size(@pro-textarea-font-size-lg, @pro-textarea-padding-vertical-lg, @form-new-padding-horizontal-lg);
}
&-scroll-holder {
diff --git a/packages/pro/textarea/style/themes/default.variable.less b/packages/pro/textarea/style/themes/default.variable.less
index 343405dc0..b797a32a3 100644
--- a/packages/pro/textarea/style/themes/default.variable.less
+++ b/packages/pro/textarea/style/themes/default.variable.less
@@ -6,9 +6,7 @@
@pro-textarea-font-size-md: @form-font-size-md;
@pro-textarea-font-size-lg: @form-font-size-lg;
@pro-textarea-line-height: @form-line-height;
-@pro-textarea-padding-horizontal-sm: @form-padding-horizontal-sm;
-@pro-textarea-padding-horizontal-md: @form-padding-horizontal-md;
-@pro-textarea-padding-horizontal-lg: @form-padding-horizontal-lg;
+
@pro-textarea-padding-vertical-sm: @form-padding-vertical-sm;
@pro-textarea-padding-vertical-md: @form-padding-vertical-md;
@pro-textarea-padding-vertical-lg: @form-padding-vertical-lg;
@@ -39,4 +37,4 @@
@pro-textarea-count-bottom: 1px;
@pro-textarea-count-right: 8px;
@pro-textarea-count-opacity: 0.9;
-@pro-textarea-count-color: @pro-textarea-placeholder-color;
\ No newline at end of file
+@pro-textarea-count-color: @pro-textarea-placeholder-color;
diff --git a/packages/pro/textarea/style/themes/seer.variable.less b/packages/pro/textarea/style/themes/seer.variable.less
index 498793af1..bc81c357c 100644
--- a/packages/pro/textarea/style/themes/seer.variable.less
+++ b/packages/pro/textarea/style/themes/seer.variable.less
@@ -1 +1,9 @@
@import './default.variable.less';
+
+@pro-textarea-padding-horizontal-sm: 4px;
+@pro-textarea-padding-horizontal-md: 6px;
+@pro-textarea-padding-horizontal-lg: 8px;
+@pro-textarea-padding-vertical-sm: 4px;
+@pro-textarea-padding-vertical-md: 6px;
+@pro-textarea-padding-vertical-lg: 8px;
+@pro-textarea-line-height: 20px;