web-app-v2/material.theme.ts at main · socious-io/web-app-v2 · 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
import { createTheme } from '@mui/material/styles';
import variables from 'src/styles/constants/_exports.module.scss';

export const theme = createTheme({
  palette: {
    primary: {
      main: variables.color_primary_600,
      dark: variables.color_primary_700,
      contrastText: variables.color_white,
    },
    secondary: {
      main: variables.color_grey_700,
      dark: variables.color_grey_300,
      contrastText: variables.color_white,
    },
    error: {
      main: variables.color_error_600,
      dark: variables.color_error_400,
      contrastText: variables.color_white,
    },
  },
  typography: {
    fontFamily: [
      'Inter',
      // 'BlinkMacSystemFont',
      // '"Segoe UI"',
      // 'Roboto',
      // '"Helvetica Neue"',
      // 'Arial',
      // 'sans-serif',
      // '"Apple Color Emoji"',
      // '"Segoe UI Emoji"',
      // '"Segoe UI Symbol"',
    ].join(','),
    h3: {
      fontSize: '30px',
      fontWeight: 600,
      lineHeight: '38px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },
    h4: {
      fontSize: '16px',
      fontWeight: 600,
      lineHeight: '24px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },

    h5: {
      fontSize: '16px',
      fontWeight: 400,
      lineHeight: '24px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },
    h6: {
      fontSize: '16px',
      fontWeight: 500,
      lineHeight: '24px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },
    subtitle1: {
      fontSize: '14px',
      fontWeight: 500,
      lineHeight: '20px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },
    subtitle2: {
      fontSize: '14px',
      fontWeight: 600,
      lineHeight: '20px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },
    caption: {
      fontSize: '14px',
      fontWeight: 400,
      lineHeight: '20px',
      letterSpacing: '0em',
      fontFamily: 'Inter',
    },
  },
});