IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2024-12-28 18:01:40 -06:00
Code Issues Packages Projects Releases Wiki Activity

tidy up styles + fix docked menu overlaying popovers (#91380)

Browse Source
This commit is contained in:
Ashley Harrison 2024-08-01 14:16:45 +02:00 committed by GitHub
parent aa6e9379bf
commit 7a9a34629b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 43 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
public/app/core/components/AppChrome/AppChrome.tsx
View File

@ -141,28 +141,23 @@ const getStyles = (theme: GrafanaTheme2, searchBarHidden: boolean) => {
paddingTop: 0, paddingTop: 0,
}), }),
dockedMegaMenu: css( dockedMegaMenu: css(
{
background: theme.colors.background.primary,
borderRight: `1px solid ${theme.colors.border.weak}`,
display: 'none',
[theme.breakpoints.up('xl')]: {
display: 'block',
},
},
config.featureToggles.bodyScrolling config.featureToggles.bodyScrolling
? { ? {
background: theme.colors.background.primary,
borderRight: `1px solid ${theme.colors.border.weak}`,
display: 'none',
position: 'fixed', position: 'fixed',
height: `calc(100% - ${searchBarHidden ? TOP_BAR_LEVEL_HEIGHT : TOP_BAR_LEVEL_HEIGHT * 2}px)`, height: `calc(100% - ${searchBarHidden ? TOP_BAR_LEVEL_HEIGHT : TOP_BAR_LEVEL_HEIGHT * 2}px)`,
zIndex: theme.zIndex.navbarFixed, zIndex: 1,
[theme.breakpoints.up('xl')]: {
display: 'block',
},
} }
: { : {
background: theme.colors.background.primary,
borderRight: `1px solid ${theme.colors.border.weak}`,
display: 'none',
zIndex: theme.zIndex.navbarFixed, zIndex: theme.zIndex.navbarFixed,
[theme.breakpoints.up('xl')]: {
display: 'block',
},
} }
), ),
topNav: css({ topNav: css({
@ -175,54 +170,44 @@ const getStyles = (theme: GrafanaTheme2, searchBarHidden: boolean) => {
flexDirection: 'column', flexDirection: 'column',
}), }),
panes: css( panes: css(
config.featureToggles.bodyScrolling {
? { display: 'flex',
display: 'flex', flexDirection: 'column',
flexDirection: 'column', flexGrow: 1,
flexGrow: 1, label: 'page-panes',
label: 'page-panes', },
} !config.featureToggles.bodyScrolling && {
: { height: '100%',
label: 'page-panes', minHeight: 0,
display: 'flex', width: '100%',
height: '100%', [theme.breakpoints.up('md')]: {
width: '100%', flexDirection: 'row',
flexGrow: 1, },
minHeight: 0, }
flexDirection: 'column',
[theme.breakpoints.up('md')]: {
flexDirection: 'row',
},
}
), ),
pageContainerMenuDocked: css({ pageContainerMenuDocked: css({
paddingLeft: '300px', paddingLeft: '300px',
}), }),
pageContainer: css( pageContainer: css(
config.featureToggles.bodyScrolling {
? { label: 'page-container',
label: 'page-container', display: 'flex',
display: 'flex', flexDirection: 'column',
flexDirection: 'column', flexGrow: 1,
flexGrow: 1, },
} !config.featureToggles.bodyScrolling && {
: { minHeight: 0,
label: 'page-container', minWidth: 0,
display: 'flex', overflow: 'auto',
flexDirection: 'column', '@media print': {
flexGrow: 1, overflow: 'visible',
minHeight: 0, },
minWidth: 0, '@page': {
overflow: 'auto', margin: 0,
'@media print': { size: 'auto',
overflow: 'visible', padding: 0,
}, },
'@page': { }
margin: 0,
size: 'auto',
padding: 0,
},
}
), ),
skipLink: css({ skipLink: css({
position: 'fixed', position: 'fixed',