X-Git-Url: https://git.arvados.org/arvados.git/blobdiff_plain/f14b66751cfaf92a2bc28331d8878789d4040e8f..7ae86efd9905582df4191910528c3803a68ba81b:/src/common/custom-theme.ts diff --git a/src/common/custom-theme.ts b/src/common/custom-theme.ts index 0850f8815a..e5d2e5e78c 100644 --- a/src/common/custom-theme.ts +++ b/src/common/custom-theme.ts @@ -8,27 +8,49 @@ import purple from '@material-ui/core/colors/purple'; import blue from '@material-ui/core/colors/blue'; import grey from '@material-ui/core/colors/grey'; import green from '@material-ui/core/colors/green'; +import yellow from '@material-ui/core/colors/yellow'; +import red from '@material-ui/core/colors/red'; interface ArvadosThemeOptions extends ThemeOptions { customs: any; } export interface ArvadosTheme extends Theme { - customs: any; + customs: { + colors: Colors + }; +} + +interface Colors { + green700: string; + yellow700: string; } -const purple900 = purple["900"]; +const red900 = red["900"]; +const purple800 = purple["800"]; +const grey200 = grey["200"]; +const grey300 = grey["300"]; +const grey500 = grey["500"]; const grey600 = grey["600"]; +const grey700 = grey["700"]; +const grey900 = grey["900"]; + const themeOptions: ArvadosThemeOptions = { customs: { colors: { - green700: green["700"] + green700: green["700"], + yellow700: yellow["700"] } }, overrides: { + MuiTypography: { + body1: { + fontSize: '0.8125rem' + } + }, MuiAppBar: { colorPrimary: { - backgroundColor: purple900 + backgroundColor: purple800 } }, MuiTabs: { @@ -36,13 +58,43 @@ const themeOptions: ArvadosThemeOptions = { color: grey600 }, indicator: { - backgroundColor: purple900 + backgroundColor: purple800 } }, MuiTab: { selected: { fontWeight: 700, - color: purple900 + color: purple800 + } + }, + MuiList: { + root: { + color: grey900 + } + }, + MuiListItemText: { + root: { + padding: 0 + } + }, + MuiListItemIcon: { + root: { + fontSize: '1.25rem' + } + }, + MuiCardHeader: { + avatar: { + display: 'flex', + alignItems: 'center' + }, + title: { + color: grey700, + fontSize: '1.25rem' + } + }, + MuiMenuItem: { + root: { + padding: '8px 16px' } } },