speedclimbing/website

View on GitHub
tailwind.config.cjs

Summary

Maintainability
Test Coverage
const config = {
    content: [
        './src/**/*.{html,js,svelte,ts}',
        './node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}'
    ],

    theme: {
        extend: {
            colors: {
                'dark-white': '#F7F7F7',
                black: '#111827',
                'dark-grey': '#1F2937',
                grey: '#374151',
                'light-grey': '#6B7280',
                red: '#DA3C2B',
                yellow: '#DD972A',
                green: '#057A55'
            },
            fontFamily: {
                Roboto: ['Roboto', 'sans-serif'],
                Raleway: ['Raleway', 'sans-serif']
            },
            animation: {
                blink: 'blink 4s linear infinite',
                eyes: 'eyes 10s ease-in-out infinite'
            },
            keyframes: {
                blink: {
                    '0%, 96%': { transform: 'scaleY(1)' },
                    '98%': { transform: 'scaleY(0.1)' }
                },
                eyes: {
                    '0%, 25%, 50%, 75%': { transform: 'translate(0, 0)' },
                    '30%, 45%': { transform: 'translate(-10px, 0)' },
                    '80%, 95%': { transform: 'translate(10px, 0)' }
                }
            },
            boxShadow: {
                'box-light': '0 10px 50px 0 rgba(17, 24, 39, .05)',
                'box-dark': '0 10px 50px 0 rgba(247, 247, 247, .02)'
            }
        }
    },

    safelist: [
        'object-bottom',
        'object-center',
        'object-left',
        'object-left-bottom',
        'object-left-top',
        'object-right',
        'object-right-bottom',
        'object-right-top',
        'object-top',
        'w-[50%]',
        'w-[33%]',
        'left-[50%]',
        'left-[33%]',
        'left-[66%]'
    ],

    plugins: [require('flowbite/plugin')],
    darkMode: 'media'
};

module.exports = config;