Files
supabase/www/tailwind.config.js
2021-05-22 02:30:29 +00:00

124 lines
2.8 KiB
JavaScript

module.exports = {
purge: ['./components/**/*.tsx', './pages/**/*.tsx'],
darkMode: 'class', // 'media' or 'class'
mode: 'jit',
theme: {
extend: {
screens: {
sm: '640px',
// => @media (min-width: 640px) { ... }
md: '768px',
// => @media (min-width: 768px) { ... }
lg: '1024px',
// => @media (min-width: 1024px) { ... }
xl: '1280px',
// => @media (min-width: 1280px) { ... }
'2xl': '1536px',
// => @media (min-width: 1536px) { ... }
},
colors: {
'gray-light': '#7B7F86',
'gray-dark': '#7B7F86',
'accent-1': '#FAFAFA',
'accent-2': '#EAEAEA',
'accent-7': '#333',
success: '#0070f3',
cyan: '#79FFE1',
brand: {
100: '#82dab0',
200: '#69d3a0',
300: '#50cb90',
400: '#C5F1DD',
500: '#9FE7C7',
600: '#65D9A5',
700: '#3ECF8E',
800: '#38BC81',
900: '#10633E',
},
// Joshen TODO: At the end just rearrange the values
dark: {
100: '#eeeeee',
200: '#e0e0e0',
300: '#bbbbbb',
400: '#666666',
500: '#444444',
600: '#2a2a2a',
700: '#1f1f1f',
800: '#181818',
900: '#0f0f0f',
},
gray: {
100: '#eeeeee',
200: '#e0e0e0',
300: '#bbbbbb',
400: '#666666',
500: '#444444',
600: '#2a2a2a',
700: '#1f1f1f',
800: '#181818',
900: '#0f0f0f',
},
},
spacing: {
28: '7rem',
},
letterSpacing: {
tighter: '-.04em',
},
lineHeight: {
tight: 1.2,
},
fontSize: {
'5xl': '2.5rem',
'6xl': '2.75rem',
'7xl': '4.5rem',
'8xl': '6.25rem',
},
boxShadow: {
'light-small': '0px 4px 8px 2px rgba(107, 114, 128, 0.08)',
small: '0 5px 10px rgba(0, 0, 0, 0.12)',
medium: '0 8px 30px rgba(0, 0, 0, 0.12)',
override: '0px 0px 0px rgba(0, 0, 0, 0)',
},
fontFamily: {
sans: [
'custom-font',
'BlinkMacSystemFont',
'-apple-system',
'Segoe UI',
'Roboto',
'Oxygen',
'Ubuntu',
'Cantarell',
'Fira Sans',
'Droid Sans',
'Helvetica Neue',
'Helvetica',
'Arial',
'sans-serif',
],
mono: ['Source Code Pro', 'Menlo', 'monospace'],
},
stroke: (theme) => ({
white: theme('colors.white'),
black: theme('colors.black'),
}),
},
},
variants: {
extend: {
inset: ['group-hover'],
stroke: ['dark'],
height: ['hover'],
},
},
plugins: [],
corePlugins: {
preflight: true,
},
}