You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
93 lines
1.5 KiB
93 lines
1.5 KiB
import base, { palette } from './base'
|
|
|
|
const {
|
|
white,
|
|
black,
|
|
lightningOrange,
|
|
lightOrange,
|
|
seaGray,
|
|
hoverSeaGray,
|
|
underwaterGray,
|
|
superGreen,
|
|
lightGreen,
|
|
superRed,
|
|
lightRed,
|
|
gray
|
|
} = palette
|
|
|
|
const colors = {
|
|
primaryColor: white,
|
|
secondaryColor: underwaterGray,
|
|
tertiaryColor: seaGray,
|
|
highlight: hoverSeaGray,
|
|
primaryText: black,
|
|
lightningOrange,
|
|
lightOrange,
|
|
superGreen,
|
|
lightGreen,
|
|
superRed,
|
|
lightRed,
|
|
gray
|
|
}
|
|
|
|
const buttons = {
|
|
normal: {
|
|
backgroundColor: colors.tertiaryColor,
|
|
color: colors.lightningOrange,
|
|
'&:hover:enabled': {
|
|
backgroundColor: colors.highlight
|
|
},
|
|
'&:focus': {
|
|
backgroundColor: colors.highlight
|
|
}
|
|
},
|
|
primary: {
|
|
backgroundColor: colors.lightningOrange,
|
|
color: colors.white
|
|
},
|
|
secondary: {
|
|
opacity: 0.6,
|
|
backgroundColor: 'transparent',
|
|
color: colors.primaryText,
|
|
'&:hover:enabled': {
|
|
opacity: 1
|
|
},
|
|
'&:focus': {
|
|
opacity: 1
|
|
}
|
|
}
|
|
}
|
|
const cards = {
|
|
success: {
|
|
backgroundColor: colors.lightGreen,
|
|
color: colors.superGreen
|
|
},
|
|
warning: {
|
|
backgroundColor: colors.lightOrange,
|
|
color: colors.lightningOrange
|
|
},
|
|
error: {
|
|
backgroundColor: colors.lightRed,
|
|
color: colors.superRed
|
|
}
|
|
}
|
|
const messages = {
|
|
success: {
|
|
color: colors.superGreen
|
|
},
|
|
warning: {
|
|
color: colors.lightningOrange
|
|
},
|
|
error: {
|
|
color: colors.superRed
|
|
}
|
|
}
|
|
|
|
export default {
|
|
name: 'light',
|
|
...base,
|
|
colors,
|
|
buttons,
|
|
cards,
|
|
messages
|
|
}
|
|
|