From 85224ef90cb10839c55e3a16cd467bf9543ddd7d Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Sun, 10 Mar 2019 08:35:27 +0000 Subject: [PATCH] Update Tailwind config --- tailwind.config.js | 59 +++++++++++++++++++++++++++++++++ tailwind.js | 82 ---------------------------------------------- 2 files changed, 59 insertions(+), 82 deletions(-) create mode 100644 tailwind.config.js delete mode 100644 tailwind.js diff --git a/tailwind.config.js b/tailwind.config.js new file mode 100644 index 0000000..b6b7300 --- /dev/null +++ b/tailwind.config.js @@ -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')(), + ], +} diff --git a/tailwind.js b/tailwind.js deleted file mode 100644 index 6d2d1b6..0000000 --- a/tailwind.js +++ /dev/null @@ -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')(), - ], -}