layout

src/app/_modules/layout/header/user-bar/header-user-bar.component.ts

@@ -58,6 +58,7 @@ export class HeaderUserBarComponent {
   }
 
   link(link: string) {
+    this.pagesService.currentPageSubject.next(null);
     this.close()
     this.router.navigate([link]).then();
   }

src/app/_modules/layout/jumbotron/jumbotron.component.html

@@ -1,7 +1,7 @@
-<div class="jumbotron-bg space" [ngStyle]="back">
+<div class="jumbotron-bg space" [ngStyle]="bgStyle">
     <div class="jumbotron-content layout-corral">
         <header-user-bar></header-user-bar>
-        <h1>{{name}}</h1>
+        <h1  [ngStyle]="h1Style">{{name}}</h1>
         <div></div>
     </div>
 </div>

src/app/_modules/layout/jumbotron/jumbotron.component.ts

@@ -20,9 +20,22 @@ export class JumbotronComponent {
     return this.currentPage?.h1 || this.currentPage?.name
   }
 
-  get back(){
-    let pictURL = this.currentPage?.picture?.data.links.open;
-    return {'background-image' : `url(${pictURL})`||'none'}
+  get bgStyle(){
+    let height = 50;
+    let pictURL:string;
+    if (this.currentPage){
+      height = 150;
+      pictURL = this.currentPage?.picture?.data.links.open;
+    }
+    
+    return {
+      'background-image' : `url(${pictURL})`||'none',
+      'height': (pictURL?400:height) + 'px'
+    }
+  }
+
+  get h1Style(){
+    return { color: this.currentPage?.picture?'var(--white)':'var(--second-act)'}
   }
 
   get editable(){

src/app/_modules/layout/left-content/left-content.component.html

@@ -1 +1 @@
-<pages-menu class="lvl-0"></pages-menu>
+<!-- <pages-menu class="lvl-0"></pages-menu> -->

src/app/_modules/layout/right-content/right-content.component.html

@@ -1 +1 @@
-<pages-menu></pages-menu>
+<pages-menu *ngIf="show"></pages-menu>

src/app/_modules/layout/right-content/right-content.component.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { PagesService } from '@app/_services/pages.service';
 
 @Component({
   selector: 'right-content',
@@ -6,5 +7,11 @@ import { Component } from '@angular/core';
   styleUrls: ['./right-content.component.scss']
 })
 export class RightContentComponent {
-
+  constructor(
+    private pagesService:PagesService
+  ){}
+  get show(){
+    return !!this.pagesService.currentPage
+  }
+  
 }

src/assets/css/_grid.scss

@@ -58,12 +58,16 @@ jumbotron{
 
 
 left-content{
+  flex-basis: 180px;
+  flex-shrink: 0;
   pages-menu:not(.lvl-0,.open){
     display: none;
   }
 }
 
 right-content{
+  flex-basis: 180px;
+  flex-shrink: 0;
   .item{display: none;}
   pages-menu.current{
     pages-menu-item>.item{