fix(index): clamp app card title to prevent overflow - #631
Conversation
Restore CSS line clamp for app card titles with centered layout and word wrapping, preventing long English names from overflowing the card background while keeping the previous auto-centering behavior. 恢复应用卡片标题的CSS两行截断,并保持居中与长词换行能力。 避免英文长名称超出卡片背景,同时保留此前为多语言显示调整的自动居中效果。 bug-368193 Log: 恢复应用卡片标题CSS截断修复英文长名称超出背景 PMS: BUG-359981 Influence: 应用卡片标题超过两行时省略显示,解决长英文名称溢出问题,不影响图标与卡片点击功能。
Reviewer's guide (collapsed on small PRs)Reviewer's GuideRestores two-line clamping and centering for app card titles in the manual index view to prevent long English names from overflowing, while preserving multi-line layout and word wrapping behavior. File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
ab5511d to
ee4e172
Compare
There was a problem hiding this comment.
Hey - I've left some high level feedback:
- Consider whether
word-break: normalplusoverflow-wrap: break-wordstill meets requirements for non-space-separated languages (e.g., CJK) since the previous behavior around long words and mixed-language titles may change. - You’re now relying on
display: -webkit-boxand-webkit-line-clamp: 2; if non-WebKit browsers need to be supported, consider adding a graceful fallback for multi-line truncation or verifying the behavior there.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- Consider whether `word-break: normal` plus `overflow-wrap: break-word` still meets requirements for non-space-separated languages (e.g., CJK) since the previous behavior around long words and mixed-language titles may change.
- You’re now relying on `display: -webkit-box` and `-webkit-line-clamp: 2`; if non-WebKit browsers need to be supported, consider adding a graceful fallback for multi-line truncation or verifying the behavior there.Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: dengzhongyuan365-dev, lzwind The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
2 similar comments
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: dengzhongyuan365-dev, lzwind The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: dengzhongyuan365-dev, lzwind The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
deepin pr auto review★ 总体评分:95分■ 【总体评价】
■ 【详细分析】
■ 【改进建议代码示例】 // 当前代码已足够优秀,无需额外改进,以下为保持现有逻辑的最佳实践展示
.content {
width: var(--index-span-width);
word-break: normal;
overflow: hidden;
text-overflow: ellipsis;
margin: auto;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow-wrap: break-word;
text-align: center;
font-family: var(--nav-world-font-family);
font-size: var(--span-font-size);
line-height: var(--span-line-height);
} |
|
/forcemerge |
|
This pr force merged! (status: unstable) |
Restore CSS line clamp for app card titles with centered layout and word wrapping, preventing long English names from overflowing the card background while keeping the previous auto-centering behavior.
恢复应用卡片标题的CSS两行截断,并保持居中与长词换行能力。
避免英文长名称超出卡片背景,同时保留此前为多语言显示调整的自动居中效果。
bug-368193
Log: 恢复应用卡片标题CSS截断修复英文长名称超出背景
PMS: BUG-359981
Influence: 应用卡片标题超过两行时省略显示,解决长英文名称溢出问题,不影响图标与卡片点击功能。
Summary by Sourcery
Bug Fixes: