CPS-Website/tailwind.config.js at main · K4Lok/CPS-Website · 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
/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: 'class',
  content: [
    './pages/**/*.{js,jsx}',
    './components/**/*.{js,jsx}'
  ],
  theme: {
    extend: {
      colors: {
        // navbar: '#244C62',
        // navbar: '#465E6B',
        navbar: '#5E7E8F',
        navbarDark: '#466679',
        subHeader: '#AEAEAE',
        descriptionDark: '#D6D6D6',
        description: '#818181',
        divider: '#EFEFEF',
        themeDark: '#333E4E',
        cardDark: '#3E4B5E',
        // themeDark: '#2A3544'
        // themeDark: '#3D4D59'
      },
      height: {
        'screen': [
          '100vh','100dvh'
        ]
      },
      minHeight: {
        'screen': [
          '100vh','100dvh'
        ]
      },
      maxHeight: {
        'screen': [
          '100vh','100dvh'
        ]
      },
      keyframes: {
        wiggle: {
          '0%': { transform: 'rotate(0deg) translateY(0px)' },
          '25%': { transform: 'rotate(-1deg) translateY(-4px)' },
          '50%': { transform: 'rotate(0deg) translateY(0px)' },
          '75%': { transform: 'rotate(1deg) translateY(4px)' },
          '100%': { transform: 'rotate(0deg) translateY(0px)' },
        },
      },
      animation: {
        'wiggle': 'wiggle 3s linear infinite',
      }
    },
  },
  plugins: [
    require('tailwind-scrollbar'),
  ],
}