27 Jan 2025 10:40 AM
Hello,
Since a few weeks, the appHeader of my app is weird on chrome. I use the navItem
How it is on Firefox
and Chrome :
If I click on the invisible button next to the menu, the page refresh and come back to normal
Does anyone know where it comes from or how to fix it ?
Solved! Go to Solution.
27 Jan 2025 12:01 PM
Hi Auriane
Can you share a sample code snippet so we can try to replicate?
Thanks
Indermohan Singh
27 Jan 2025 12:59 PM - edited 27 Jan 2025 01:01 PM
Here is the code :
<AppHeader>
<AppHeader.NavItems>
<AppHeader.AppNavLink appName="" href="/Home">
<AppHeader.AppIcon src="./assets/Microsoft_Office_Teams_Logo_256px.png" />
</AppHeader.AppNavLink>
<AppHeader.NavItem as={NavLink} to="/Home" ref={setHomeRef}>Home</AppHeader.NavItem>
<AppHeader.NavItem as={NavLink} to="/Subnet" ref={setSubnetRef}>Site overview</AppHeader.NavItem>
<AppHeader.NavItem as={NavLink} to="/TeamsHome" ref={setCallRef}>Call diagnostic</AppHeader.NavItem>
<AppHeader.NavItem as={NavLink} to="/Issues" ref={setIssueRef}>
Microsoft Issues
</AppHeader.NavItem>
<AppHeader.NavItem as={NavLink} to="/Install_Config" ref={setInstallRef}>Configuration</AppHeader.NavItem>
</AppHeader.NavItems>
</AppHeader>
27 Jan 2025 05:55 PM
Hi Auriane
Thanks for the code snippet. I tried with the latest Strato and I can't replicate your issue. Can you also tell me the screen width and also version numbers of Strato packages?
Thanks again
30 Jan 2025 09:04 AM - edited 30 Jan 2025 09:05 AM
I found the problem ! Thank you for your answer, it put me on the right track
It was a dumb mistake : the appHeader was in a <Flex> with the help menu and this caused the appHeader to have a small space allocated and have a weird display.