Closed StephenOTT closed 2 weeks ago
If you load app bar in place of the traditional nav menu and go to XS sizes you get:
The top of the window is cut off.
Where traditional navMenu would be placed:
<FluentStack Class="main" Orientation="Orientation.Horizontal" Width="100%" HorizontalGap="2"> @* <NavMenu/> *@ <FluentStack Orientation="Orientation.Vertical" HorizontalAlignment="HorizontalAlignment.Center" Width="70px"> <FluentAppBar PopoverShowSearch="true" Class="pl-5" Style="height: 100%; max-height: 70dvh"> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> <FluentAppBarItem IconRest="ResourcesIcon()" IconActive="ResourcesIcon(true)" Text="Some Title"/> </FluentAppBar> </FluentStack> ...
A simple quick fix is to add some top padding to the popover's fluent-anchored-region:
fluent-anchored-region
using 4.7.1
š Bug Report
If you load app bar in place of the traditional nav menu and go to XS sizes you get:
The top of the window is cut off.
š» Repro or Code Sample
Where traditional navMenu would be placed:
š¤ Expected Behavior
A simple quick fix is to add some top padding to the popover's
fluent-anchored-region
:using 4.7.1