-
-
Notifications
You must be signed in to change notification settings - Fork 50.3k
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
style(Modal): Adopt a better way to break lines #39249
Conversation
6a167cc
to
d2d4e50
Compare
@@ -297,7 +297,7 @@ const genModalConfirmStyle: GenerateStyle<ModalToken> = (token) => { | |||
|
|||
[`+ ${confirmComponentCls}-content`]: { | |||
marginBlockStart: token.marginXS, | |||
flexBasis: "100%", | |||
flexBasis: '100%', |
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.
flexBasis: '100%', | |
flexBasis: '100%', | |
maxWidth: `calc(100% - ${token.modalConfirmIconSize + token.marginSM}px)`, |
改这个就好。别动 wordWrap,和 4.x 保持一致就行。
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.
好嘞,我研究下
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.
代码改好了,changelog
也改好了。
对于word-break
这个方案不能用的情况我还有些疑惑,并且在历史 pr 里没找到相关的说明,大佬能给些关键词吗
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.
break-word 会让英文单词被砍断,不是最合理的排版方式,所以一般不会作为默认样式设置。
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.
感谢答疑
components/modal/demo/hooks.tsx
Outdated
<UnreachableContext.Consumer>{(name) => `Unreachable: ${name}!`}</UnreachableContext.Consumer> | ||
</> | ||
), | ||
content: <p>`Reachable: !aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa)`</p>, |
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.
demo 不用改。
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.
大佬神速,我刚想改来着
d2d4e50
to
34280f6
Compare
[中文版模板 / Chinese template]
🤔 This is a ...
🔗 Related issue link
使用 Modal.info(), content 属性中的内容较长时,会超出 Modal 边界
💡 Background and solution
📝 Changelog
max-width
tomodal-confirm-content
to achieve a line break effect (a supplement tonon-CJK
text wrapping)modal-confirm-content
加上max-width
,来达到换行效果(算是对非CJK
文字换行的补充)☑️ Self-Check before Merge