src/common/custom-theme.ts

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import { createMuiTheme } from '@material-ui/core/styles';
   6 import { ThemeOptions, Theme } from '@material-ui/core/styles/createMuiTheme';
   7 import purple from '@material-ui/core/colors/purple';
   8 import blue from '@material-ui/core/colors/blue';
   9 import grey from '@material-ui/core/colors/grey';
  10 import green from '@material-ui/core/colors/green';
  11
  12 interface ArvadosThemeOptions extends ThemeOptions {
  13     customs: any;
  14 }
  15
  16 export interface ArvadosTheme extends Theme {
  17     customs: any;
  18 }
  19
  20 const purple900 = purple["900"];
  21 const grey600 = grey["600"];
  22 const themeOptions: ArvadosThemeOptions = {
  23     customs: {
  24         colors: {
  25             green700: green["700"]
  26         }
  27     },
  28     overrides: {
  29         MuiAppBar: {
  30             colorPrimary: {
  31                 backgroundColor: purple900
  32             }
  33         },
  34         MuiTabs: {
  35             root: {
  36                 color: grey600
  37             },
  38             indicator: {
  39                 backgroundColor: purple900
  40             }
  41         },
  42         MuiTab: {
  43             selected: {
  44                 fontWeight: 700,
  45                 color: purple900
  46             }
  47         }
  48     },
  49     mixins: {
  50         toolbar: {
  51             minHeight: '48px'
  52         }
  53     },
  54     palette: {
  55         primary: {
  56             main: '#06C',
  57             dark: blue.A100
  58         }
  59     }
  60 };
  61
  62 export const CustomTheme = createMuiTheme(themeOptions);