48 lines
1.4 KiB
JavaScript
48 lines
1.4 KiB
JavaScript
const defaultTheme = require('tailwindcss/defaultTheme');
|
|
|
|
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: [
|
|
'./src/**/*.{js,ts,jsx,tsx,mdx}',
|
|
],
|
|
darkMode: 'class',
|
|
theme: {
|
|
screens: {
|
|
'xs': '390px',
|
|
...defaultTheme.screens,
|
|
},
|
|
fontSize: {
|
|
'xs': ['0.75rem', '1rem'], // 12px on 16px
|
|
'sm': ['0.8125rem', '1.125rem'], // 13px on 18px [Default: mobile]
|
|
'base': ['0.875rem', '1.25rem'], // 14px on 20px [Default: desktop]
|
|
'lg': ['1rem', '1.25rem'], // 16px on 20px
|
|
'xl': ['1.125rem', '1.25rem'], // 18px on 20px
|
|
'2xl': ['1.25rem', '1.25rem'], // 20px on 20px
|
|
'3xl': ['1.5rem', '1.5rem'], // 24px on 24px
|
|
},
|
|
extend: {
|
|
fontFamily: {
|
|
'mono': ['var(--font-ibm-plex-mono)', ...defaultTheme.fontFamily.mono],
|
|
},
|
|
animation: {
|
|
'rotate-pulse':
|
|
'rotate-pulse 0.75s linear infinite normal both running',
|
|
},
|
|
keyframes: {
|
|
'rotate-pulse': {
|
|
'0%': { transform: 'rotate(0deg) scale(1)' },
|
|
'50%': { transform: 'rotate(180deg) scale(0.8)' },
|
|
'100%': { transform: 'rotate(360deg) scale(1)' },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
future: {
|
|
hoverOnlyWhenSupported: true,
|
|
},
|
|
plugins: [
|
|
require('@tailwindcss/forms'),
|
|
require('@tailwindcss/container-queries'),
|
|
],
|
|
};
|