clustvirt/tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["**/*.templ", "**/*.go"],
  safelist: [
    {
      pattern: /list-image-(accepted|informational|never|possible)/,
    },
    {
      pattern: /[a-z]+-(uiblue|uired|uigreen|uiyellow|uiorange)-[0-9]+/
    },
  ],
  theme: {
    extend: {
      listStyleImage: {
        never: 'url("/static/icons/list-never.svg")',
        accepted: 'url("/static/icons/list-accepted.svg")',
        possible: 'url("/static/icons/list-possible.svg")',
        informational: 'url("/static/icons/list-informational.svg")',
      },
      content: {
        link: 'url("/static/icons/link.svg")',
      },
      colors: {
        'uiblue': {
          50: '#eff2f8',
          100: '#dee6f2',
          200: '#becce4',
          300: '#9db3d7',
          400: '#7d99c9',
          500: '#5c80bc',
          600: '#4a6696',
          700: '#374d71',
          800: '#25334b',
          900: '#121a26',
        },
        'uired': {
          50: '#fbe9ef',
          100: '#f7d2de',
          200: '#efa5bd',
          300: '#e8789d',
          400: '#e04b7c',
          500: '#d81e5b',
          600: '#ad1849',
          700: '#821237',
          800: '#560c24',
          900: '#2b0612',
        },
        'uigreen': {
          50: '#f5f9f5',
          100: '#ebf2ec',
          200: '#d8e5d8',
          300: '#c4d9c5',
          400: '#b1ccb1',
          500: '#9dbf9e',
          600: '#7e997e',
          700: '#5e735f',
          800: '#3f4c3f',
          900: '#1f2620',
        },
        'uiyellow': {
          50: '#fffff5',
          100: '#ffffea',
          200: '#fffed6',
          300: '#fffec1',
          400: '#fffdad',
          500: '#fffd98',
          600: '#ccca7a',
          700: '#99985b',
          800: '#66653d',
          900: '#33331e',
        },
        'uiorange': {
          50: '#f9f3ef',
          100: '#f2e8df',
          200: '#e5d0bf',
          300: '#d8b9a0',
          400: '#cba180',
          500: '#be8a60',
          600: '#986e4d',
          700: '#72533a',
          800: '#4c3726',
          900: '#261c13',
        },
      },
    },
  },
  plugins: [
    require('@tailwindcss/forms'),
  ],
}