align sidebar icons properly

right now they're off because the div is consuming the default mui line height of 1.43 and adding pixels to the bottom of the div

Signed-off-by: Blake Stoddard <blake.stoddard@epicgames.com>
This commit is contained in:
Blake Stoddard
2022-11-30 14:01:32 -05:00
parent 5b0701ea1b
commit 841ce4ffba
@@ -140,6 +140,7 @@ const makeSidebarStyles = (sidebarConfig: SidebarConfig) =>
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
lineHeight: '0',
},
searchRoot: {
marginBottom: 12,
@@ -371,12 +372,14 @@ const SidebarItemBase = forwardRef<any, SidebarItemProps>((props, ref) => {
const { isOpen } = useSidebarOpenState();
const divStyle =
!isOpen && hasSubmenu ? { display: 'flex', marginLeft: '24px' } : {};
!isOpen && hasSubmenu
? { display: 'flex', marginLeft: '20px' }
: { lineHeight: '0' };
const displayItemIcon = (
<Box style={divStyle}>
<Icon fontSize="small" />
{!isOpen && hasSubmenu ? <ArrowRightIcon /> : <></>}
{!isOpen && hasSubmenu ? <ArrowRightIcon fontSize="small" /> : <></>}
</Box>
);