blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

feat(Cell): add css vars to customize font size of the cell value (#12260)

Browse Source
This commit is contained in:
inottn 2023-09-07 20:42:50 +08:00 committed by GitHub
parent 874a5fc600
commit e67d8aa0cf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/vant/src/cell/README.md
View File

@ -220,11 +220,13 @@ The component provides the following CSS variables, which can be used to customi
| --van-cell-label-line-height | _var(--van-line-height-sm)_ | - | | --van-cell-label-line-height | _var(--van-line-height-sm)_ | - |
| --van-cell-label-margin-top | _var(--van-padding-base)_ | - | | --van-cell-label-margin-top | _var(--van-padding-base)_ | - |
| --van-cell-value-color | _var(--van-text-color-2)_ | - | | --van-cell-value-color | _var(--van-text-color-2)_ | - |
| --van-cell-value-font-size | _inherit_ | - |
| --van-cell-icon-size | _16px_ | - | | --van-cell-icon-size | _16px_ | - |
| --van-cell-right-icon-color | _var(--van-gray-6)_ | - | | --van-cell-right-icon-color | _var(--van-gray-6)_ | - |
| --van-cell-large-vertical-padding | _var(--van-padding-sm)_ | - | | --van-cell-large-vertical-padding | _var(--van-padding-sm)_ | - |
| --van-cell-large-title-font-size | _var(--van-font-size-lg)_ | - | | --van-cell-large-title-font-size | _var(--van-font-size-lg)_ | - |
| --van-cell-large-label-font-size | _var(--van-font-size-md)_ | - | | --van-cell-large-label-font-size | _var(--van-font-size-md)_ | - |
| --van-cell-large-value-font-size | _inherit_ | - |
| --van-cell-group-background | _var(--van-background-2)_ | - | | --van-cell-group-background | _var(--van-background-2)_ | - |
| --van-cell-group-title-color | _var(--van-text-color-2)_ | - | | --van-cell-group-title-color | _var(--van-text-color-2)_ | - |
| --van-cell-group-title-padding | _var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs)_ | - | | --van-cell-group-title-padding | _var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs)_ | - |

2
packages/vant/src/cell/README.zh-CN.md
View File

@ -225,11 +225,13 @@ import type {
| --van-cell-label-line-height | _var(--van-line-height-sm)_ | - | | --van-cell-label-line-height | _var(--van-line-height-sm)_ | - |
| --van-cell-label-margin-top | _var(--van-padding-base)_ | - | | --van-cell-label-margin-top | _var(--van-padding-base)_ | - |
| --van-cell-value-color | _var(--van-text-color-2)_ | - | | --van-cell-value-color | _var(--van-text-color-2)_ | - |
| --van-cell-value-font-size | _inherit_ | - |
| --van-cell-icon-size | _16px_ | - | | --van-cell-icon-size | _16px_ | - |
| --van-cell-right-icon-color | _var(--van-gray-6)_ | - | | --van-cell-right-icon-color | _var(--van-gray-6)_ | - |
| --van-cell-large-vertical-padding | _var(--van-padding-sm)_ | - | | --van-cell-large-vertical-padding | _var(--van-padding-sm)_ | - |
| --van-cell-large-title-font-size | _var(--van-font-size-lg)_ | - | | --van-cell-large-title-font-size | _var(--van-font-size-lg)_ | - |
| --van-cell-large-label-font-size | _var(--van-font-size-md)_ | - | | --van-cell-large-label-font-size | _var(--van-font-size-md)_ | - |
| --van-cell-large-value-font-size | _inherit_ | - |
| --van-cell-group-background | _var(--van-background-2)_ | - | | --van-cell-group-background | _var(--van-background-2)_ | - |
| --van-cell-group-title-color | _var(--van-text-color-2)_ | - | | --van-cell-group-title-color | _var(--van-text-color-2)_ | - |
| --van-cell-group-title-padding | _var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs)_ | - | | --van-cell-group-title-padding | _var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs)_ | - |

7
packages/vant/src/cell/index.less
View File

@ -15,11 +15,13 @@
--van-cell-label-line-height: var(--van-line-height-sm); --van-cell-label-line-height: var(--van-line-height-sm);
--van-cell-label-margin-top: var(--van-padding-base); --van-cell-label-margin-top: var(--van-padding-base);
--van-cell-value-color: var(--van-text-color-2); --van-cell-value-color: var(--van-text-color-2);
--van-cell-value-font-size: inherit;
--van-cell-icon-size: 16px; --van-cell-icon-size: 16px;
--van-cell-right-icon-color: var(--van-gray-6); --van-cell-right-icon-color: var(--van-gray-6);
--van-cell-large-vertical-padding: var(--van-padding-sm); --van-cell-large-vertical-padding: var(--van-padding-sm);
--van-cell-large-title-font-size: var(--van-font-size-lg); --van-cell-large-title-font-size: var(--van-font-size-lg);
--van-cell-large-label-font-size: var(--van-font-size-md); --van-cell-large-label-font-size: var(--van-font-size-md);
--van-cell-large-value-font-size: inherit;
} }
.van-cell { .van-cell {
@ -59,6 +61,7 @@
position: relative; position: relative;
overflow: hidden; overflow: hidden;
color: var(--van-cell-value-color); color: var(--van-cell-value-color);
font-size: var(--van-cell-value-font-size);
text-align: right; text-align: right;
vertical-align: middle; vertical-align: middle;
word-wrap: break-word; word-wrap: break-word;
@ -115,5 +118,9 @@
.van-cell__label { .van-cell__label {
font-size: var(--van-cell-large-label-font-size); font-size: var(--van-cell-large-label-font-size);
} }
.van-cell__value {
font-size: var(--van-cell-large-value-font-size);
}
} }
} }