mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-02-05 13:00:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(list): clean cssr codes

Browse Source
This commit is contained in:
07akioni 2020-08-12 17:39:39 +08:00
parent 89b25648b3
commit 1e9da8fafd
1 changed files with 70 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

133
src/list/src/styles/themed-base.cssr.js
View File

@ -12,29 +12,54 @@ export default c([
const {
easeInOutCubicBezier
} = props.$base
return cTB('list', {
raw: `
font-size: 14px;
transition:
background-color .3s ${easeInOutCubicBezier},
color .3s ${easeInOutCubicBezier},
border-color .3s ${easeInOutCubicBezier};
padding: 0;
list-style-type: none;
color: ${textColor};
`
}, [
cM('bordered', {
return [
cTB('list', {
raw: `
background-color: ${color};
border-radius: ${borderRadius};
border: 1px solid ${borderColor};
font-size: 14px;
transition:
background-color .3s ${easeInOutCubicBezier},
color .3s ${easeInOutCubicBezier},
border-color .3s ${easeInOutCubicBezier};
padding: 0;
list-style-type: none;
color: ${textColor};
`
}, [
cB('list-item', {
cM('bordered', {
raw: `
padding: 12px 20px;
background-color: ${color};
border-radius: ${borderRadius};
border: 1px solid ${borderColor};
`
}, [
cB('list-item', {
raw: `
padding: 12px 20px;
`
}, [
c('&:not(:last-child)', {
raw: `
border-bottom: 1px solid ${borderColor};
`
})
]),
cE('header, footer', {
raw: `
padding: 12px 20px;
`
}, [
c('&:not(:last-child)', {
raw: `
border-bottom: 1px solid ${borderColor};
`
})
])
]),
cE('header, footer', {
raw: `
padding: 12px 0;
box-sizing: border-box;
transition: border-color .3s ${easeInOutCubicBezier};
`
}, [
c('&:not(:last-child)', {
@ -43,11 +68,33 @@ export default c([
`
})
]),
cE('header, footer', {
cB('list-item', {
raw: `
padding: 12px 20px;
padding: 12px 0;
box-sizing: border-box;
display: flex;
flex-wrap: nowrap;
align-items: center;
transition: border-color .3s ${easeInOutCubicBezier};
`
}, [
cE('prefix', {
raw: `
margin-right: 20px;
flex: 0;
`
}),
cE('suffix', {
raw: `
margin-left: 20px;
flex: 0;
`
}),
cE('main', {
raw: `
flex: 1;
`
}),
c('&:not(:last-child)', {
raw: `
border-bottom: 1px solid ${borderColor};
@ -55,55 +102,15 @@ export default c([
})
])
]),
cE('header, footer', {
raw: `
padding: 12px 0;
box-sizing: border-box;
transition: border-color .3s ${easeInOutCubicBezier};
`
}, [
c('&:not(:last-child)', {
raw: `
border-bottom: 1px solid ${borderColor};
`
})
]),
cB('list-item', {
raw: `
padding: 12px 0;
box-sizing: border-box;
display: flex;
flex-wrap: nowrap;
align-items: center;
transition: border-color .3s ${easeInOutCubicBezier};
`
}, [
cE('suffix', {
raw: `
margin-left: 20px;
flex: 0;
`
}),
cE('main', {
raw: `
flex: 1;
`
}),
c('&:not(:last-child)', {
raw: `
border-bottom: 1px solid ${borderColor};
`
})
]),
insideModal(
cTB('list', [
cM('bordered', {
raw: `
background-color: ${colorModal}
background-color: ${colorModal};
`
})
])
)
])
]
}
])