mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2024-12-03 04:21:34 +08:00
refactor(button): optimize styles use css var
This commit is contained in:
07akioni
parent
3d4829efbc
commit
2d019f02fb
@ -63,7 +63,7 @@
|
||||
<slot />
|
||||
</div>
|
||||
<n-base-wave v-if="!text" ref="wave" />
|
||||
<div class="n-button__border-mask" />
|
||||
<div v-if="!text" class="n-button__border-mask" />
|
||||
</button>
|
||||
</template>
|
||||
|
||||
|
||||
@ -6,8 +6,7 @@ export default c([
|
||||
({ props }) => {
|
||||
const {
|
||||
waveDuration,
|
||||
opacityDisabled,
|
||||
textColorPrimary
|
||||
opacityDisabled
|
||||
} = props.$local
|
||||
const {
|
||||
cubicBezierEaseInOut,
|
||||
@ -32,7 +31,6 @@ export default c([
|
||||
user-select: none;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
color: ${textColorPrimary};
|
||||
transition:
|
||||
background-color .3s ${cubicBezierEaseInOut},
|
||||
opacity .3s ${cubicBezierEaseInOut},
|
||||
@ -119,9 +117,13 @@ export default c([
|
||||
width: 100%;
|
||||
`
|
||||
}),
|
||||
cM('disabled', {
|
||||
cursor: 'not-allowed'
|
||||
}),
|
||||
cM('dashed', {
|
||||
borderStyle: 'dashed'
|
||||
}, [
|
||||
cE('border-mask', {
|
||||
borderStyle: 'dashed'
|
||||
})
|
||||
]),
|
||||
cNotM('disabled', [
|
||||
cM('rippling', [
|
||||
c('&::after', {
|
||||
@ -133,17 +135,8 @@ export default c([
|
||||
})
|
||||
])
|
||||
]),
|
||||
cM('text', {
|
||||
raw: `
|
||||
border: none !important;
|
||||
background-color: transparent !important;
|
||||
`
|
||||
}, [
|
||||
cE('border-mask', {
|
||||
raw: `border: none !important;`
|
||||
})
|
||||
]),
|
||||
cM('disabled', {
|
||||
cursor: 'not-allowed',
|
||||
opacity: opacityDisabled
|
||||
})
|
||||
]
|
||||
|
||||
@ -1,6 +1,38 @@
|
||||
import { c, cB, cTB, cE, cM, cNotM, createKey } from '../../../_utils/cssr'
|
||||
import { read, createHoverColor, createPressedColor } from '../../../_utils/color'
|
||||
|
||||
export default c([
|
||||
({ props }) => {
|
||||
const digest = props.colorDigest || props.$instance.type
|
||||
const pallete = props.colorDigest ? createPallete(props.color) : extractPallete(props.$local, digest)
|
||||
return [
|
||||
createRippleAnimation(),
|
||||
cTB(
|
||||
'button',
|
||||
[
|
||||
cM(`${digest}-colored`, {
|
||||
'--ripple-color': pallete.rippleColor || pallete.borderColor || pallete.color
|
||||
}, [
|
||||
// wave animation
|
||||
cB('base-wave', [
|
||||
cM('active', {
|
||||
zIndex: 1,
|
||||
animationName: `button-wave-spread, button-wave-opacity`
|
||||
})
|
||||
]),
|
||||
// background-color
|
||||
createBackgroundStyle(pallete),
|
||||
// text-color
|
||||
['base', 'ghost', 'text'].map(appearance => createTextStyle(pallete, appearance)),
|
||||
// border-color
|
||||
createBorderStyle(pallete)
|
||||
])
|
||||
]
|
||||
)
|
||||
]
|
||||
}
|
||||
])
|
||||
|
||||
function createPallete (color) {
|
||||
const rgb = read(color)
|
||||
const colorHover = createHoverColor(rgb)
|
||||
@ -53,18 +85,18 @@ function extractPallete (props, type) {
|
||||
}
|
||||
}
|
||||
|
||||
function createRippleAnimation (digest, color, theme) {
|
||||
function createRippleAnimation () {
|
||||
return [
|
||||
c(`@keyframes a${theme ? theme + '-' : ''}${digest}-button-wave-spread`, {
|
||||
c(`@keyframes button-wave-spread`, {
|
||||
from: {
|
||||
boxShadow: `0 0 0.5px 0 ${color}`
|
||||
boxShadow: `0 0 0.5px 0 var(--ripple-color)`
|
||||
},
|
||||
to: {
|
||||
// don't use exact 5px since chrome will display the animation with glitches
|
||||
boxShadow: `0 0 0.5px 4.5px ${color}`
|
||||
boxShadow: `0 0 0.5px 4.5px var(--ripple-color)`
|
||||
}
|
||||
}),
|
||||
c(`@keyframes a${theme ? theme + '-' : ''}${digest}-button-wave-opacity`, {
|
||||
c(`@keyframes button-wave-opacity`, {
|
||||
from: {
|
||||
opacity: 0.6
|
||||
},
|
||||
@ -119,56 +151,8 @@ function createTextStyle (pallete, appearance) {
|
||||
])
|
||||
}
|
||||
|
||||
export default c([
|
||||
({ props }) => {
|
||||
const digest = props.colorDigest || props.$instance.type
|
||||
const pallete = props.colorDigest ? createPallete(props.color) : extractPallete(props.$local, digest)
|
||||
const theme = props.$renderedTheme
|
||||
function createBorderStyle (pallete) {
|
||||
return [
|
||||
createRippleAnimation(
|
||||
digest,
|
||||
pallete.rippleColor || pallete.borderColor || pallete.color,
|
||||
theme
|
||||
),
|
||||
cTB(
|
||||
'button',
|
||||
[
|
||||
cM(`${digest}-colored`, [
|
||||
// wave animation
|
||||
cB('base-wave', [
|
||||
cM('active', {
|
||||
zIndex: 1,
|
||||
animationName: `a${theme ? theme + '-' : ''}${digest}-button-wave-spread, a${theme ? theme + '-' : ''}${digest}-button-wave-opacity`
|
||||
})
|
||||
]),
|
||||
// background-color
|
||||
cM('base', {
|
||||
backgroundColor: pallete.color
|
||||
}, [
|
||||
cM('disabled', {
|
||||
backgroundColor: pallete.colorDisabled
|
||||
}),
|
||||
cNotM('disabled', [
|
||||
c('&:focus', {
|
||||
backgroundColor: pallete.colorFocus
|
||||
}),
|
||||
c('&:hover', {
|
||||
backgroundColor: pallete.colorHover
|
||||
}),
|
||||
c('&:active', {
|
||||
backgroundColor: pallete.colorPressed
|
||||
}),
|
||||
cM('pressed', {
|
||||
backgroundColor: pallete.colorPressed
|
||||
})
|
||||
])
|
||||
]),
|
||||
cM('ghost, text', {
|
||||
backgroundColor: 'transparent'
|
||||
}),
|
||||
// text-color
|
||||
['base', 'ghost', 'text'].map(appearance => createTextStyle(pallete, appearance)),
|
||||
// border-color
|
||||
cM('ghost, base', {
|
||||
borderColor: pallete.borderColor || pallete.color
|
||||
}, [
|
||||
@ -198,17 +182,37 @@ export default c([
|
||||
])
|
||||
])
|
||||
]),
|
||||
// dashed
|
||||
cM('dashed', {
|
||||
borderStyle: 'dashed'
|
||||
}, [
|
||||
cE('border-mask', {
|
||||
borderStyle: 'dashed'
|
||||
cM('text', {
|
||||
border: 'none'
|
||||
})
|
||||
])
|
||||
])
|
||||
]
|
||||
)
|
||||
]
|
||||
}
|
||||
|
||||
function createBackgroundStyle (pallete) {
|
||||
return [
|
||||
cM('base', {
|
||||
backgroundColor: pallete.color
|
||||
}, [
|
||||
cM('disabled', {
|
||||
backgroundColor: pallete.colorDisabled
|
||||
}),
|
||||
cNotM('disabled', [
|
||||
c('&:focus', {
|
||||
backgroundColor: pallete.colorFocus
|
||||
}),
|
||||
c('&:hover', {
|
||||
backgroundColor: pallete.colorHover
|
||||
}),
|
||||
c('&:active', {
|
||||
backgroundColor: pallete.colorPressed
|
||||
}),
|
||||
cM('pressed', {
|
||||
backgroundColor: pallete.colorPressed
|
||||
})
|
||||
])
|
||||
]),
|
||||
cM('ghost, text', {
|
||||
backgroundColor: 'transparent'
|
||||
})
|
||||
]
|
||||
}
|
||||
|
||||
@ -21,7 +21,6 @@ export default c([
|
||||
borderRadius,
|
||||
fontSize
|
||||
}, [
|
||||
|
||||
cM('base, ghost', {
|
||||
height,
|
||||
lineHeight,
|
||||
|
||||
@ -14,90 +14,168 @@ export default create({
|
||||
colorPressed: 'transparent',
|
||||
colorFocus: 'transparent',
|
||||
colorDisabled: 'transparent',
|
||||
|
||||
textColor: derived.textColorSecondary,
|
||||
textColor: derived.textColor2,
|
||||
textColorHover: derived.primaryColorHover,
|
||||
textColorPressed: derived.primaryColorPressed,
|
||||
textColorFocus: derived.primaryColorHover,
|
||||
textColorDisabled: derived.textColorSecondary,
|
||||
|
||||
textColorText: derived.textColorSecondary,
|
||||
textColorDisabled: derived.textColor2,
|
||||
textColorText: derived.textColor2,
|
||||
textColorTextHover: derived.primaryColorHover,
|
||||
textColorTextPressed: derived.primaryColorPressed,
|
||||
textColorTextFocus: derived.primaryColorHover,
|
||||
textColorTextDisabled: derived.textColorSecondary,
|
||||
|
||||
textColorGhost: derived.textColorSecondary,
|
||||
textColorTextDisabled: derived.textColor2,
|
||||
textColorGhost: derived.textColor2,
|
||||
textColorGhostHover: derived.primaryColorHover,
|
||||
textColorGhostPressed: derived.primaryColorPressed,
|
||||
textColorGhostFocus: derived.primaryColorHover,
|
||||
textColorGhostDisabled: derived.textColorSecondary,
|
||||
|
||||
textColorGhostDisabled: derived.textColor2,
|
||||
borderColor: derived.borderColorOverlay,
|
||||
borderColorHover: derived.primaryColorHover,
|
||||
borderColorPressed: derived.primaryColorPressed,
|
||||
borderColorFocus: derived.primaryColorHover,
|
||||
borderColorDisabled: derived.borderColorOverlay,
|
||||
|
||||
rippleColor: derived.primaryColor,
|
||||
|
||||
iconColor: derived.textColorSecondary,
|
||||
|
||||
// type primary
|
||||
iconColor: derived.textColor2,
|
||||
// primary
|
||||
colorPrimary: derived.primaryColor,
|
||||
colorPrimaryHover: derived.primaryColorHover,
|
||||
colorPrimaryPressed: derived.primaryColorPressed,
|
||||
colorPrimaryFocus: derived.primaryColorHover,
|
||||
colorPrimaryDisabled: derived.primaryColor,
|
||||
textColorPrimary: derived.baseColor,
|
||||
textColorPrimaryHover: derived.baseColor,
|
||||
textColorPrimaryPressed: derived.baseColor,
|
||||
textColorPrimaryFocus: derived.baseColor,
|
||||
textColorPrimaryDisabled: derived.baseColor,
|
||||
textColorPrimaryText: derived.textColor2,
|
||||
textColorPrimaryTextHover: derived.primaryColorHover,
|
||||
textColorPrimaryTextPressed: derived.primaryColorPressed,
|
||||
textColorPrimaryTextFocus: derived.primaryColorHover,
|
||||
textColorPrimaryTextDisabled: derived.textColor2,
|
||||
textColorPrimaryGhost: derived.primaryColor,
|
||||
textColorPrimaryGhostHover: derived.primaryColorHover,
|
||||
textColorPrimaryGhostPressed: derived.primaryColorPressed,
|
||||
textColorPrimaryGhostFocus: derived.primaryColorHover,
|
||||
textColorPrimaryGhostDisabled: derived.primaryColor,
|
||||
textColorPrimaryTextDisabled: derived.primaryColor,
|
||||
borderColorPrimary: derived.primaryColor,
|
||||
borderColorPrimaryHover: derived.primaryColorHover,
|
||||
borderColorPrimaryPressed: derived.primaryColorPressed,
|
||||
borderColorPrimaryFocus: derived.primaryColorHover,
|
||||
borderColorPrimaryDisabled: derived.primaryColor,
|
||||
// type info
|
||||
rippleColorPrimary: derived.primaryColor,
|
||||
iconColorPrimary: derived.primaryColor,
|
||||
// info
|
||||
colorInfo: derived.infoColor,
|
||||
colorInfoHover: derived.infoColorHover,
|
||||
colorInfoPressed: derived.infoColorPressed,
|
||||
colorInfoFocus: derived.infoColorHover,
|
||||
colorInfoDisabled: derived.infoColor,
|
||||
textColorInfo: derived.baseColor,
|
||||
textColorInfoHover: derived.baseColor,
|
||||
textColorInfoPressed: derived.baseColor,
|
||||
textColorInfoFocus: derived.baseColor,
|
||||
textColorInfoDisabled: derived.baseColor,
|
||||
textColorInfoText: derived.textColor2,
|
||||
textColorInfoTextHover: derived.infoColorHover,
|
||||
textColorInfoTextPressed: derived.infoColorPressed,
|
||||
textColorInfoTextFocus: derived.infoColorHover,
|
||||
textColorInfoTextDisabled: derived.textColor2,
|
||||
textColorInfoGhost: derived.infoColor,
|
||||
textColorInfoGhostHover: derived.infoColorHover,
|
||||
textColorInfoGhostPressed: derived.infoColorPressed,
|
||||
textColorInfoGhostFocus: derived.infoColorHover,
|
||||
textColorInfoGhostDisabled: derived.infoColor,
|
||||
textColorInfoTextDisabled: derived.infoColor,
|
||||
borderColorInfo: derived.infoColor,
|
||||
borderColorInfoHover: derived.infoColorHover,
|
||||
borderColorInfoPressed: derived.infoColorPressed,
|
||||
borderColorInfoFocus: derived.infoColorHover,
|
||||
borderColorInfoDisabled: derived.infoColor,
|
||||
// type success
|
||||
rippleColorInfo: derived.infoColor,
|
||||
iconColorInfo: derived.infoColor,
|
||||
// success
|
||||
colorSuccess: derived.successColor,
|
||||
colorSuccessHover: derived.successHoverColor,
|
||||
colorSuccessHover: derived.successColorHover,
|
||||
colorSuccessPressed: derived.successColorPressed,
|
||||
colorSuccessFocus: derived.successHoverColor,
|
||||
colorSuccessFocus: derived.successColorHover,
|
||||
colorSuccessDisabled: derived.successColor,
|
||||
textColorSuccess: derived.baseColor,
|
||||
textColorSuccessHover: derived.baseColor,
|
||||
textColorSuccessPressed: derived.baseColor,
|
||||
textColorSuccessFocus: derived.baseColor,
|
||||
textColorSuccessDisabled: derived.baseColor,
|
||||
textColorSuccessText: derived.textColor2,
|
||||
textColorSuccessTextHover: derived.successColorHover,
|
||||
textColorSuccessTextPressed: derived.successColorPressed,
|
||||
textColorSuccessTextFocus: derived.successColorHover,
|
||||
textColorSuccessTextDisabled: derived.textColor2,
|
||||
textColorSuccessGhost: derived.successColor,
|
||||
textColorSuccessGhostHover: derived.successColorHover,
|
||||
textColorSuccessGhostPressed: derived.successColorPressed,
|
||||
textColorSuccessGhostFocus: derived.successColorHover,
|
||||
textColorSuccessGhostDisabled: derived.successColor,
|
||||
textColorSuccessTextDisabled: derived.successColor,
|
||||
borderColorSuccess: derived.successColor,
|
||||
borderColorSuccessHover: derived.successColorHover,
|
||||
borderColorSuccessPressed: derived.successColorPressed,
|
||||
borderColorSuccessFocus: derived.successColorHover,
|
||||
borderColorSuccessDisabled: derived.successColor,
|
||||
// type warning
|
||||
rippleColorSuccess: derived.successColor,
|
||||
iconColorSuccess: derived.successColor,
|
||||
// warning
|
||||
colorWarning: derived.warningColor,
|
||||
colorWarningHover: derived.warningColorHover,
|
||||
colorWarningPressed: derived.warningColorPressed,
|
||||
colorWarningFocus: derived.warningColorHover,
|
||||
colorWarningDisabled: derived.warningColor,
|
||||
textColorWarning: derived.baseColor,
|
||||
textColorWarningHover: derived.baseColor,
|
||||
textColorWarningPressed: derived.baseColor,
|
||||
textColorWarningFocus: derived.baseColor,
|
||||
textColorWarningDisabled: derived.baseColor,
|
||||
textColorWarningText: derived.textColor2,
|
||||
textColorWarningTextHover: derived.warningColorHover,
|
||||
textColorWarningTextPressed: derived.warningColorPressed,
|
||||
textColorWarningTextFocus: derived.warningColorHover,
|
||||
textColorWarningTextDisabled: derived.textColor2,
|
||||
textColorWarningGhost: derived.warningColor,
|
||||
textColorWarningGhostHover: derived.warningColorHover,
|
||||
textColorWarningGhostPressed: derived.warningColorPressed,
|
||||
textColorWarningGhostFocus: derived.warningColorHover,
|
||||
textColorWarningGhostDisabled: derived.warningColor,
|
||||
textColorWarningTextDisabled: derived.warningColor,
|
||||
borderColorWarning: derived.warningColor,
|
||||
borderColorWarningHover: derived.warningColorHover,
|
||||
borderColorWarningPressed: derived.warningColorPressed,
|
||||
borderColorWarningFocus: derived.warningColorHover,
|
||||
borderColorWarningDisabled: derived.warningColor,
|
||||
// type error
|
||||
rippleColorWarning: derived.warningColor,
|
||||
iconColorWarning: derived.warningColor,
|
||||
// error
|
||||
colorError: derived.errorColor,
|
||||
colorErrorHover: derived.errorColorHover,
|
||||
colorErrorPressed: derived.errorColorPressed,
|
||||
colorErrorFocus: derived.errorColorHover,
|
||||
colorErrorDisabled: derived.errorColor,
|
||||
textColorError: derived.baseColor,
|
||||
textColorErrorHover: derived.baseColor,
|
||||
textColorErrorPressed: derived.baseColor,
|
||||
textColorErrorFocus: derived.baseColor,
|
||||
textColorErrorDisabled: derived.baseColor,
|
||||
textColorErrorText: derived.textColor2,
|
||||
textColorErrorTextHover: derived.errorColorHover,
|
||||
textColorErrorTextPressed: derived.errorColorPressed,
|
||||
textColorErrorTextFocus: derived.errorColorHover,
|
||||
textColorErrorTextDisabled: derived.textColor2,
|
||||
textColorErrorGhost: derived.errorColor,
|
||||
textColorErrorGhostHover: derived.errorColorHover,
|
||||
textColorErrorGhostPressed: derived.errorColorPressed,
|
||||
textColorErrorGhostFocus: derived.errorColorHover,
|
||||
textColorErrorGhostDisabled: derived.errorColor,
|
||||
textColorErrorTextDisabled: derived.errorColor,
|
||||
borderColorErrorDisabled: derived.errorColor
|
||||
borderColorError: derived.errorColor,
|
||||
borderColorErrorHover: derived.errorColorHover,
|
||||
borderColorErrorPressed: derived.errorColorPressed,
|
||||
borderColorErrorFocus: derived.errorColorHover,
|
||||
borderColorErrorDisabled: derived.errorColor,
|
||||
rippleColorError: derived.errorColor,
|
||||
iconColorError: derived.errorColor
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@ -14,90 +14,168 @@ export default create({
|
||||
colorPressed: 'transparent',
|
||||
colorFocus: 'transparent',
|
||||
colorDisabled: 'transparent',
|
||||
|
||||
textColor: derived.textColorSecondary,
|
||||
textColor: derived.textColor2,
|
||||
textColorHover: derived.primaryColorHover,
|
||||
textColorPressed: derived.primaryColorPressed,
|
||||
textColorFocus: derived.primaryColorHover,
|
||||
textColorDisabled: derived.textColorSecondary,
|
||||
|
||||
textColorText: derived.textColorSecondary,
|
||||
textColorDisabled: derived.textColor2,
|
||||
textColorText: derived.textColor2,
|
||||
textColorTextHover: derived.primaryColorHover,
|
||||
textColorTextPressed: derived.primaryColorPressed,
|
||||
textColorTextFocus: derived.primaryColorHover,
|
||||
textColorTextDisabled: derived.textColorSecondary,
|
||||
|
||||
textColorGhost: derived.textColorSecondary,
|
||||
textColorTextDisabled: derived.textColor2,
|
||||
textColorGhost: derived.textColor2,
|
||||
textColorGhostHover: derived.primaryColorHover,
|
||||
textColorGhostPressed: derived.primaryColorPressed,
|
||||
textColorGhostFocus: derived.primaryColorHover,
|
||||
textColorGhostDisabled: derived.textColorSecondary,
|
||||
|
||||
borderColor: derived.borderColor,
|
||||
textColorGhostDisabled: derived.textColor2,
|
||||
borderColor: derived.borderColorOverlay,
|
||||
borderColorHover: derived.primaryColorHover,
|
||||
borderColorPressed: derived.primaryColorPressed,
|
||||
borderColorFocus: derived.primaryColorHover,
|
||||
borderColorDisabled: derived.borderColor,
|
||||
|
||||
borderColorDisabled: derived.borderColorOverlay,
|
||||
rippleColor: derived.primaryColor,
|
||||
|
||||
iconColor: derived.textColorSecondary,
|
||||
|
||||
// type primary
|
||||
iconColor: derived.textColor2,
|
||||
// primary
|
||||
colorPrimary: derived.primaryColor,
|
||||
colorPrimaryHover: derived.primaryColorHover,
|
||||
colorPrimaryPressed: derived.primaryColorPressed,
|
||||
colorPrimaryFocus: derived.primaryColorHover,
|
||||
colorPrimaryDisabled: derived.primaryColor,
|
||||
textColorPrimary: derived.baseColor,
|
||||
textColorPrimaryHover: derived.baseColor,
|
||||
textColorPrimaryPressed: derived.baseColor,
|
||||
textColorPrimaryFocus: derived.baseColor,
|
||||
textColorPrimaryDisabled: derived.baseColor,
|
||||
textColorPrimaryText: derived.textColor2,
|
||||
textColorPrimaryTextHover: derived.primaryColorHover,
|
||||
textColorPrimaryTextPressed: derived.primaryColorPressed,
|
||||
textColorPrimaryTextFocus: derived.primaryColorHover,
|
||||
textColorPrimaryTextDisabled: derived.textColor2,
|
||||
textColorPrimaryGhost: derived.primaryColor,
|
||||
textColorPrimaryGhostHover: derived.primaryColorHover,
|
||||
textColorPrimaryGhostPressed: derived.primaryColorPressed,
|
||||
textColorPrimaryGhostFocus: derived.primaryColorHover,
|
||||
textColorPrimaryGhostDisabled: derived.primaryColor,
|
||||
textColorPrimaryTextDisabled: derived.primaryColor,
|
||||
borderColorPrimary: derived.primaryColor,
|
||||
borderColorPrimaryHover: derived.primaryColorHover,
|
||||
borderColorPrimaryPressed: derived.primaryColorPressed,
|
||||
borderColorPrimaryFocus: derived.primaryColorHover,
|
||||
borderColorPrimaryDisabled: derived.primaryColor,
|
||||
// type info
|
||||
rippleColorPrimary: derived.primaryColor,
|
||||
iconColorPrimary: derived.primaryColor,
|
||||
// info
|
||||
colorInfo: derived.infoColor,
|
||||
colorInfoHover: derived.infoColorHover,
|
||||
colorInfoPressed: derived.infoColorPressed,
|
||||
colorInfoFocus: derived.infoColorHover,
|
||||
colorInfoDisabled: derived.infoColor,
|
||||
textColorInfo: derived.baseColor,
|
||||
textColorInfoHover: derived.baseColor,
|
||||
textColorInfoPressed: derived.baseColor,
|
||||
textColorInfoFocus: derived.baseColor,
|
||||
textColorInfoDisabled: derived.baseColor,
|
||||
textColorInfoText: derived.textColor2,
|
||||
textColorInfoTextHover: derived.infoColorHover,
|
||||
textColorInfoTextPressed: derived.infoColorPressed,
|
||||
textColorInfoTextFocus: derived.infoColorHover,
|
||||
textColorInfoTextDisabled: derived.textColor2,
|
||||
textColorInfoGhost: derived.infoColor,
|
||||
textColorInfoGhostHover: derived.infoColorHover,
|
||||
textColorInfoGhostPressed: derived.infoColorPressed,
|
||||
textColorInfoGhostFocus: derived.infoColorHover,
|
||||
textColorInfoGhostDisabled: derived.infoColor,
|
||||
textColorInfoTextDisabled: derived.infoColor,
|
||||
borderColorInfo: derived.infoColor,
|
||||
borderColorInfoHover: derived.infoColorHover,
|
||||
borderColorInfoPressed: derived.infoColorPressed,
|
||||
borderColorInfoFocus: derived.infoColorHover,
|
||||
borderColorInfoDisabled: derived.infoColor,
|
||||
// type success
|
||||
rippleColorInfo: derived.infoColor,
|
||||
iconColorInfo: derived.infoColor,
|
||||
// success
|
||||
colorSuccess: derived.successColor,
|
||||
colorSuccessHover: derived.successHoverColor,
|
||||
colorSuccessHover: derived.successColorHover,
|
||||
colorSuccessPressed: derived.successColorPressed,
|
||||
colorSuccessFocus: derived.successHoverColor,
|
||||
colorSuccessFocus: derived.successColorHover,
|
||||
colorSuccessDisabled: derived.successColor,
|
||||
textColorSuccess: derived.baseColor,
|
||||
textColorSuccessHover: derived.baseColor,
|
||||
textColorSuccessPressed: derived.baseColor,
|
||||
textColorSuccessFocus: derived.baseColor,
|
||||
textColorSuccessDisabled: derived.baseColor,
|
||||
textColorSuccessText: derived.textColor2,
|
||||
textColorSuccessTextHover: derived.successColorHover,
|
||||
textColorSuccessTextPressed: derived.successColorPressed,
|
||||
textColorSuccessTextFocus: derived.successColorHover,
|
||||
textColorSuccessTextDisabled: derived.textColor2,
|
||||
textColorSuccessGhost: derived.successColor,
|
||||
textColorSuccessGhostHover: derived.successColorHover,
|
||||
textColorSuccessGhostPressed: derived.successColorPressed,
|
||||
textColorSuccessGhostFocus: derived.successColorHover,
|
||||
textColorSuccessGhostDisabled: derived.successColor,
|
||||
textColorSuccessTextDisabled: derived.successColor,
|
||||
borderColorSuccess: derived.successColor,
|
||||
borderColorSuccessHover: derived.successColorHover,
|
||||
borderColorSuccessPressed: derived.successColorPressed,
|
||||
borderColorSuccessFocus: derived.successColorHover,
|
||||
borderColorSuccessDisabled: derived.successColor,
|
||||
// type warning
|
||||
rippleColorSuccess: derived.successColor,
|
||||
iconColorSuccess: derived.successColor,
|
||||
// warning
|
||||
colorWarning: derived.warningColor,
|
||||
colorWarningHover: derived.warningColorHover,
|
||||
colorWarningPressed: derived.warningColorPressed,
|
||||
colorWarningFocus: derived.warningColorHover,
|
||||
colorWarningDisabled: derived.warningColor,
|
||||
textColorWarning: derived.baseColor,
|
||||
textColorWarningHover: derived.baseColor,
|
||||
textColorWarningPressed: derived.baseColor,
|
||||
textColorWarningFocus: derived.baseColor,
|
||||
textColorWarningDisabled: derived.baseColor,
|
||||
textColorWarningText: derived.textColor2,
|
||||
textColorWarningTextHover: derived.warningColorHover,
|
||||
textColorWarningTextPressed: derived.warningColorPressed,
|
||||
textColorWarningTextFocus: derived.warningColorHover,
|
||||
textColorWarningTextDisabled: derived.textColor2,
|
||||
textColorWarningGhost: derived.warningColor,
|
||||
textColorWarningGhostHover: derived.warningColorHover,
|
||||
textColorWarningGhostPressed: derived.warningColorPressed,
|
||||
textColorWarningGhostFocus: derived.warningColorHover,
|
||||
textColorWarningGhostDisabled: derived.warningColor,
|
||||
textColorWarningTextDisabled: derived.warningColor,
|
||||
borderColorWarning: derived.warningColor,
|
||||
borderColorWarningHover: derived.warningColorHover,
|
||||
borderColorWarningPressed: derived.warningColorPressed,
|
||||
borderColorWarningFocus: derived.warningColorHover,
|
||||
borderColorWarningDisabled: derived.warningColor,
|
||||
// type error
|
||||
rippleColorWarning: derived.warningColor,
|
||||
iconColorWarning: derived.warningColor,
|
||||
// error
|
||||
colorError: derived.errorColor,
|
||||
colorErrorHover: derived.errorColorHover,
|
||||
colorErrorPressed: derived.errorColorPressed,
|
||||
colorErrorFocus: derived.errorColorHover,
|
||||
colorErrorDisabled: derived.errorColor,
|
||||
textColorError: derived.baseColor,
|
||||
textColorErrorHover: derived.baseColor,
|
||||
textColorErrorPressed: derived.baseColor,
|
||||
textColorErrorFocus: derived.baseColor,
|
||||
textColorErrorDisabled: derived.baseColor,
|
||||
textColorErrorText: derived.textColor2,
|
||||
textColorErrorTextHover: derived.errorColorHover,
|
||||
textColorErrorTextPressed: derived.errorColorPressed,
|
||||
textColorErrorTextFocus: derived.errorColorHover,
|
||||
textColorErrorTextDisabled: derived.textColor2,
|
||||
textColorErrorGhost: derived.errorColor,
|
||||
textColorErrorGhostHover: derived.errorColorHover,
|
||||
textColorErrorGhostPressed: derived.errorColorPressed,
|
||||
textColorErrorGhostFocus: derived.errorColorHover,
|
||||
textColorErrorGhostDisabled: derived.errorColor,
|
||||
textColorErrorTextDisabled: derived.errorColor,
|
||||
borderColorErrorDisabled: derived.errorColor
|
||||
borderColorError: derived.errorColor,
|
||||
borderColorErrorHover: derived.errorColorHover,
|
||||
borderColorErrorPressed: derived.errorColorPressed,
|
||||
borderColorErrorFocus: derived.errorColorHover,
|
||||
borderColorErrorDisabled: derived.errorColor,
|
||||
rippleColorError: derived.errorColor,
|
||||
iconColorError: derived.errorColor
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
Loading…
Reference in New Issue
Block a user