Skip to content
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.

Sign up for GitHub

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

Jump to bottom

style: Optimize select other sizes placeholder text centered #20884

Merged
merged 3 commits into from
Jan 15, 2020
Merged

style: Optimize select other sizes placeholder text centered #20884

merged 3 commits into from
Jan 15, 2020

Conversation

xrkffgg
Copy link
Member

@xrkffgg xrkffgg commented Jan 14, 2020 •
edited
Loading

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / document update
  • Component style update
  • TypeScript definition update
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Other (about what?)

🔗 Related issue link

none

💡 Background and solution


  • large small 时，文字都没有居中，同时文字过长时，未处理
  • 因为这个 ant-select-selection-placeholder 的 position: absolute; 这里修改为 加上了 2个 padding和 border
  • 文档中关于 mode 的描述，在类型中写了直接的属性值，参照 Menu 组件中 关于 mode 的定义，修改了一下

📝 Changelog

Language Changelog
🇺🇸 English
🇨🇳 Chinese 修复Select 组件 large small 模式下，placeholder的文字居中

☑️ Self Check before Merge

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

View rendered components/select/index.en-US.md
View rendered components/select/index.zh-CN.md

@auto-add-label auto-add-label bot added the style label Jan 14, 2020
@xrkffgg
Copy link
Member Author

xrkffgg commented Jan 14, 2020

文字过长时 要 怎么处理，我不太能确定，问问大家的意见？

@yoyo837
Copy link
Contributor

yoyo837 commented Jan 14, 2020

你是说这个 #20883？

@netlify
Copy link

netlify bot commented Jan 14, 2020 •
edited
Loading

Deploy preview for ant-design ready!

Built with commit 91f97bb

https://deploy-preview-20884--ant-design.netlify.com

@zombieJ
Copy link
Member

zombieJ commented Jan 14, 2020

样式不用动，这个已经在这里 #20883 解决了。

@xrkffgg
Copy link
Member Author

xrkffgg commented Jan 14, 2020

😂😂😂 解决了啊。。。。刚看到

@xrkffgg xrkffgg closed this Jan 14, 2020
@xrkffgg
Copy link
Member Author

xrkffgg commented Jan 14, 2020

但是 好像 居中问题 好像没修复吧

@codesandbox-ci
Copy link

codesandbox-ci bot commented Jan 14, 2020 •
edited
Loading

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 91f97bb:

Sandbox Source
antd reproduction template Configuration

@zombieJ
Copy link
Member

zombieJ commented Jan 14, 2020

可以继续来 patch~

@xrkffgg xrkffgg reopened this Jan 14, 2020
@codecov
Copy link

codecov bot commented Jan 14, 2020 •
edited
Loading

Codecov Report

Merging #20884 into master will not change coverage.
The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff           @@
##           master   #20884   +/-   ##
=======================================
  Coverage   97.47%   97.47%           
=======================================
  Files         296      296           
  Lines        6899     6899           
  Branches     1868     1915   +47     
=======================================
  Hits         6725     6725           
  Misses        174      174

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 5556ab5...91f97bb. Read the comment docs.

@xrkffgg
Copy link
Member Author

xrkffgg commented Jan 14, 2020

我这个 主要是解决 居中的问题

过长的 我不能确定，所以没动

zombieJ
zombieJ reviewed Jan 14, 2020
View reviewed changes
components/select/style/multiple.less Outdated
height: @select-selection-height + @select-multiple-padding + @select-multiple-padding * 2 +
@border-width-base;
line-height: @select-selection-height + @select-multiple-padding + @select-multiple-padding *
2 + @border-width-base;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这里看看能不能直接 transform 来居中？否则不同 size 算法都不太一样。

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK，我改改

@xrkffgg
Copy link
Member Author

xrkffgg commented Jan 14, 2020

@zombieJ 大佬，改好了，你看一下

@xrkffgg xrkffgg changed the title style: 优化 select 其他尺寸 placeholder 文字居中 style: Optimize select other sizes placeholder text centered Jan 14, 2020
@zombieJ
Copy link
Member

zombieJ commented Jan 14, 2020

代码有冲突要解决一下

@xrkffgg
Copy link
Member Author

xrkffgg commented Jan 14, 2020

rebase 了一下，你看下还有冲突吗？

@ant-design-bot
Copy link
Contributor

Preview deploy to https://preview-20884-ant-design.surge.sh

zombieJ
zombieJ reviewed Jan 14, 2020
View reviewed changes
components/select/index.zh-CN.md Outdated
@@ -42,7 +42,7 @@ title: Select
| maxTagCount | 最多显示多少个 tag | number | - | |
| maxTagTextLength | 最大显示的 tag 文本长度 | number | - | |
| maxTagPlaceholder | 隐藏 tag 时显示的内容 | ReactNode/function(omittedValues) | - | |
| mode | 设置 Select 的模式为多选或标签 | 'multiple' \| 'tags' | - | |
| mode | 设置 Select 的模式为多选或标签 | string: `multiple` `tags` | - | |
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

multiple | tags，竖线保留一下。不用写 string

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

只要 ' 改成 ` 就行了

@ant-design-bot
Copy link
Contributor

ant-design-bot commented Jan 15, 2020 •
edited
Loading

Preview deployed to https://preview-20884-ant-design.surge.sh

@zombieJ zombieJ merged commit a9d7617 into ant-design:master Jan 15, 2020
@xrkffgg xrkffgg deleted the k-1 branch January 15, 2020 02:42
@afc163 afc163 mentioned this pull request Jan 21, 2020
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@zombieJ zombieJ zombieJ approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@xrkffgg @yoyo837 @zombieJ @ant-design-bot