Page: Remove Canvas background from primary background pages (#77008)

* Remove canvas background for primary background pages

* refactor styles
This commit is contained in:
Josh Hunt
2023-11-01 12:58:18 +00:00
committed by GitHub
parent 20c0fbf92d
commit e8f0f6b7c8
2 changed files with 28 additions and 17 deletions

View File

@ -141,7 +141,7 @@ const getStyles = (theme: GrafanaTheme2) => {
zIndex: theme.zIndex.navbarFixed, zIndex: theme.zIndex.navbarFixed,
left: 0, left: 0,
right: 0, right: 0,
boxShadow: shadow, boxShadow: config.featureToggles.dockedMegaMenu ? undefined : shadow,
background: theme.colors.background.primary, background: theme.colors.background.primary,
flexDirection: 'column', flexDirection: 'column',
borderBottom: `1px solid ${theme.colors.border.weak}`, borderBottom: `1px solid ${theme.colors.border.weak}`,

View File

@ -96,23 +96,34 @@ const getStyles = (theme: GrafanaTheme2) => {
label: 'page-content', label: 'page-content',
flexGrow: 1, flexGrow: 1,
}), }),
pageInner: css({ pageInner: css(
label: 'page-inner', {
padding: theme.spacing(2), label: 'page-inner',
borderRadius: theme.shape.radius.default, padding: theme.spacing(2),
border: `1px solid ${theme.colors.border.weak}`, borderBottom: 'none',
borderBottom: 'none', background: theme.colors.background.primary,
background: theme.colors.background.primary, display: 'flex',
display: 'flex', flexDirection: 'column',
flexDirection: 'column', flexGrow: 1,
flexGrow: 1, margin: theme.spacing(0, 0, 0, 0),
margin: theme.spacing(0, 0, 0, 0),
[theme.breakpoints.up('md')]: {
margin: theme.spacing(2, 2, 0, config.featureToggles.dockedMegaMenu ? 2 : 1),
padding: theme.spacing(3),
}, },
}), config.featureToggles.dockedMegaMenu
? {
[theme.breakpoints.up('md')]: {
padding: theme.spacing(4),
},
}
: {
borderRadius: theme.shape.radius.default,
border: `1px solid ${theme.colors.border.weak}`,
[theme.breakpoints.up('md')]: {
margin: theme.spacing(2, 2, 0, 1),
padding: theme.spacing(3),
},
}
),
canvasContent: css({ canvasContent: css({
label: 'canvas-content', label: 'canvas-content',
display: 'flex', display: 'flex',