console-dapp/tailwind.config.ts at master · fuseio/console-dapp · 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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
import type { Config } from 'tailwindcss'
import animate from "tailwindcss-animate"

export default {
  content: [
    './pages/**/*.{js,ts,jsx,tsx,mdx}',
    './components/**/*.{js,ts,jsx,tsx,mdx}',
    './app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    screens: {
      "4xl": { max: "2699px" },
      "3xl": { max: "1750px" },
      "2xl": { max: "1535px" },
      xl: { max: "1279px" },
      lg: { max: "1023px" },
      md: { max: "767px" },
      sm: { max: "639px" },
    },
    colors: {
      chargePurple: "#240046",
      navy: "#071927",
      "light-gray": "#F3F3F3",
      "bg-dark-gray": "#F3F3F3",
      "modal-bg": "#F2F2F2",
      "transaction-bg": "#F7F7F7",
      lightBlue: "#063B64",
      purple: "#7A159A",
      gray: "#BABABA",
      "dark-gray": "#E7E7E7",
      "darker-gray": "#C2C2C2",
      "selected-gray": "#D0D7DE",
      "selected-light-gray": "#E5E7EB",
      "text-dark-gray": "#666666",
      "secondary-gray": "#797979",
      "tertiary-gray": "##525252",
      "text-gray": "#9F9F9F",
      "text-darker-gray": "#737373",
      "text-heading-gray": "#4D4D4D",
      "lighter-gray": "#5F6B79",
      "text-inactive": "#D1D1D1",
      "lighter-blue": "#EEF2F6",
      "fuse-green": "#20B92E",
      "fuse-green-bright": "#8EFF98",
      "pale-green": "#A3F5AA",
      "pale-green-light": "#A2F5AA",
      white: "#FFFFFF",
      "fuse-black": "#1A1A1A",
      black: "#000000",
      warning: "#FFF3DD",
      error: "#FFDDDD",
      success: "#B4F9BA",
      "success-light": "#E0FFDD",
      inactive: "#EBEBEB",
      "warning-dark": "#A86D00",
      "error-dark": "#750000",
      "success-dark": "#0A7500",
      "inactive-dark": "#E5E5E6",
      "button-inactive": "#808080",
      "stake-inactive": "#B3B3B3",
      "warning-yellow": "#FFD764",
      "warning-gray": "#3B4145",
      "border-gray": "#E6E6E6",
      "border-dark-gray": "#E8E8E8",
      "lightest-gray": "#D9D9D9",
      "gray-alpha-40": "#00000066",
      "warning-border": "#D4A72C",
      "warning-bg": "#FFF8C5",
      "night": "#0A0A0A",
      "ghost": "#CBCBCB",
      "iron": "#D7D7D7",
      "red-600": "#dc2626",
      "pink-swan": "#B8B8B8",
      "soft-peach": "#EDEDED",
      "lemon-chiffon": "#FFF9C3",
      "pastel-gray": "#CDCDCD",
      "star-dust-alpha-70": "#9f9f9fb3",
      "gray-goose": "#CFCFCF",
      "dune": "#333333",
      "dove-gray": "#6B6B6B",
      "red-berry": "var(--red-berry)",
      "sundown": "#F9B4B4",
      "bean-red": "#F65D51",
      "antique-white": "#FFECDA",
      "ash-gray": "#B9B9B9",
      "pale-slate": "#BFBFBF",
      "stoplight-go-green": "#66E070",
      "charcoal-gray": "#434343",
      "peach-orange": "#EBD08B",
      "atomic-tangerine": "#FCA06D",
      "sunset-orange": "#F66851",
      sand: "#EDC765",
      marzipan: "#F5DC99"
    },
    fontFamily: {
      mona: ["var(--font-mona-sans)"],
    },
    extend: {
      spacing: {
        0.5: "0.125rem",
        "1/9": "11.1%",
        "8/9": "88.9%",
        "3/10": "30%",
        "1/10": "10%",
        "9/10": "90%",
      },
      fontSize: {
        "xl": "1rem",
        "5xl": "2.5rem",
      },
      borderWidth: {
        0.5: "0.5px",
      },
      animation: {
        "fade-in": "fadeIn 0.5s ease-in-out",
        'blink-underline': 'blink 1s linear infinite',
      },
      transform: ["group-hover"],
      gridTemplateColumns: {
        'auto-fit-400': 'repeat(auto-fit, minmax(400px, 1fr))',
        'auto-fit-250': 'repeat(auto-fit, minmax(250px, 1fr))',
      },
      colors: {
        "light-blue": "#CDD9E5",
      },
      boxShadow: {
        'inner-black': 'inset 0px 0px 0px 3px rgba(0,0,0,0.3)',
        'marzipan': '0px 8px 50px 0px #F5DC99',
      },
      dropShadow: {
        'light-tan': '0px 4px 2px #FFE9AD',
      },
      backgroundImage: {
        'linear-gradient-orange': "linear-gradient(122deg, rgba(246, 93, 81, 0.20) 5.66%, rgba(246, 93, 81, 0.00) 24.99%)",
        'linear-gradient-dark-orange': 'linear-gradient(92deg, #F7A454 0%, #F66957 100%)',
        'linear-gradient-green': "linear-gradient(122deg, rgba(102, 224, 112, 0.20) 5.66%, rgba(102, 224, 112, 0.00) 24.99%)",
        'linear-gradient-black': 'linear-gradient(180deg, #585858 0%, #000 81.5%)',
        'linear-gradient-gray': 'linear-gradient(180deg, #C7C7C7 0%, #F2F2F2 100%)',
        'linear-gradient-green-red': 'linear-gradient(45deg, #B7F5B5 0%, #F6A051 50%, #F65D51 100%)',
        'linear-gradient-green-red-bottom': 'linear-gradient(180deg, #B7F5B5 11%, #F6A051 49%, #F65D51 89%)',
        'linear-gradient-sand': 'linear-gradient(0deg, #EDC765 50.29%, #AD8213 100.29%)',
        'linear-gradient-pale-green': 'linear-gradient(180deg, #66E070 0%, #A3F5AA 100%)',
        'linear-gradient-green-thumb': "linear-gradient(180deg, #98F1A0 0%, #68E172 82%)",
        'linear-gradient-yellow': "linear-gradient(122deg, rgba(237, 199, 101, 0.20) 5.66%, rgba(237, 199, 101, 0.00) 24.99%)",
      }
    },
  },
  plugins: [animate],
} satisfies Config;