frontpage.github.io/tailwind.config.js at master · ethersphere/frontpage.github.io · 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
67
68
69
70
71
72
73
74
75
76
/** @type {import('tailwindcss').Config} */
const defaultTheme = require("tailwindcss/defaultTheme");

module.exports = {
  content: [
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      fontFamily: {
        sans: ["InterVariable", ...defaultTheme.fontFamily.sans],
        display: ["Space GroteskVariable", ...defaultTheme.fontFamily.sans],
        mono: ["iA Mono", ...defaultTheme.fontFamily.mono],
      },
      spacing: {
        4.5: "1.125rem",
      },
      backgroundImage: {
        "millions-gradient":
          "linear-gradient(256.26deg, rgba(0, 21, 255, 0.7) 1.59%, rgba(245, 2, 236, 0.364) 94.58%);",
        "gray-gradient":
          "linear-gradient(180deg, #D3D8DC 21.19%, rgba(211, 216, 220, 0) 94.07%);",
      },
      colors: {
        gray: {
          100: "#F6F7F9",
          200: "#F0F1F2",
          225: "#E5E9EC",
          250: "#CDD2D6",
          275: "#D6DBDF",
          300: "#D3D8DC",
          350: "#B2B6B8",
          400: "#565E65",
          500: "#3C3F42",
          700: "#212426",
          800: "#141516",
          900: "#000000",
        },
        orange: {
          onDark: "#FF7A00",
          hover: "#FFAA45",
          500: "#FF8A00",
        },
        green: {
          200: "#D9EDDB",
          400: "#117800",
          500: "#1BE601",
        },
        yellow: {
          200: "#FFE2C0",
          400: "#EB7000"
        }
      },
      typography: {
        DEFAULT: {
          css: {
            "--tw-prose-bullets": "#000",
            color: "#000",
            a: {
              color: "#000",
              "&:hover": {
                color: "#000",
              },
            },
          },
        },
      },
    },
  },
  plugins: [
    require("@tailwindcss/forms"),
    require("@tailwindcss/line-clamp"),
    require("@tailwindcss/typography"),
  ],
};