mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2024-12-21 04:50:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(descriptions): use different font size on different size

Browse Source
This commit is contained in:
07akioni 2020-12-16 01:26:05 +08:00
parent 4ab5d18dfb
commit 1517f7f000
4 changed files with 28 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/descriptions/src/styles/themed-base.cssr.js
View File

@ -24,12 +24,12 @@ export default c([
['small', 'medium', 'large'].map(size => {
const {
[createKey('padding', size)]: padding,
[createKey('paddingBordered', size)]: paddingBordered
[createKey('paddingBordered', size)]: paddingBordered,
[createKey('fontSize', size)]: fontSize
} = $local
return cM(`${size}-size`, [
cB('descriptions-header', {
marginBottom: '12px'
}),
return cM(`${size}-size`, {
fontSize
}, [
cM('bordered', [
cB('descriptions-table-wrapper', [
cB('descriptions-table', [
@ -68,31 +68,23 @@ export default c([
cM('left-label-placement', [
cB('descriptions-table-content', [
c('> *', {
raw: `
vertical-align: top;
`
verticalAlign: 'top'
})
])
]),
cM('left-label-align', [
c('th', {
raw: `
text-align: left;
`
textAlign: 'left'
})
]),
cM('center-label-align', [
c('th', {
raw: `
text-align: center;
`
textAlign: 'center'
})
]),
cM('right-label-align', [
c('th', {
raw: `
text-align: right;
`
textAlign: 'right'
})
]),
cM('bordered', [
@ -137,8 +129,10 @@ export default c([
font-weight: ${headerFontWeight};
font-size: 18px;
transition: color .3s ${cubicBezierEaseInOut};
`,
color: headerTextColor
line-height: ${lineHeight};
margin-bottom: 8px;
color: ${headerTextColor};
`
}),
cB('descriptions-table-wrapper', {
raw: `
@ -207,9 +201,7 @@ export default c([
}),
c('&:last-child', [
cB('descriptions-table-content', {
raw: `
padding: 0;
`
padding: 0
})
])
])

49
src/descriptions/src/styles/themed-size.cssr.js
View File

@ -1,49 +0,0 @@
import { c, cTB, cB, cM, createKey } from '../../../_utils/cssr'
export default c([
({ props }) => {
const size = props.$vm.size
const padding = props.$local[createKey('padding', size)]
const borderedPadding = props.$local[createKey('paddingBordered', size)]
return cTB('descriptions', [
cM(`${size}-size`, [
cB('descriptions-header', {
marginBottom: padding
}),
cM('bordered', [
cB('descriptions-table-wrapper', [
cB('descriptions-table', [
cB('descriptions-table-row', [
cB('descriptions-table-header', {
padding: borderedPadding
}),
cB('descriptions-table-content', {
padding: borderedPadding
}),
c('&:last-child', [
cB('descriptions-table-content', {
padding: borderedPadding
})
])
])
])
])
]),
cB('descriptions-table-wrapper', [
cB('descriptions-table', [
cB('descriptions-table-row', [
cB('descriptions-table-content', {
padding: `0 0 ${padding} 0`
}),
c('&:last-child', [
cB('descriptions-table-content', {
padding: 0
})
])
])
])
])
])
])
}
])

8
src/descriptions/styles/dark.js
View File

@ -16,11 +16,17 @@ export default create({
dividerColorOverlay,
borderRadius,
fontWeightStrong,
lineHeight
lineHeight,
fontSizeSmall,
fontSizeMedium,
fontSizeLarge
} = vars
return {
...commonVariables,
lineHeight,
fontSizeSmall,
fontSizeMedium,
fontSizeLarge,
headerColor: tableHeaderColorOverlay,
headerTextColor: textColor1Overlay,
headerFontWeight: fontWeightStrong,

8
src/descriptions/styles/light.js
View File

@ -17,11 +17,17 @@ export default create({
dividerColorOverlay,
borderRadius,
fontWeightStrong,
lineHeight
lineHeight,
fontSizeSmall,
fontSizeMedium,
fontSizeLarge
} = vars
return {
...commonVariables,
lineHeight,
fontSizeSmall,
fontSizeMedium,
fontSizeLarge,
headerColor: composite(cardColor, tableHeaderColorOverlay),
headerTextColor: textColor1Overlay,
headerFontWeight: fontWeightStrong,