fix(form): blankHeightXxx theme var doesn't follow `common.heightXx…

…x`, closes #1880
tusen-ai · Dec 19, 2021 · 6bcca9e · 6bcca9e
1 parent f810042
commit 6bcca9e
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 6 deletions.
diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md
@@ -7,13 +7,15 @@
 - Fix `n-transfer` list doesn't follow container height when style.height is set, closes [#1879](https://github.com/TuSimple/naive-ui/issues/1879).
 - Fix `n-skeleton` & `n-gradient-text` cause runtime error in some old browsers, closes [#1867](https://github.com/TuSimple/naive-ui/issues/1867).
 - Fix `n-data-table` `ellipsis` prop in column doesn't support all `n-ellipsis`'s props, closes [#1891](https://github.com/TuSimple/naive-ui/issues/1891).
+- Fix `n-form`'s `blankHeightXxx` theme var doesn't follow `common.heightXxx`, closes [#1880](https://github.com/TuSimple/naive-ui/issues/1880).
 
 ### Feats
 
 - `n-back-top` uses `n` as CSS vars prefix.
 - `n-steps` uses `n` as CSS vars prefix.
 - `n-switch` uses `n` as CSS vars prefix.
 - `n-auto-complete` uses `n` as CSS vars prefix.
+- `n-log` uses `n` as CSS vars prefix.
 
 ## 2.23.0 (2021-12-17)
 
@@ -32,7 +34,6 @@
 - `n-divider` uses `n` as CSS vars prefix.
 - `typography` uses `n` as CSS vars prefix.
 - `n-badge` uses `n` as CSS vars prefix.
-- `n-log` uses `n` as CSS vars prefix.
 
 ## 2.22.0 (2021-12-15)
 

diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md
@@ -7,13 +7,15 @@
 - 修复 `n-transfer` 在自定义高度后内部列表和容器高度不一致，关闭 [#1879](https://github.com/TuSimple/naive-ui/issues/1879)
 - 修复 `n-skeleton` 和 `n-gradient-text` 在某些较老的浏览器导致运行错误，关闭 [#1867](https://github.com/TuSimple/naive-ui/issues/1867)
 - 修复 `n-data-table` 中列的 ellipsis 属性对于 `n-ellipsis` 的属性支持不全，关闭 [#1891](https://github.com/TuSimple/naive-ui/issues/1891)
+- 修复 `n-form` 的 `blankHeightXxx` 主题变量没有跟随 `common.heightXxx`，关闭 [#1880](https://github.com/TuSimple/naive-ui/issues/1880)
 
 ### Feats
 
 - `n-back-top` 的 CSS 变量使用 `n` 作为前缀
 - `n-steps` 的 CSS 变量使用 `n` 作为前缀
 - `n-switch` 的 CSS 变量使用 `n` 作为前缀
 - `n-auto-complete` 的 CSS 变量使用 `n` 作为前缀
+- `n-log` 的 CSS 变量使用 `n` 作为前缀
 
 ## 2.23.0 (2021-12-17)
 
@@ -32,7 +34,6 @@
 - `n-divider` 的 CSS 变量使用 `n` 作为前缀
 - `typography` 的 CSS 变量使用 `n` 作为前缀
 - `n-badge` 的 CSS 变量使用 `n` 作为前缀
-- `n-log` 的 CSS 变量使用 `n` 作为前缀
 
 ## 2.22.0 (2021-12-15)
 

diff --git a/src/form/styles/_common.ts b/src/form/styles/_common.ts
@@ -1,7 +1,4 @@
 export default {
-  blankHeightSmall: '28px',
-  blankHeightMedium: '34px',
-  blankHeightLarge: '40px',
   feedbackPadding: '4px 0 0 2px',
   feedbackHeightSmall: '24px',
   feedbackHeightMedium: '24px',

diff --git a/src/form/styles/light.ts b/src/form/styles/light.ts
@@ -4,9 +4,21 @@ import type { Theme } from '../../_mixins'
 import commonVariables from './_common'
 
 export const self = (vars: ThemeCommonVars) => {
-  const { textColor1, errorColor, warningColor, lineHeight, textColor3 } = vars
+  const {
+    heightSmall,
+    heightMedium,
+    heightLarge,
+    textColor1,
+    errorColor,
+    warningColor,
+    lineHeight,
+    textColor3
+  } = vars
   return {
     ...commonVariables,
+    blankHeightSmall: heightSmall,
+    blankHeightMedium: heightMedium,
+    blankHeightLarge: heightLarge,
     lineHeight,
     labelTextColor: textColor1,
     asteriskColor: errorColor,