2021-03-04 07:45:25 +01:00
|
|
|
const plugin = require('tailwindcss/plugin');
|
|
|
|
|
2021-01-03 14:18:22 +01:00
|
|
|
module.exports = {
|
2021-01-03 20:09:46 +01:00
|
|
|
future: {
|
|
|
|
removeDeprecatedGapUtilities: true,
|
|
|
|
purgeLayersByDefault: true,
|
2021-01-03 14:18:22 +01:00
|
|
|
},
|
2021-01-03 20:09:46 +01:00
|
|
|
purge: {
|
|
|
|
content: ['./src/**/*.svelte', './src/**/*.ts'],
|
2021-01-03 14:18:22 +01:00
|
|
|
},
|
2021-01-03 20:09:46 +01:00
|
|
|
theme: {
|
2021-03-04 07:45:25 +01:00
|
|
|
extend: {
|
|
|
|
colors: {
|
|
|
|
// gray-400 hue-rotated 180deg
|
|
|
|
select: '#A8A297',
|
|
|
|
},
|
|
|
|
},
|
2021-01-03 14:18:22 +01:00
|
|
|
},
|
2021-01-06 22:40:09 +01:00
|
|
|
variants: {
|
|
|
|
extend: {},
|
|
|
|
},
|
2021-02-27 13:40:04 +01:00
|
|
|
plugins: [
|
2021-03-04 07:45:25 +01:00
|
|
|
plugin(function ({ addUtilities, theme }) {
|
|
|
|
const themeColors = theme('colors');
|
|
|
|
const individualBorderColors = Object.keys(themeColors).map((colorName) => ({
|
|
|
|
[`.border-b-${colorName}`]: {
|
|
|
|
borderBottomColor: themeColors[colorName],
|
|
|
|
},
|
|
|
|
[`.border-t-${colorName}`]: {
|
|
|
|
borderTopColor: themeColors[colorName],
|
|
|
|
},
|
|
|
|
[`.border-l-${colorName}`]: {
|
|
|
|
borderLeftColor: themeColors[colorName],
|
|
|
|
},
|
|
|
|
[`.border-r-${colorName}`]: {
|
|
|
|
borderRightColor: themeColors[colorName],
|
|
|
|
},
|
|
|
|
}));
|
2021-02-27 13:40:04 +01:00
|
|
|
|
2021-03-04 07:45:25 +01:00
|
|
|
addUtilities(individualBorderColors);
|
|
|
|
}),
|
2021-02-27 13:40:04 +01:00
|
|
|
],
|
2021-01-03 20:09:46 +01:00
|
|
|
};
|