fix nam make it sticky and positioned at the top of the screen (#106)

Author: rosieyohannan

ui/src/partials/navigation.hbs

@@ -1,4 +1,4 @@
-<div data-page-navigation class="{{#if class}}{{class}}{{/if}} border-r border-vapor fixed lg:relative inset-0 lg:inset-auto transform -translate-x-full lg:translate-x-0 transition-transform duration-300 z-50 lg:z-auto bg-white w-full" {{#if page.component}} data-tcomponent="{{page.component.name}}" data-tversion="{{page.version}}"{{/if}}>
+<div data-page-navigation class="{{#if class}}{{class}}{{/if}} border-r border-vapor fixed lg:sticky inset-0 lg:top-0 lg:h-screen transform -translate-x-full lg:translate-x-0 transition-transform duration-300 z-50 lg:z-auto bg-white w-full" {{#if page.component}} data-tcomponent="{{page.component.name}}" data-tversion="{{page.version}}"{{/if}}>
   <aside class="relative h-full py-6 px-9 overflow-y-scroll scrollbar-thin scrollbar-thumb-rounded-xl scrollbar-thumb-fog scrollbar-track-vapor scrollbar-track-border">
     <div class="flex items-center justify-between lg:hidden text-terminal-black mb-10">
       <img data-page-navigation-back-button src="{{{uiRootPath}}}/img/arrow-back.svg" alt="Arrow Back" class="lg:hidden h-4 w-4">