refactor: rename alert, avatar, drawer, input-group-label cssr vars

This commit is contained in:
07akioni 2020-08-02 21:25:44 +08:00
parent a1cfb6cf7e
commit 964a8b5988
12 changed files with 47 additions and 47 deletions

View File

@ -5,14 +5,14 @@ export default c([
const type = props.$instance.type
const pallete = props.$local[type]
const {
backgroundColor,
color: backgroundColor,
borderColor,
iconColor,
titleTextColor,
contentTextColor,
closeColor,
closeHoverColor,
closeActiveColor
closeColorHover,
closeColorActive
} = pallete
return cTB('alert', [
cM(type + '-type', {
@ -26,14 +26,14 @@ export default c([
}),
c('&:hover', [
cB('icon', {
fill: closeHoverColor,
stroke: closeHoverColor
fill: closeColorHover,
stroke: closeColorHover
})
]),
c('&:active', [
cB('icon', {
fill: closeActiveColor,
stroke: closeActiveColor
fill: closeColorActive,
stroke: closeColorActive
})
])
]),

View File

@ -27,53 +27,53 @@ export default create({
borderRadius,
default: {
borderColor: dividerOverlayColor,
backgroundColor: inputBackgroundOverlayColor,
color: inputBackgroundOverlayColor,
titleTextColor: primaryTextOverlayColor,
iconColor: secondaryTextOverlayColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeOverlayColor,
closeHoverColor: closeHoverOverlayColor,
closeActiveColor: closeActiveOverlayColor
closeColorHover: closeHoverOverlayColor,
closeColorActive: closeActiveOverlayColor
},
info: {
borderColor: changeColor(infoHsColor, { alpha: 0.35 }),
backgroundColor: changeColor(infoHsColor, { alpha: 0.25 }),
color: changeColor(infoHsColor, { alpha: 0.25 }),
titleTextColor: primaryTextOverlayColor,
iconColor: infoHsColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeOverlayColor,
closeHoverColor: closeHoverOverlayColor,
closeActiveColor: closeActiveOverlayColor
closeColorHover: closeHoverOverlayColor,
closeColorActive: closeActiveOverlayColor
},
success: {
borderColor: changeColor(successHsColor, { alpha: 0.35 }),
backgroundColor: changeColor(successHsColor, { alpha: 0.25 }),
color: changeColor(successHsColor, { alpha: 0.25 }),
titleTextColor: primaryTextOverlayColor,
iconColor: successHsColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeOverlayColor,
closeHoverColor: closeHoverOverlayColor,
closeActiveColor: closeActiveOverlayColor
closeColorHover: closeHoverOverlayColor,
closeColorActive: closeActiveOverlayColor
},
warning: {
borderColor: changeColor(warningHsColor, { alpha: 0.35 }),
backgroundColor: changeColor(warningHsColor, { alpha: 0.25 }),
color: changeColor(warningHsColor, { alpha: 0.25 }),
titleTextColor: primaryTextOverlayColor,
iconColor: warningHsColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeOverlayColor,
closeHoverColor: closeHoverOverlayColor,
closeActiveColor: closeActiveOverlayColor
closeColorHover: closeHoverOverlayColor,
closeColorActive: closeActiveOverlayColor
},
error: {
borderColor: changeColor(errorHsColor, { alpha: 0.35 }),
backgroundColor: changeColor(errorHsColor, { alpha: 0.25 }),
color: changeColor(errorHsColor, { alpha: 0.25 }),
titleTextColor: primaryTextOverlayColor,
iconColor: errorHsColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeOverlayColor,
closeHoverColor: closeHoverOverlayColor,
closeActiveColor: closeActiveOverlayColor
closeColorHover: closeHoverOverlayColor,
closeColorActive: closeActiveOverlayColor
}
}
}

View File

@ -17,7 +17,7 @@ export default create({
secondaryTextOverlayColor,
closeColor,
closeHoverColor,
closeActiveColor,
closeColorActive,
infoColor,
successColor,
warningColor,
@ -28,53 +28,53 @@ export default create({
borderRadius,
default: {
borderColor: dividerOverlayColor,
backgroundColor: actionBackgroundColor,
color: actionBackgroundColor,
titleTextColor: primaryTextOverlayColor,
iconColor: secondaryTextOverlayColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeColor,
closeHoverColor: closeHoverColor,
closeActiveColor: closeActiveColor
closeColorHover: closeHoverColor,
closeColorActive: closeColorActive
},
info: {
borderColor: composite(baseBackgroundColor, changeColor(infoColor, { alpha: 0.25 })),
backgroundColor: composite(baseBackgroundColor, changeColor(infoColor, { alpha: 0.08 })),
color: composite(baseBackgroundColor, changeColor(infoColor, { alpha: 0.08 })),
titleTextColor: primaryTextOverlayColor,
iconColor: infoColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeColor,
closeHoverColor: closeHoverColor,
closeActiveColor: closeActiveColor
closeColorHover: closeHoverColor,
closeColorActive: closeColorActive
},
success: {
borderColor: composite(baseBackgroundColor, changeColor(successColor, { alpha: 0.25 })),
backgroundColor: composite(baseBackgroundColor, changeColor(successColor, { alpha: 0.08 })),
color: composite(baseBackgroundColor, changeColor(successColor, { alpha: 0.08 })),
titleTextColor: primaryTextOverlayColor,
iconColor: successColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeColor,
closeHoverColor: closeHoverColor,
closeActiveColor: closeActiveColor
closeColorHover: closeHoverColor,
closeColorActive: closeColorActive
},
warning: {
borderColor: composite(baseBackgroundColor, changeColor(warningColor, { alpha: 0.33 })),
backgroundColor: composite(baseBackgroundColor, changeColor(warningColor, { alpha: 0.08 })),
color: composite(baseBackgroundColor, changeColor(warningColor, { alpha: 0.08 })),
titleTextColor: primaryTextOverlayColor,
iconColor: warningColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeColor,
closeHoverColor: closeHoverColor,
closeActiveColor: closeActiveColor
closeColorHover: closeHoverColor,
closeColorActive: closeColorActive
},
error: {
borderColor: composite(baseBackgroundColor, changeColor(errorColor, { alpha: 0.25 })),
backgroundColor: composite(baseBackgroundColor, changeColor(errorColor, { alpha: 0.08 })),
color: composite(baseBackgroundColor, changeColor(errorColor, { alpha: 0.08 })),
titleTextColor: primaryTextOverlayColor,
iconColor: errorColor,
contentTextColor: secondaryTextOverlayColor,
closeColor: closeColor,
closeHoverColor: closeHoverColor,
closeActiveColor: closeActiveColor
closeColorHover: closeHoverColor,
closeColorActive: closeColorActive
}
}
}

View File

@ -4,7 +4,7 @@ export default c([
({ props }) => {
const {
borderRadius,
backgroundColor
color: backgroundColor
} = props.$local
const {
easeInOutCubicBezier

View File

@ -14,7 +14,7 @@ export default create({
return {
...commonVariables,
borderRadius,
backgroundColor: avatarBackgroundOverlayColor
color: avatarBackgroundOverlayColor
}
}
})

View File

@ -14,7 +14,7 @@ export default create({
return {
...commonVariables,
borderRadius,
backgroundColor: avatarBackgroundOverlayColor
color: avatarBackgroundOverlayColor
}
}
})

View File

@ -8,7 +8,7 @@ import fadeInTransition from '../../../styles/_transitions/fade-in'
export default c([
({ props }) => {
const {
backgroundColor,
color: backgroundColor,
textColor
} = props.$local
const base = props.$base

View File

@ -5,7 +5,7 @@ export default create({
name: 'Drawer',
getDerivedVariables ({ derived }) {
return {
backgroundColor: derived.modalBackgroundColor,
color: derived.modalBackgroundColor,
textColor: derived.secondaryTextOverlayColor
}
}

View File

@ -5,7 +5,7 @@ export default create({
name: 'Drawer',
getDerivedVariables ({ derived }) {
return {
backgroundColor: derived.modalBackgroundColor,
color: derived.modalBackgroundColor,
textColor: derived.secondaryTextOverlayColor
}
}

View File

@ -7,7 +7,7 @@ export default c([
} = props.$base
const {
borderRadius,
backgroundColor,
color: backgroundColor,
textColor,
boxShadow
} = props.$local

View File

@ -8,7 +8,7 @@ export default create({
return {
...commonVariables,
borderRadius: base.borderRadius,
backgroundColor: derived.inputBackgroundOverlayColor,
color: derived.inputBackgroundOverlayColor,
textColor: derived.secondaryTextColor,
boxShadow: `inset 0 0 0 1px transparent`
}

View File

@ -8,7 +8,7 @@ export default create({
return {
...commonVariables,
borderRadius: base.borderRadius,
backgroundColor: derived.actionBackgroundColor,
color: derived.actionBackgroundColor,
textColor: derived.secondaryTextColor,
boxShadow: `inset 0 0 0 1px ${derived.borderColor}`
}