Proyectos de Subversion LeadersLinked - SPA

Rev

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