/** @type {import('tailwindcss').Config} */
const heropatterns = require('tailwindcss-hero-patterns/src/patterns')

module.exports = {
    content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
    theme: {
        extend: {},
        heroPatterns: {
            circuitboard: heropatterns.circuitboard,
        },
        heroPatternsOpacities: ['100'],
        heroPatternColors: ['font'],
        colors: {
            background: '#dbf6db',
            'background-dark': '#bbd8bb',
            'background-light': '#ffffff',
            font: '#000000',
            'font-light': '#004f07',
            pattern: 'rgba(0,0,0,.02)',
        },
        fontFamily: {
            main: ['JetBrains Mono Variable', 'monospace'],
        },
        backgroundSize: {
            contain: 'contain',
            circuitboard: '40rem',
        },
        spacing: {
            'screen-x': '2rem',
            'screen-y': '1rem',
            'navbar-h': '4rem',
            paragraph: '1rem',
        },
        maxWidth: {
            'page-w': '45rem',
        },
        zIndex: {
            navbar: '100',
        },
    },
    plugins: [require('tailwindcss-hero-patterns')],
}