feat(notice-bar): shape and bordered prop #6691
Conversation
|
Size Change: +287 B (+0.08%) Total Size: 358 kB
ℹ️ View Unchanged
|
size-limit report 📦
|
|
PR preview has been successfully built and deployed to https://antd-mobile-preview-pr-6691.surge.sh |
| @@ -34,6 +34,8 @@ export type NoticeBarProps = { | |||
| icon?: ReactNode | |||
| /** Whether to display multiple lines */ | |||
| wrap?: boolean | |||
| /** Embedded mode with compact style */ | |||
| embedded?: boolean | |||
There was a problem hiding this comment.
这个属性类似于 Button 的形状配置，可以叫 shape: 'rectangular'(default) | 'square' + fill: solid | outline。这样就可以组合出需要的效果了。
or 直接 fill: outline 时自动加圆角。
There was a problem hiding this comment.
这个我们在实践中遇到不同的设计师有不同的偏好，在定制主题的时候，可能有边框，也可能没有边框，可能有圆角也可能没有圆角，用 shape 或 fill 的话，有可能会导致代码和效果不统一的情况。而且用 shape 和 fill 会带来非常多不同的排列组合，导致组件过于复杂。而 NoticeBar 应该没有 Button 那么多变种的需求。
guoyunhe
force-pushed
the
notice-bar-embedded
branch
3 times, most recently
from
6e52107 to
91ce9c6
Compare
guoyunhe
changed the title
guoyunhe
force-pushed
the
notice-bar-embedded
branch
3 times, most recently
from
bc910e2 to
faf42db
Compare
package.json
Outdated
| @@ -41,7 +41,7 @@ | |||
| "pub:dev": "npm publish ./lib --tag dev", | |||
| "size-limit": "size-limit", | |||
| "size-limit:ci": "size-limit --json", | |||
| "start": "dumi dev", | |||
| "start": "export NODE_OPTIONS=--openssl-legacy-provider && HOST=localhost dumi dev", | |||
There was a problem hiding this comment.
这个不要加进去，其他 script 不认识 export 定义。
| border-right-width: var(--adm-notice-bar-border-width); | ||
| } | ||
|
|
||
| &-noborder { |
guoyunhe
force-pushed
the
notice-bar-embedded
branch
from
faf42db to
abd7982
Compare
|
Deploy PR preview failed. |
6 similar comments
|
Deploy PR preview failed. |
|
Deploy PR preview failed. |
|
Deploy PR preview failed. |
|
Deploy PR preview failed. |
|
Deploy PR preview failed. |
|
Deploy PR preview failed. |
增加 success 配色，shape 和 bordered 属性。