Update Tailwind config
This commit is contained in:
parent
3cefd0bbe5
commit
85224ef90c
59
tailwind.config.js
Normal file
59
tailwind.config.js
Normal file
|
@ -0,0 +1,59 @@
|
||||||
|
defaultTheme = require('tailwindcss/defaultTheme')()
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
theme: {
|
||||||
|
colors: {
|
||||||
|
'inherit': 'inherit',
|
||||||
|
'black': '#22292f',
|
||||||
|
'blue': '#018dc7',
|
||||||
|
'blue-dark': '#0e68a7',
|
||||||
|
'blue-darker': '#004f86',
|
||||||
|
'blue-light': '#29aae1',
|
||||||
|
'green': '#398002',
|
||||||
|
'grey': '#B7B7B7',
|
||||||
|
'grey-dark': '#888888',
|
||||||
|
'grey-darker': '#555555',
|
||||||
|
'grey-darkest': '#333333',
|
||||||
|
'grey-light': '#DDDDDD',
|
||||||
|
'grey-lighter': '#eeeeee',
|
||||||
|
'grey-lightest': '#f8fafc',
|
||||||
|
'orange': '#FA9903',
|
||||||
|
'orange-light': '#FFB401',
|
||||||
|
'purple': '#991FAF',
|
||||||
|
'red-dark': '#cc1f1a',
|
||||||
|
'teal': '#3F7B8F',
|
||||||
|
'transparent': 'transparent',
|
||||||
|
'white': '#ffffff',
|
||||||
|
'yellow-lightest': '#FAF8DF'
|
||||||
|
},
|
||||||
|
extend: {
|
||||||
|
borderWidth: {
|
||||||
|
'3': '3px',
|
||||||
|
'6': '6px',
|
||||||
|
'10': '10px',
|
||||||
|
},
|
||||||
|
boxShadow: {
|
||||||
|
md: '0 0 10px 0 rgba(0,0,0,0.1)',
|
||||||
|
},
|
||||||
|
fontFamily: {
|
||||||
|
'sans': ['Proxima Nova', ...defaultTheme.fontFamily.sans],
|
||||||
|
},
|
||||||
|
fontSize: {
|
||||||
|
'2xs': '.625rem', // 10px
|
||||||
|
},
|
||||||
|
spacing: {
|
||||||
|
'48': '10rem',
|
||||||
|
'56': '14rem',
|
||||||
|
'64': '16rem',
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
'56': '14rem',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
require('tailwindcss/plugins/container')(),
|
||||||
|
require('tailwindcss-spaced-items')({ values: defaultTheme.spacing }),
|
||||||
|
require('tailwindcss-visuallyhidden')(),
|
||||||
|
],
|
||||||
|
}
|
82
tailwind.js
82
tailwind.js
|
@ -1,82 +0,0 @@
|
||||||
let defaultConfig = require('tailwindcss/defaultConfig')()
|
|
||||||
|
|
||||||
var colors = {
|
|
||||||
...defaultConfig.colors,
|
|
||||||
'inherit': 'inherit',
|
|
||||||
'black': '#22292f',
|
|
||||||
'blue': '#018dc7',
|
|
||||||
'blue-dark': '#0e68a7',
|
|
||||||
'blue-darker': '#004f86',
|
|
||||||
'blue-light': '#29aae1',
|
|
||||||
'green': '#398002',
|
|
||||||
'grey': '#B7B7B7',
|
|
||||||
'grey-dark': '#888888',
|
|
||||||
'grey-darker': '#555555',
|
|
||||||
'grey-darkest': '#333333',
|
|
||||||
'grey-light': '#DDDDDD',
|
|
||||||
'grey-lighter': '#eeeeee',
|
|
||||||
'grey-lightest': '#f8fafc',
|
|
||||||
'orange': '#FA9903',
|
|
||||||
'orange-light': '#FFB401',
|
|
||||||
'purple': '#991FAF',
|
|
||||||
'red-dark': '#cc1f1a',
|
|
||||||
'teal': '#3F7B8F',
|
|
||||||
'transparent': 'transparent',
|
|
||||||
'white': '#ffffff',
|
|
||||||
'yellow-lightest': '#FAF8DF'
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = {
|
|
||||||
...defaultConfig,
|
|
||||||
colors: colors,
|
|
||||||
textColors: colors,
|
|
||||||
backgroundColors: colors,
|
|
||||||
borderColors: Object.assign({ default: colors['grey-light'] }, colors),
|
|
||||||
fonts: {
|
|
||||||
...defaultConfig.fonts,
|
|
||||||
'sans': [
|
|
||||||
'Proxima Nova',
|
|
||||||
'system-ui',
|
|
||||||
'BlinkMacSystemFont',
|
|
||||||
'-apple-system',
|
|
||||||
'Segoe UI',
|
|
||||||
'Roboto',
|
|
||||||
'Oxygen',
|
|
||||||
'Ubuntu',
|
|
||||||
'Cantarell',
|
|
||||||
'Fira Sans',
|
|
||||||
'Droid Sans',
|
|
||||||
'Helvetica Neue',
|
|
||||||
'sans-serif',
|
|
||||||
],
|
|
||||||
},
|
|
||||||
textSizes: {
|
|
||||||
...defaultConfig.textSizes,
|
|
||||||
'2xs': '.625rem', // 10px
|
|
||||||
},
|
|
||||||
borderWidths: {
|
|
||||||
...defaultConfig.borderWidths,
|
|
||||||
'3': '3px',
|
|
||||||
'6': '6px',
|
|
||||||
'10': '10px',
|
|
||||||
},
|
|
||||||
margin: {
|
|
||||||
...defaultConfig.margin,
|
|
||||||
'48': '10rem',
|
|
||||||
'56': '14rem',
|
|
||||||
'64': '16rem',
|
|
||||||
},
|
|
||||||
width: {
|
|
||||||
...defaultConfig.width,
|
|
||||||
'56': '14rem',
|
|
||||||
},
|
|
||||||
shadows: {
|
|
||||||
...defaultConfig.shadows,
|
|
||||||
'md': '0 0 10px 0 rgba(0,0,0,0.1)'
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
require('tailwindcss/plugins/container')(),
|
|
||||||
require('tailwindcss-spaced-items')(),
|
|
||||||
require('tailwindcss-visuallyhidden')(),
|
|
||||||
],
|
|
||||||
}
|
|
Reference in a new issue