diff --git a/src/components/WindowTopBar.js b/src/components/WindowTopBar.js index 1eb134694654b38970223baaa06f01a2ef3fb229..a36cd1dcc2ff569dd77d2705f3d9d59a08b58642 100644 --- a/src/components/WindowTopBar.js +++ b/src/components/WindowTopBar.js @@ -27,7 +27,7 @@ export class WindowTopBar extends Component { } = this.props; return ( <AppBar position="relative"> - <Toolbar disableGutters className={classNames(classes.reallyDense, ns('window-top-bar'))} variant="dense"> + <Toolbar disableGutters className={classNames(classes.windowTopBarStyle, ns('window-top-bar'))} variant="dense"> <IconButton aria-label={t('toggleWindowSideBar')} color="inherit" diff --git a/src/containers/WindowTopBar.js b/src/containers/WindowTopBar.js index 26c912aea4274dc48190d1accc24009007cb7b37..871a76678d52e30c4d6a942fbc1f88b9b9c63639 100644 --- a/src/containers/WindowTopBar.js +++ b/src/containers/WindowTopBar.js @@ -22,17 +22,22 @@ const mapDispatchToProps = (dispatch, { windowId }) => ({ toggleWindowSideBar: () => dispatch(actions.toggleWindowSideBar(windowId)), }); - -const styles = { +/** + * @param theme + * @returns {{typographyBody: {flexGrow: number, fontSize: number|string}, + * windowTopBarStyle: {minHeight: number, paddingLeft: number, backgroundColor: string}}} + */ +const styles = theme => ({ typographyBody: { flexGrow: 1, fontSize: '1em', }, - reallyDense: { + windowTopBarStyle: { minHeight: 32, paddingLeft: 4, + backgroundColor: theme.palette.primary.light, }, -}; +}); const enhance = compose( withNamespaces(),