diff --git a/src/styles/theme.js b/src/styles/theme.js index 0e524943e..e4b6a1a02 100644 --- a/src/styles/theme.js +++ b/src/styles/theme.js @@ -43,7 +43,7 @@ const theme = { upSm: '@media (min-width: 576px)' }, spacing: (value) => value * 8, - headerHeight: 80, + headerHeight: 84, sidenavWidth: 295 } diff --git a/src/views/my-account/my-account.styles.js b/src/views/my-account/my-account.styles.js index 9c4e403a6..1ea5b231b 100644 --- a/src/views/my-account/my-account.styles.js +++ b/src/views/my-account/my-account.styles.js @@ -8,7 +8,7 @@ const useMyAccountStyles = createUseStyles(theme => ({ fontSize: theme.spacing(2.5), fontWeight: theme.fontWeights.medium, textAlign: 'center', - marginTop: theme.spacing(2), + marginTop: theme.spacing(3.5), marginBottom: theme.spacing(2.5) }, topSection: { diff --git a/src/views/shared/page-header/page-header.styles.js b/src/views/shared/page-header/page-header.styles.js index b9e23eb34..18d050ead 100644 --- a/src/views/shared/page-header/page-header.styles.js +++ b/src/views/shared/page-header/page-header.styles.js @@ -6,17 +6,22 @@ const usePageHeaderStyles = createUseStyles(theme => ({ position: 'absolute', height: theme.headerHeight, display: 'flex', - alignItems: 'center', + alignItems: 'flex-end', zIndex: 998, background: 'transparent' }, - headerContent: { + headerWrapper: { + width: '100%', + display: 'flex', + flexDirection: 'column', + alignItems: 'center' + }, + titleWrapper: { width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', - position: 'relative', - marginTop: theme.spacing(3) + position: 'relative' }, buttonBase: { position: 'absolute', @@ -37,9 +42,6 @@ const usePageHeaderStyles = createUseStyles(theme => ({ right: 0, marginRight: -(theme.spacing(2)) }, - titleWrapper: { - textAlign: 'center' - }, title: { fontSize: theme.spacing(3), fontWeight: theme.fontWeights.extraBold @@ -48,7 +50,7 @@ const usePageHeaderStyles = createUseStyles(theme => ({ fontSize: theme.spacing(2), fontWeight: theme.fontWeights.medium, color: theme.palette.grey.dark, - paddingTop: theme.spacing(1.5), + paddingTop: theme.spacing(1.25), margin: 0 } })) diff --git a/src/views/shared/page-header/page-header.view.jsx b/src/views/shared/page-header/page-header.view.jsx index 183f84a3e..460a7464a 100644 --- a/src/views/shared/page-header/page-header.view.jsx +++ b/src/views/shared/page-header/page-header.view.jsx @@ -20,33 +20,33 @@ function PageHeader ({ return (
-
- {goBackAction && ( - - )} +
+ {goBackAction && ( + + )}

{title || ''}

- {subtitle &&

{subtitle}

} + {closeAction && ( + + )}
- {closeAction && ( - - )} + {subtitle &&

{subtitle}

}