refactor: height 100% and back btn

src/app/components/simple-layout/simple-layout.html

@@ -1,4 +1,11 @@
 <div class="content">
-  <h1>{{title()|translate|titlecase}}</h1>
+  <header>
+    @if(withBackBtn()){
+      <button class="icon" (click)="location.back()">
+        <mat-icon>arrow_back</mat-icon>
+      </button>
+    }
+    <h1>{{title()|translate|titlecase}}</h1>
+  </header>
   <ng-content></ng-content>
 </div>

src/app/components/simple-layout/simple-layout.scss

@@ -1,3 +1,19 @@
+header {
+  display: flex;
+  button {
+    background-color: unset;
+    border: unset;
+  }
+  & .icon {
+    align-items: center;
+    display: flex;
+    padding-right: 16px;
+  }
+}
+
 .content {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
   padding: 0px 16px;
 }

src/app/components/simple-layout/simple-layout.ts

@@ -1,13 +1,18 @@
 import { TitleCasePipe } from '@angular/common';
-import { Component, input } from '@angular/core';
+import { Component, inject, input } from '@angular/core';
 import { TranslatePipe } from '@ngx-translate/core';
-
+import { RouterLink } from "@angular/router";
+import { Location } from '@angular/common';
+import { MatIcon } from "@angular/material/icon";
+import { MatAnchor, MatButton } from "@angular/material/button";
 @Component({
   selector: 'app-simple-layout',
-  imports: [TranslatePipe, TitleCasePipe],
+  imports: [TranslatePipe, TitleCasePipe, MatIcon],
   templateUrl: './simple-layout.html',
   styleUrl: './simple-layout.scss',
 })
 export class SimpleLayout {
+  protected location = inject(Location)
   readonly title = input('');
+  readonly withBackBtn = input(false);
 }