Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3706 | Rev 3710 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3596 stevensc 1 
import { createTheme } from '@mui/material';
2 
 
3706 stevensc 3 
import { typography, typographyStyles } from './components/typography';
3703 stevensc 4 
import { shape } from './components/shape';
5 
import { shadows } from './components/shadows';
3706 stevensc 6 
import { formControlStyles } from './components/formControl';
3703 stevensc 7 
 
3596 stevensc 8 
import { accordionStyles } from './components/accordion';
9 
import { listStyles } from './components/list';
10 
import { menuStyles } from './components/menu';
11 
import { tabsStyles } from './components/tabs';
12 
import { inputStyles } from './components/input';
3706 stevensc 13 
import { rootSelectStyles, selectSelectStyles } from './components/select';
3596 stevensc 14 
 
15 
import colors from './config/colors';
16 
 
17 
export const defaultTheme = createTheme({
3703 stevensc 18 
  typography,
19 
  shape,
20 
  shadows,
3706 stevensc 21 
  spacing: 8,
3596 stevensc 22 
  components: {
3706 stevensc 23 
    MuiTypography: { styleOverrides: typographyStyles },
24 
    MuiFormControl: { styleOverrides: formControlStyles },
3596 stevensc 25 
    MuiButton: {
26 
      styleOverrides: {
27 
        root: ({ theme }) => ({
28 
          display: 'flex',
29 
          alignItems: 'center',
30 
          justifyContent: 'center',
31 
          gap: theme.spacing(0.5),
32 
          padding: theme.spacing(0.33, 1),
3708 stevensc 33 
          fontFamily: ['Source Sans 3', 'sans-serif'],
3596 stevensc 34 
          lineHeight: 1.25,
35 
          borderWidth: 0,
36 
          borderRadius: '30px',
37 
          color: colors.font.primary,
38 
          cursor: 'pointer',
39 
          textAlign: 'center',
40 
          textTransform: 'capitalize',
41 
          '&:disabled': {
42 
            cursor: 'no-drop',
43 
            backgroundColor: '#dddddd',
44 
            color: '#a3a1a1'
45 
          },
46 
          '&>svg': {
47 
            color: 'currentColor',
48 
            fontSize: '1.3rem'
49 
          }
50 
        }),
51 
        containedPrimary: {
52 
          backgroundColor: colors.button.background.primary,
53 
          color: colors.button.text.primary,
54 
          ':hover': {
55 
            backgroundColor: colors.button.background.primary,
56 
            opacity: 0.9
57 
          }
58 
        },
59 
        containedSecondary: {
60 
          backgroundColor: colors.button.background.secondary,
61 
          color: colors.button.text.secondary,
62 
          ':hover': {
63 
            backgroundColor: colors.button.background.secondary,
64 
            opacity: 0.9
65 
          }
66 
        },
67 
        containedInfo: {
68 
          backgroundColor: colors.button.background.tertiary,
69 
          color: colors.button.text.tertiary,
70 
          ':hover': {
71 
            backgroundColor: colors.button.background.tertiary,
72 
            opacity: 0.9
73 
          }
74 
        },
75 
        containedInherit: {
76 
          backgroundColor: 'transparent',
77 
          color: 'rgba(0, 0, 0, 0.54)',
78 
          ':hover': {
79 
            backgroundColor: 'rgba(0, 0, 0, 0.04)'
80 
          }
81 
        }
82 
      },
83 
      defaultProps: { variant: 'contained', color: 'inherit' }
84 
    },
85 
    MuiDrawer: {
86 
      styleOverrides: {
87 
        paper: {
88 
          backgroundColor: colors.main
89 
        }
90 
      }
91 
    },
92 
    MuiPaper: {
93 
      styleOverrides: {
94 
        root: ({ theme }) => ({
95 
          boxShadow: theme.shadows[1],
96 
          backgroundColor: colors.main
97 
        })
98 
      }
99 
    },
100 
    MuiAccordion: {
101 
      styleOverrides: {
102 
        root: accordionStyles
103 
      }
104 
    },
105 
    MuiFormLabel: {
106 
      styleOverrides: {
107 
        root: {
108 
          fontWeight: 'bold',
109 
          color: colors.font.primary
110 
        }
111 
      }
112 
    },
113 
    MuiInputLabel: {
114 
      styleOverrides: {
115 
        root: {
116 
          position: 'relative',
117 
          top: 'auto',
118 
          left: 'auto',
119 
          transform: 'none'
120 
        }
121 
      }
122 
    },
123 
    MuiInputBase: {
124 
      styleOverrides: {
125 
        root: inputStyles,
126 
        colorSecondary: {
127 
          backgroundColor: colors.main
128 
        }
129 
      },
130 
      variants: [
131 
        {
132 
          props: { variant: 'search' },
133 
          style: { borderRadius: 20 }
134 
        }
135 
      ],
136 
      defaultProps: {
137 
        size: 'small'
138 
      }
139 
    },
140 
    MuiSelect: {
141 
      styleOverrides: {
142 
        root: rootSelectStyles,
143 
        select: selectSelectStyles
144 
      }
145 
    },
146 
    MuiOutlinedInput: {
147 
      styleOverrides: {
148 
        notchedOutline: {
149 
          display: 'none'
150 
        }
151 
      }
152 
    },
153 
    MuiList: {
154 
      styleOverrides: {
155 
        root: listStyles
156 
      }
157 
    },
158 
    MuiMenu: {
159 
      styleOverrides: {
160 
        root: menuStyles
161 
      }
162 
    },
163 
    MuiSvgIcon: {
164 
      defaultProps: { fontSize: 'small' }
165 
    },
166 
    MuiAppBar: {
167 
      styleOverrides: {
168 
        root: {
169 
          backgroundColor: colors.main,
170 
          boxShadow: 1,
171 
          zIndex: 50
172 
        }
173 
      }
174 
    },
175 
    MuiCard: {
176 
      styleOverrides: {
177 
        root: {
178 
          boxShadow: 'none',
179 
          position: 'relative',
180 
          borderRadius: {
181 
            xs: 0,
182 
            sm: 10
183 
          },
184 
          backgroundColor: colors.main
185 
        }
186 
      }
187 
    },
188 
    MuiIconButton: {
189 
      styleOverrides: {
190 
        root: {
191 
          color: colors.icon.primary
192 
        }
193 
      }
194 
    },
195 
    MuiLinearProgress: {
196 
      styleOverrides: {
197 
        root: {
198 
          backgroundColor: colors.main,
199 
          borderRadius: 10,
200 
          flex: 1,
201 
          '& .MuiLinearProgress-bar': {
202 
            backgroundColor: colors.button.background.primary,
203 
            borderRadius: 10
204 
          }
205 
        }
206 
      }
207 
    },
208 
    MuiCardActions: {
209 
      styleOverrides: {
210 
        root: {
211 
          padding: '0.5rem',
212 
          justifyContent: 'space-around',
213 
          gap: '0.5rem',
214 
          '& > button': { flex: 1, flexWrap: 'wrap' },
215 
          borderTop: `1px solid ${colors.border.primary}`
216 
        }
217 
      }
218 
    },
219 
    MuiCardHeader: {
220 
      styleOverrides: {
221 
        avatar: ({ theme }) => ({
222 
          marginRight: theme.spacing(0.5)
223 
        })
224 
      }
225 
    },
226 
    MuiAvatarGroup: {
227 
      styleOverrides: {
228 
        root: {
229 
          flexDirection: 'row',
230 
          '& .MuiAvatar-root:last-child': {
231 
            marginLeft: '-8px'
232 
          }
233 
        }
234 
      }
235 
    },
236 
    MuiChip: {
237 
      styleOverrides: {
238 
        root: {
239 
          backgroundColor: colors.button.background.primary
240 
        },
241 
        label: {
242 
          color: colors.button.text.primary
243 
        }
244 
      }
245 
    },
246 
    MuiTabs: {
247 
      styleOverrides: {
248 
        root: tabsStyles
249 
      }
250 
    }
251 
  }
252 
});