IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Menu: Uniform padding to make menu item hover state look better (#100275)

Browse Source 
* Menu: Uniform padding

* tweak menu header

---------

Co-authored-by: Ashley Harrison <ashley.harrison@grafana.com>
This commit is contained in:
Torkel Ödegaard 2025-02-07 19:07:10 +01:00 committed by GitHub
parent f5d8f42635
commit 79d7e11fa4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 4 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/grafana-ui/src/components/Menu/Menu.tsx
View File

@ -40,7 +40,7 @@ const MenuComp = React.forwardRef<HTMLDivElement, MenuProps>(
boxShadow="z3" boxShadow="z3"
display="inline-block" display="inline-block"
onKeyDown={handleKeys} onKeyDown={handleKeys}
paddingX={0} paddingX={0.5}
paddingY={0.5} paddingY={0.5}
ref={localRef} ref={localRef}
role="menu" role="menu"
@ -73,10 +73,11 @@ export const Menu = Object.assign(MenuComp, {
const getStyles = (theme: GrafanaTheme2) => { const getStyles = (theme: GrafanaTheme2) => {
return { return {
header: css({ header: css({
padding: theme.spacing(0.5, 1, 1, 1), padding: theme.spacing(0.5, 0.5, 1, 0.5),
}), }),
headerBorder: css({ headerBorder: css({
borderBottom: `1px solid ${theme.colors.border.weak}`, borderBottom: `1px solid ${theme.colors.border.weak}`,
marginBottom: theme.spacing(0.5),
}), }),
}; };
}; };

1
packages/grafana-ui/src/components/Menu/SubMenu.tsx
View File

@ -78,6 +78,7 @@ const getStyles = (theme: GrafanaTheme2) => {
}), }),
itemsWrapper: css({ itemsWrapper: css({
background: theme.colors.background.primary, background: theme.colors.background.primary,
padding: theme.spacing(0.5),
boxShadow: theme.shadows.z3, boxShadow: theme.shadows.z3,
display: 'inline-block', display: 'inline-block',
borderRadius: theme.shape.radius.default, borderRadius: theme.shape.radius.default,