Layout example with a fixed sidebar and navbar

This div has the .nj-sidebar-content class. This class is mandatory to have the right behavior with a fixed sidebar.

For demonstration purpose, we added a padding of 16px and a height of 2000px, feel free to change it.

To have the navbar behave correctly in this layout, we need to add a few lines of css:

1. Adjust the height of the sidebar to accommodate the navbar:

   .nj-sidebar.nj-sidebar--custom-height {
     --nj-sidebar-top: var(--height-of-your-navbar);
     --nj-sidebar-height: calc(100% - var(--height-of-your-navbar));
   }

2. Position the navbar fixed:

   .nj-navbar.nj-navbar--fixed {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: var(--nj-semantic-elevation-z-index-fixed);
   }