When installing Greyd.Suite, the mobile menu with flyout is very simple.
FullSite Editing allows to create personalized Header, and Greyd.Suite enhances extended header flexibility.
I started with this tutorial created by Thomas (the mobile section starts at 1:55), and I built it a few times to understand better how everything is connected.
Here you can find a few screenshots that shows the main steps of the tutorial, starting with the default header elements:
1. The overlay menu is set Off (image 1) and the main navigation is hidden for larger devices (image 2)
2. Create a Popover, set the child to burger + Create a popover – Overlay. Style it as needed and disable it for large screens
3. Copy the Main Navigation in the Popover