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.

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

feat(popover): 增加最大宽度设置,支持文本超过最大宽度时,换行展示。 #2851

Merged
merged 5 commits into from
Dec 12, 2024
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/packages/popover/doc.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -165,3 +165,4 @@ The component provides the following CSS variables, which can be used to customi
| \--nutui-popover-divider-color | The bottom border color of the options area | `$color-border` |
| \--nutui-popover-disable-color | Option Disabled Colors | `$color-text-disabled` |
| \--nutui-popover-menu-item-padding | The padding value of each item in the option area menu | `8px` |
| \--nutui-popover-menu-item-width | The width value of each item in the options | `160px` |
1 change: 1 addition & 0 deletions src/packages/popover/doc.md
Original file line number Diff line number Diff line change
Expand Up @@ -167,3 +167,4 @@ PopoverList 属性是一个由对象构成的数组,数组中的每个对象
| \--nutui-popover-divider-color | 选项区的底部 border 颜色 | `$color-border` |
| \--nutui-popover-disable-color | 选项禁用的颜色 | `$color-text-disabled` |
| \--nutui-popover-menu-item-padding | 选项区菜单每一项的 padding 值 | `8px` |
| \--nutui-popover-menu-item-width | 选项区菜单每一项宽度值,超过宽度值后,会折行展示,保障信息的完整性 | `160px` |
1 change: 1 addition & 0 deletions src/packages/popover/doc.taro.md
Original file line number Diff line number Diff line change
Expand Up @@ -158,3 +158,4 @@ PopoverList 属性是一个由对象构成的数组,数组中的每个对象
| \--nutui-popover-divider-color | 选项区的底部 border 颜色 | `$color-border` |
| \--nutui-popover-disable-color | 选项禁用的颜色 | `$color-text-disabled` |
| \--nutui-popover-menu-item-padding | 选项区菜单每一项的 padding 值 | `8px` |
| \--nutui-popover-menu-item-width | 选项区菜单每一项宽度值,超过宽度值后,会折行展示,保障信息的完整性 | `160px` |
1 change: 1 addition & 0 deletions src/packages/popover/doc.zh-TW.md
Original file line number Diff line number Diff line change
Expand Up @@ -167,3 +167,4 @@ PopoverList 屬性是一個由對象構成的數組,數組中的每個對象
| \--nutui-popover-divider-color | 選項區的底部 border 顏色 | `$color-border` |
| \--nutui-popover-disable-color | 選項禁用的顏色 | `$color-text-disabled` |
| \--nutui-popover-menu-item-padding | 選項區菜單每一項的 padding 值 | `8px` |
| \--nutui-popover-menu-item-width | 選項區菜單每一項寬度值,超過寬度值後,會折行展示,保障信息的完整性 | `160px` |
2 changes: 2 additions & 0 deletions src/packages/popover/popover.scss
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,8 @@
justify-content: center;
padding: $popover-menu-item-padding;
border-bottom: 1px solid $popover-divider-color;
max-width: $popover-menu-item-width;
word-wrap: break-word;

&:last-child {
margin-bottom: 0px;
Expand Down
1 change: 1 addition & 0 deletions src/styles/variables.scss
Original file line number Diff line number Diff line change
Expand Up @@ -1553,6 +1553,7 @@ $popover-menu-item-padding: var(
--nutui-popover-menu-item-padding,
8px
) !default;
$popover-menu-item-width: var(--nutui-popover-menu-item-width, 160px) !default;

//progress(✅)
$progress-height: var(--nutui-progress-height, 10px) !default;
Expand Down
Loading