triangles/tailwind.config.cjs at main · anderbellstudios/triangles · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
const plugin = require('tailwindcss/plugin')

module.exports = {
  content: [
    './client/index.html',
    './client/src/**/*.{jsx,js,ts,tsx}',
  ],
  safelist: [
    'bg-cross',
    'bg-circle',
    'bg-triangle',
    'strict-hover:hover:after:bg-cross',
    'strict-hover:hover:after:bg-circle',
    'strict-hover:hover:after:bg-triangle',
    'focus-visible:after:bg-cross',
    'focus-visible:after:bg-circle',
    'focus-visible:after:bg-triangle',
  ],
  theme: {
    extend: {
      backgroundImage: {
        cross: 'url(/src/cross.svg)',
        circle: 'url(/src/circle.svg)',
        triangle: 'url(/src/triangle.svg)',
      },
    },
  },
  plugins: [
    plugin(({ addVariant }) => {
      addVariant('hocus', ['&:hover', '&:focus-visible'])
      addVariant('strict-hover', ['@media (hover: hover)'])
      addVariant('aria-hidden', ['&[aria-hidden="true"]'])
    }),
  ],
}