When you have this file open in SD3, you need to hide the navigation to be able to read the text on the page. Scroll down to Visibility in the Editing pane, and select Visibility hidden. When you are done, find the container off-canvas-wrapper in the element pane, then open the Editing pane and click on Reset styles.  Click on the visibility to remove it.
Remove this paragraph when you don't need it any more. It has the class p-to-be-removed.

Off canvas menu

In the previous version of my component library I used to have a slide-in menu, but it was built in an old-fashioned way. Now I found this one on the Foundation website and have built it in RFF, and also adapted it for SD3. If you want to make a component of the menu, select the container menu-wrapper. The container main, which is the rest of the page, should be made long enough to scroll. That is because then you will see that the 'hamburger' will stay fixed in the same position on the page no matter how much you scroll down.

Placeholder Picture

Two anglers testing their luck in Foca, Turkey

A note about editing the menu and the page

In order to edit the page, you need to hide the menu. Scroll down to Visibility in the Editing pane, and select Visibility hidden. When you are done, find the container off-canvas-wrapper in the element pane, then open the Editing pane and click on Reset styles, then click on the visibility to remove it.

It is also possible to have the navigation appear on the right side. For that purpose, add the class position-right to the container off-canvas-wrapper. You probably also want to move the 'hamburger' icon across. Just find the Position in the styles pane, and change the 20px that pushes the icon off the left edge to the same from the right edge.

If you want to edit the menu items in a right-aligned navigation, you need to remove the class off-canvas from the container off-canvas-wrapper. Remember to add the off-canvas class back in when you've done the editing.