Theme

General

This is an apple 🍎

This is an orange 🍊

This is a banana 🍌

Creating a theme

import { createThemes } from '@constcss/solidjs'
export const theme = createThemes({
    'light': {
        'margin': {
            'small': '5px',
            'medium': '10px',
            'large': '15px'
        },
        'colors': {
            'primary': '#000000',
            'secondary': '#ffffff'
        }
    }
})

Setting a theme

import { setTheme } from '@constcss/solidjs'
setTheme('light')

Using a theme

import { styled } from '@constcss/solidjs'
import { theme } from './theme'

const div = styled.div`
    margin: ${theme.margin.small};
    background-color: ${theme.colors.primary};
`