fix(input): focus style's priority is lower than hover style, closes t…

…usen-ai#2480
jaulz · Mar 11, 2022 · c025222 · c025222
1 parent f836f6e
commit c025222
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md
@@ -11,6 +11,7 @@
 - Fix `n-table`'s `border-color` abnormal style when this added dynamically, closes [#2403](https://github.com/TuSimple/naive-ui/issues/2403).
 - Fix `n-tree`'s `default-expand-all` prop doesn't work for dynamic data.
 - Fix `n-form` when `model.xxx` is `undefined`, validator will use `null` as validation value, closes [#2486](https://github.com/TuSimple/naive-ui/issues/2486).
+- Fix `n-input` focus style's priority is lower than hover style, closes [#2480](https://github.com/TuSimple/naive-ui/issues/2480).
 
 ### Feats
 

diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md
@@ -11,6 +11,7 @@
 - 修复 `n-table` 动态增加时 `border-color` 的样式异常，关闭 [#2403](https://github.com/TuSimple/naive-ui/issues/2403)
 - 修复 `n-tree` 的 `default-expand-all` 对于动态数据不生效
 - 修复 `n-form` 当 `model.xxx` 为 `undefined` 的时候会使用 `null` 作为验证值，关闭 [#2486](https://github.com/TuSimple/naive-ui/issues/2486)
+- 修复 `n-input` focus 样式优先级低于 hover，关闭 [#2480](https://github.com/TuSimple/naive-ui/issues/2480)
 
 ### Feats
 

diff --git a/src/input/src/styles/input.cssr.ts b/src/input/src/styles/input.cssr.ts
@@ -255,14 +255,14 @@ export default cB('input', `
         color: var(--n-icon-color-pressed);
       `)
     ]),
+    c('&:hover', [
+      cE('state-border', 'border: var(--n-border-hover);')
+    ]),
     cM('focus', 'background-color: var(--n-color-focus);', [
       cE('state-border', `
         border: var(--n-border-focus);
         box-shadow: var(--n-box-shadow-focus);
       `)
-    ]),
-    c('&:hover', [
-      cE('state-border', 'border: var(--n-border-hover);')
     ])
   ]),
   cE('border, state-border', `