205 lines
4.2 KiB
JavaScript
205 lines
4.2 KiB
JavaScript
import plugin from 'tailwindcss/plugin';
|
|
|
|
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: [
|
|
'./index.html',
|
|
'./src/**/*.{html,svelte,js,ts}',
|
|
],
|
|
theme: {
|
|
screens: {
|
|
sm: '480px',
|
|
md: '768px',
|
|
lg: '976px',
|
|
xl: '1440px'
|
|
},
|
|
extend: {
|
|
spacing: {
|
|
128: '32rem',
|
|
144: '36rem'
|
|
},
|
|
borderRadius: {
|
|
'4xl': '2rem'
|
|
}
|
|
},
|
|
colors: {
|
|
'primary-yellow': '#FFBF00',
|
|
'yellow-secondary': '#FFE066',
|
|
'blue-dark': '#110042',
|
|
'blue-primary': '#4263EB',
|
|
'blue-light': '#96DDFF',
|
|
black: '#000000',
|
|
white: '#FFFFFF',
|
|
'off-white': '#F7F7F7',
|
|
'grey-dark': '#8E8E93',
|
|
'grey-primary': '#C7C7CC',
|
|
'grey-light': '#E5E5EA'
|
|
},
|
|
fontFamily: {
|
|
sans: ['Source Sans Pro', 'sans-serif'],
|
|
redacted: ['Redacted Script', 'redacted']
|
|
}
|
|
},
|
|
plugins: [
|
|
plugin(function ({ addComponents, addUtilities }) {
|
|
addComponents({});
|
|
addUtilities({
|
|
'.display-1': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '64px',
|
|
lineHeight: '72px',
|
|
letterSpacing: '-0.25px'
|
|
},
|
|
'.display-2': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '48px',
|
|
lineHeight: '56px'
|
|
},
|
|
'.display-3': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '40px',
|
|
lineHeight: '48px'
|
|
},
|
|
'.h-2': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '28px',
|
|
lineHeight: '36px'
|
|
},
|
|
'.h-3': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '24px',
|
|
lineHeight: '32px'
|
|
},
|
|
'.title-1': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '24px',
|
|
lineHeight: '30px',
|
|
letterSpacing: '0.5px'
|
|
},
|
|
'.title-2': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '16px',
|
|
lineHeight: '24px',
|
|
letterSpacing: '0.2px'
|
|
},
|
|
|
|
'.title-3': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '14px',
|
|
lineHeight: '20px',
|
|
letterSpacing: '0.16px'
|
|
},
|
|
'.label-1': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '18px',
|
|
lineHeight: '28px',
|
|
letterSpacing: '0.2px'
|
|
},
|
|
'.label-2': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '16px',
|
|
lineHeight: '24px',
|
|
letterSpacing: '0.4px'
|
|
},
|
|
|
|
'.label-3': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 600,
|
|
fontSize: '14px',
|
|
lineHeight: '20px',
|
|
letterSpacing: '0.6px'
|
|
},
|
|
'.body-1': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '16px',
|
|
lineHeight: '24px'
|
|
},
|
|
|
|
'.body-2': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '14px',
|
|
lineHeight: '20px',
|
|
letterSpacing: '0.08px'
|
|
},
|
|
'.body-3': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '12px',
|
|
lineHeight: '16px',
|
|
letterSpacing: '0.2px'
|
|
},
|
|
'.overline': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '12px',
|
|
lineHeight: '16px',
|
|
letterSpacing: '0.8px',
|
|
textTransform: 'uppercase'
|
|
},
|
|
|
|
'.caption': {
|
|
fontFamily: 'Source Sans Pro',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '12px',
|
|
lineHeight: '16px',
|
|
letterSpacing: '0.5px'
|
|
},
|
|
|
|
'.redacted-1': {
|
|
fontFamily: 'Redacted Script',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '16px',
|
|
lineHeight: '24px'
|
|
},
|
|
'.redacted-2': {
|
|
fontFamily: 'Redacted Script',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '14px',
|
|
lineHeight: '20px',
|
|
letterSpacing: '0.08px'
|
|
},
|
|
|
|
'.redacted-3': {
|
|
fontFamily: 'Redacted Script',
|
|
fontStyle: 'normal',
|
|
fontWeight: 400,
|
|
fontSize: '12px',
|
|
lineHeight: '16px',
|
|
letterSpacing: '0.2px'
|
|
}
|
|
});
|
|
})
|
|
],
|
|
darkMode: 'class'
|
|
};
|