101 lines
1.8 KiB
TypeScript
101 lines
1.8 KiB
TypeScript
import type { Theme } from 'theme-ui'
|
|
|
|
export const theme: Theme = {
|
|
colors: {
|
|
text: '#333333',
|
|
background: '#FDFDFD',
|
|
primary: '#a55eea',
|
|
primaryDark: '#9454d2',
|
|
red: '#fc5c65',
|
|
redDark: '#e2525a',
|
|
green: '#26de81',
|
|
greenDark: '#22c774',
|
|
grey: '#989898',
|
|
},
|
|
styles: {
|
|
root: {
|
|
backgroundColor: 'background',
|
|
color: 'text',
|
|
fontSize: '18px',
|
|
lineHeight: '22px',
|
|
margin: '0',
|
|
li: {
|
|
mb: '4px',
|
|
},
|
|
},
|
|
},
|
|
forms: {
|
|
label: { width: 'auto', alignItems: 'center' },
|
|
input: {
|
|
p: '4px 8px',
|
|
mb: '8px',
|
|
borderColor: 'grey',
|
|
'&:focus': {
|
|
borderColor: 'primaryDark',
|
|
outline: 'none',
|
|
},
|
|
},
|
|
select: {
|
|
cursor: 'pointer',
|
|
p: '4px 8px',
|
|
borderColor: 'grey',
|
|
'&:focus': {
|
|
borderColor: 'primaryDark',
|
|
outline: 'none',
|
|
},
|
|
},
|
|
radio: {
|
|
cursor: 'pointer',
|
|
},
|
|
},
|
|
buttons: {
|
|
primary: {
|
|
color: 'background',
|
|
bg: 'primary',
|
|
py: '6px',
|
|
px: '8px',
|
|
cursor: 'pointer',
|
|
borderRadius: '0',
|
|
width: '100%',
|
|
display: 'block',
|
|
'&:hover': {
|
|
bg: 'primaryDark',
|
|
},
|
|
},
|
|
close: {
|
|
cursor: 'pointer',
|
|
color: 'text',
|
|
p: 0,
|
|
m: 0,
|
|
},
|
|
text: {
|
|
all: 'unset',
|
|
cursor: 'pointer',
|
|
color: 'primaryDark',
|
|
textDecoration: 'none',
|
|
'&:hover': {
|
|
textDecoration: 'underline',
|
|
},
|
|
},
|
|
},
|
|
links: {
|
|
footer: {
|
|
color: 'text',
|
|
textDecoration: 'none',
|
|
},
|
|
hover: {
|
|
color: 'primaryDark',
|
|
textDecoration: 'none',
|
|
'&:hover': {
|
|
textDecoration: 'underline',
|
|
},
|
|
},
|
|
},
|
|
images: {
|
|
vpnLogo: {
|
|
height: '28px',
|
|
width: 'auto',
|
|
mb: '6px',
|
|
},
|
|
},
|
|
}
|