posterify/tailwind.config.ts at main · Dpalme/posterify · 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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./index.html', './src/**/*.{html,js,jsx,tsx,ts}'],
  theme: {
    fontFamily: {
      DEFAULT: [
        'Geologica',
        '-apple-system',
        'BlinkMacSystemFont',
        'Segoe UI',
        'Helvetica',
        'Arial',
        'sans-serif',
        'Apple Color Emoji',
        'Segoe UI Emoji',
      ],
      title: [
        'Geologica',
        '-apple-system',
        'BlinkMacSystemFont',
        'Segoe UI',
        'Helvetica',
        'Arial',
        'sans-serif',
        'Apple Color Emoji',
        'Segoe UI Emoji',
      ],
      sans: [
        'Archivo',
        '-apple-system',
        'BlinkMacSystemFont',
        'Segoe UI',
        'Helvetica',
        'Arial',
        'sans-serif',
        'Apple Color Emoji',
        'Segoe UI Emoji',
      ],
    },
    extend: {
      boxShadow: {
        sm: `-1px -1px 4px 1px var(--tw-shadow-color), 1px 1px 4px var(--tw-shadow-color)`,
        inset:
          'inset -1px -1px 4px 1px var(--tw-shadow-color), inset 1px 1px 4px var(--tw-shadow-color)',
        glow: '0px 0px 16px var(--tw-shadow-color), 0px 0px 4px var(--tw-shadow-color), 0px 0px 8px var(--tw-shadow-color)',
      },
      animation: {
        'slide-left': 'slide-left .2s cubic-bezier(0, 0, 0.2, 1)',
        squeeze: 'squeeze 1.5s ease-in-out infinite',
      },
      keyframes: {
        'slide-left': {
          '0%': { transform: 'translateX(100%)' },
          '100%': { transform: 'translateX(0%)' },
        },
        squeeze: {
          '0%,100%': { transform: 'scaleX(100%)' },
          '50%': { transform: 'scaleX(20%)' },
        },
      },
      containers: {
        '2xs': '16rem',
      },
    },
  },
};