parent
cb8340e734
commit
cbc0e06d4f
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'@status-im/colors': minor
|
||||
---
|
||||
|
||||
fix copper color typo
|
|
@ -20,14 +20,13 @@ export const customisation = {
|
|||
'camel/30': 'rgba(199 143 103 / 30%)',
|
||||
'camel/40': 'rgba(199 143 103 / 40%)',
|
||||
'camel/5': 'rgba(199 143 103 / 5%)',
|
||||
// fixme: rename to copper in Figma
|
||||
'cooper-50': 'rgba(203 98 86 / 100%)',
|
||||
'cooper-60': 'rgba(162 78 69 / 100%)',
|
||||
'cooper/10': 'rgba(203 98 86 / 10%)',
|
||||
'cooper/20': 'rgba(203 98 86 / 20%)',
|
||||
'cooper/30': 'rgba(203 98 86 / 30%)',
|
||||
'cooper/40': 'rgba(203 98 86 / 40%)',
|
||||
'cooper/5': 'rgba(203 98 86 / 5%)',
|
||||
'copper-50': 'rgba(203 98 86 / 100%)',
|
||||
'copper-60': 'rgba(162 78 69 / 100%)',
|
||||
'copper/10': 'rgba(203 98 86 / 10%)',
|
||||
'copper/20': 'rgba(203 98 86 / 20%)',
|
||||
'copper/30': 'rgba(203 98 86 / 30%)',
|
||||
'copper/40': 'rgba(203 98 86 / 40%)',
|
||||
'copper/5': 'rgba(203 98 86 / 5%)',
|
||||
'magenta-50': 'rgba(236 38 108 / 100%)',
|
||||
'magenta-60': 'rgba(189 30 86 / 100%)',
|
||||
'magenta/10': 'rgba(236 38 108 / 10%)',
|
||||
|
|
|
@ -38,7 +38,7 @@ const textColors: MapVariant<typeof Base, 'variant'> = {
|
|||
sky: '$white-100',
|
||||
yellow: '$white-100',
|
||||
pink: '$white-100',
|
||||
cooper: '$white-100',
|
||||
copper: '$white-100',
|
||||
camel: '$white-100',
|
||||
magenta: '$white-100',
|
||||
yin: '$white-100',
|
||||
|
@ -202,10 +202,10 @@ const Base = styled(View, {
|
|||
hoverStyle: { backgroundColor: '$pink-60' },
|
||||
pressStyle: { backgroundColor: '$pink-50' },
|
||||
},
|
||||
cooper: {
|
||||
backgroundColor: '$cooper-50',
|
||||
hoverStyle: { backgroundColor: '$cooper-60' },
|
||||
pressStyle: { backgroundColor: '$cooper-50' },
|
||||
copper: {
|
||||
backgroundColor: '$copper-50',
|
||||
hoverStyle: { backgroundColor: '$copper-60' },
|
||||
pressStyle: { backgroundColor: '$copper-50' },
|
||||
},
|
||||
camel: {
|
||||
backgroundColor: '$camel-50',
|
||||
|
|
|
@ -25,7 +25,7 @@ export const Default: Story = {
|
|||
<DividerNewMessages color="$blue-50" />
|
||||
<DividerNewMessages color="$yellow-50" />
|
||||
<DividerNewMessages color="$turquoise-50" />
|
||||
{/* <NewMessages color="$cooper-50" /> */}
|
||||
{/* <NewMessages color="$copper-50" /> */}
|
||||
{/* <NewMessages color="$sky-50" /> */}
|
||||
{/* <NewMessages color="$camel-50" /> */}
|
||||
<DividerNewMessages color="$orange-50" />
|
||||
|
|
|
@ -25,8 +25,8 @@ const light = createTheme({
|
|||
orangeHover: tokens.color['orange-60'],
|
||||
pink: tokens.color['pink-50'],
|
||||
pinkHover: tokens.color['pink-60'],
|
||||
copper: tokens.color['cooper-50'],
|
||||
copperHover: tokens.color['cooper-50'],
|
||||
copper: tokens.color['copper-50'],
|
||||
copperHover: tokens.color['copper-50'],
|
||||
camel: tokens.color['camel-50'],
|
||||
camelHover: tokens.color['camel-50'],
|
||||
placeHolderColor: tokens.color['neutral-40'],
|
||||
|
@ -82,8 +82,8 @@ const dark: BaseTheme = createTheme({
|
|||
orangeHover: tokens.color['orange-50'],
|
||||
pink: tokens.color['pink-60'],
|
||||
pinkHover: tokens.color['pink-50'],
|
||||
copper: tokens.color['cooper-60'],
|
||||
copperHover: tokens.color['cooper-50'],
|
||||
copper: tokens.color['copper-60'],
|
||||
copperHover: tokens.color['copper-50'],
|
||||
camel: tokens.color['camel-60'],
|
||||
camelHover: tokens.color['camel-50'],
|
||||
placeHolderColor: tokens.color['neutral-50'],
|
||||
|
|
Loading…
Reference in New Issue