opensource/grafana
1
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-09-27 04:33:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

Nav: Icon clickable area fills all available space (#47334)

Browse Source 
Closes #47255
This commit is contained in:
kay delaney
2022-04-13 14:41:48 +01:00
committed by GitHub
parent e86b6662a1
commit 38809d73c2
2 changed files with 4 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
public/app/core/components/NavBar/Next/NavBarItemWithoutMenu.tsx
View File

@ -71,7 +71,6 @@ export function getNavBarItemWithoutMenuStyles(theme: GrafanaTheme2, isActive?:
position: 'relative', position: 'relative',
color: isActive ? theme.colors.text.primary : theme.colors.text.secondary, color: isActive ? theme.colors.text.primary : theme.colors.text.secondary,
display: 'grid', display: 'grid',
placeItems: 'center',
'&:hover': { '&:hover': {
backgroundColor: theme.colors.action.hover, backgroundColor: theme.colors.action.hover,

4
public/app/core/components/NavBar/Next/NavBarMenu.tsx
View File

@ -356,6 +356,7 @@ function CollapsibleNavItem({
onClose(); onClose();
}} }}
className={styles.collapsibleMenuItem} className={styles.collapsibleMenuItem}
elClassName={styles.collapsibleIcon}
> >
{link.img && ( {link.img && (
<img src={link.img} alt={`${link.text} logo`} height="24" width="24" style={{ borderRadius: '50%' }} /> <img src={link.img} alt={`${link.text} logo`} height="24" width="24" style={{ borderRadius: '50%' }} />
@ -392,6 +393,9 @@ const getCollapsibleStyles = (theme: GrafanaTheme2) => ({
height: theme.spacing(6), height: theme.spacing(6),
width: theme.spacing(7), width: theme.spacing(7),
display: 'grid', display: 'grid',
}),
collapsibleIcon: css({
display: 'grid',
placeContent: 'center', placeContent: 'center',
}), }),
collapsibleSectionWrapper: css({ collapsibleSectionWrapper: css({