New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: select multiple filter, last line tag padding higher than other #2151
Conversation
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 0ea9722:
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
❗ Your organization needs to install the Codecov GitHub app to enable full functionality. Additional details and impacted files@@ Coverage Diff @@
## release #2151 +/- ##
===========================================
+ Coverage 88.17% 88.20% +0.03%
===========================================
Files 440 440
Lines 25986 25986
Branches 6628 6628
===========================================
+ Hits 22914 22922 +8
+ Misses 3072 3064 -8 ☔ View full report in Codecov by Sentry. |
Passing run #2413 ↗︎
Details:
Review all test suite changes for PR #2151 ↗︎ |
.#{$multiple}.#{$filterable}.#{$module}-small { | ||
.#{$prefix}-input-wrapper { | ||
height: $height-select_multiple_input_small; | ||
line-height: $height-select_multiple_input_small; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
line-height 无需对外暴露。因为该input 是不带样式的。只需要保证高度与lineheight一致即可
中文模板 / Chinese Template
What kind of change does this PR introduce? (check at least one)
PR description
修复 #1667 的样式问题。
问题原因:
默认情况下 input 组件的默认样式 line-height 30px height 30px,在不换行时没有问题。但如果换行之后,同一行中tag 的 height 是 22px,input会把自己的行撑开,导致含有input 的行与其他行的高度不一致
image
解决方案
参考 TagInput的做法,直接暴露组件级的token,允许配置filter select的 input 高度
Changelog
🇨🇳 Chinese
$height-select_multiple_input_small
、$height-select_multiple_input_default
、$height-select_multiple_input_large
三个 token 可用于指定开启搜索时的 input 的高度🇺🇸 English
$height-select_multiple_input_small
,$height-select_multiple_input_default
,$height-select_multiple_input_large
which can be used to specify the height of the input when searching is enabled.Checklist
Other
Additional information