ToolJet/frontend/tailwind.config.js at develop · javascript-space/ToolJet · 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
/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: ['class'],
  content: ['./pages/**/*.{js,jsx}', './components/**/*.{js,jsx}', './app/**/*.{js,jsx}', './src/**/*.{js,jsx}'],
  prefix: 'tw-',
  corePlugins: {
    preflight: false,
  },
  theme: {
    extend: {
      colors: {
        'page-default': 'var(--page-default)',
        'page-weak': 'var(--page-weak)',
        'background-surface-layer-01': 'var(--background-surface-layer-01)',
        'background-surface-layer-02': 'var(--background-surface-layer-02)',
        'background-surface-layer-03': 'var(--background-surface-layer-03)',
        'background-accent-strong': 'var(--background-accent-strong)',
        'background-accent-weak': 'var(--background-accent-weak)',
        'background-success-strong': 'var(--background-success-strong)',
        'background-success-weak': 'var(--background-success-weak)',
        'background-error-strong': 'var(--background-error-strong)',
        'background-error-weak': 'var(--background-error-weak)',
        'background-warning-stong': 'var(--background-warning-stong)',
        'background-warning-weak': 'var(--background-warning-weak)',
        'background-inverse': 'var(--background-Inverse)',
        'text-default': 'var(--text-default)',
        'text-medium': 'var(--text-medium)',
        'text-placeholder': 'var(--text-placeholder)',
        'text-inverse': 'var(--text-inverse)',
        'text-brand': 'var(--text-brand)',
        'text-accent': 'var(--text-brand)',
        'text-selected': 'var(--text-selected)',
        'text-success': 'var(--text-success)',
        'text-warning': 'var(--text-warning)',
        'text-danger': 'var(--text-danger)',
        'text-on-solid': 'var(--text-on-solid)',
        'text-disabled': 'var(--text-disabled)',
        'text-disabled-on-solid': 'var(--text-disabled-on-solid)',
        'icon-strong': 'var(--icon-strong)',
        'icon-default': 'var(--icon-default)',
        'icon-weak': 'var(--icon-weak)',
        'icon-inverse': 'var(--icon-inverse)',
        'icon-on-solid': 'var(--icon-on-solid)',
        'icon-accent': 'var(--icon-accent)',
        'icon-brand': 'var(--icon-brand)',
        'icon-success': 'var(--icon-success)',
        'icon-warning': 'var(--icon-warning)',
        'icon-danger': 'var(--icon-danger)',
        'icon-disabled': 'var(--icon-disabled)',
        'border-strong': 'var(--border-strong)',
        'border-default': 'var(--border-default)',
        'border-weak': 'var(--border-weak)',
        'border-accent-strong': 'var(--border-accent-strong)',
        'border-accent-weak': 'var(--border-accent-weak)',
        'border-success-strong': 'var(--border-success-strong)',
        'border-success-weak': 'var(--border-success-weak)',
        'border-warning-strong': 'var(--border-warning-strong)',
        'border-warning-weak': 'var(--border-warning-weak)',
        'border-danger-strong': 'var(--border-danger-strong)',
        'border-danger-weak': 'var(--border-danger-weak)',
        'border-disabled': 'var(--border-disabled)',
        'interactive-weak': 'var(--interactive-weak)',
        'interactive-default': 'var(--interactive-default)',
        'interactive-hover': 'var(--interactive-hover)',
        'interactive-selected': 'var(--interactive-selected)',
        'interactive-disabled': 'var(--interactive-disabled)',
        'interactive-focus-outline': 'var(--interactive-focus-outline)',
        'interactive-focus-inner-shadow': 'var(--interactive-focus-inner-shadow)',
        'button-primary': 'var(--button-primary)',
        'button-primary-hover': 'var(--button-primary-hover)',
        'button-primary-pressed': 'var(--button-primary-pressed)',
        'button-primary-disabled': 'var(--button-primary-disabled)',
        'button-secondary': 'var(--button-secondary)',
        'button-secondary-hover': 'var(--button-secondary-hover)',
        'button-secondary-pressed': 'var(--button-secondary-pressed)',
        'button-secondary-disabled': 'var(--button-secondary-disabled)',
        'button-outline': 'var(--button-outline)',
        'button-outline-hover': 'var(--button-outline-hover)',
        'button-outline-pressed': 'var(--button-outline-pressed)',
        'button-outline-disabled': 'var(--button-outline-disabled)',
        'button-danger-primary': 'var(--button-danger-primary)',
        'button-danger-primary-hover': 'var(--button-danger-primary-hover)',
        'button-danger-primary-pressed': 'var(--button-danger-primary-pressed)',
        'button-danger-primary-disabled': 'var(--button-danger-primary-disabled)',
        'button-danger-secondary': 'var(--button-danger-secondary)',
        'button-danger-secondary-hover': 'var(--button-danger-secondary-hover)',
        'button-danger-secondary-pressed': 'var(--button-danger-secondary-pressed)',
        'button-danger-secondary-disabled': 'var(--button-danger-secondary-disabled)',
        'switch-tab': 'var(--switch-tab)',
        'switch-tag': 'var(--switch-tag)',
        'switch-background-off': 'var(--switch-background-off)',
        'switch-background-on': 'var(--switch-background-on)',
        'slider-handle': 'var(--slider-handle)',
        'slider-track': 'var(--slider-track)',
        'slider-fill': 'var(--slider-fill)',
      },
      boxShadow: {
        'interactive-focus-outline': ' 0px 0px 0px 2px var(--interactive-focus-outline)',
        'interactive-focus-outline-inset': 'inset 0px 0px 0px 2px #fff',
      },
      fontSize: {
        sm: ['11px', '16px'],
        base: ['12px', '18px'],
        lg: ['14px', '20px'],
        xl: ['16px', '24px'],
      },
      fontWeight: {
        thin: '100',
        hairline: '100',
        extralight: '200',
        light: '300',
        normal: '400',
        medium: '500',
        semibold: '600',
        bold: '700',
        extrabold: '800',
        black: '900',
      },
    },
  },
  plugins: [require('tailwindcss-animate')],
};