feat: progress add inside and bottom text position #48157
Conversation
|
|
|
|
👁 Visual Regression Report for PR #48157 Failed ❌
Check Full Report for details |
|
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. |
|
test 挂了看一下，可能需要更新一下快照 |
|
需要反色 |
|
反色我记得 |
快照需要本地更新嘛 |
|
需要的： |
|
@afc163 都改好了，大佬看看还有啥问题不 😊 |
|
Progress 的高度被压缩了：https://antd-visual-diff.oss-cn-shanghai.aliyuncs.com/pr-48157/visualRegressionReport/report.html 
可以试试把 outer 上的 style 都去掉，应该不需要这两个样式了。 
|
|
看下 https://antd-visual-diff.oss-cn-shanghai.aliyuncs.com/pr-48157/visualRegressionReport/report.html |
size-limit report 📦
|
这个是之前说过的 outerStyle 导致的，size 属性根据 outerStyle 控制 progress 的长度，我改回去了。 |
|
e4da3e1 反色的值改回了 rgba 值，现有的 token 暗黑模式下都会变成白色调的。现在 color picker 的 preset 也是直接写的 rgba(0, 0, 0, 0.45)。 ant-design/components/color-picker/style/presets.ts Lines 102 to 106 in 313d534 |
|
@afc163 大佬看看呢 👀 |
| @@ -186,6 +221,8 @@ const Progress = React.forwardRef<HTMLDivElement, ProgressProps>((props, ref) => | |||
| [`${prefixCls}-${(type === 'dashboard' && 'circle') || type}`]: type !== 'line', | |||
| [`${prefixCls}-inline-circle`]: type === 'circle' && getSize(size, 'circle')[0] <= 20, | |||
| [`${prefixCls}-line`]: !steps && type === 'line', | |||
| [`${prefixCls}-line-align-${infoAlign}`]: !steps && type === 'line', | |||
| [`${prefixCls}-line-position-${infoPosition}`]: !steps && type === 'line', | |||
There was a problem hiding this comment.
!steps && type === 'line' 出现三次了，可以提一个变量出来。
| [`&${progressCls}-text-inner`]: { | ||
| color: token.colorWhite, | ||
| position: 'relative', | ||
| zIndex: 1, |
There was a problem hiding this comment.
可以尝试把原来的 :after 改成 :before，这样这里可以不加 relative 和 z-index，靠文档顺序排在上面。
| [`&${progressCls}-text-bright`]: { | ||
| color: 'rgba(0, 0, 0, 0.45)', | ||
| }, | ||
| }, |
[English Template / 英文模板]
🤔 这个变动的性质是？
🔗 相关 Issue
💡 需求背景和解决方案
为 Progress 组件添加 infoPosition API 设置进度数值的位置，支持展示在进度条内部与底部。
添加 insideInfoPositon API 设置进度数值在进度条内部的位置，支持靠左、靠右与居中。
📝 更新日志
☑️ 请求合并前的自查清单