Page menu PT1

src/app/app.routes.ts

@@ -19,6 +19,10 @@ export const routes: Routes = [
                 path:'messages',
                 loadComponent: () => import('./pages/messages/messages-menu/messages-menu.component').then(x => x.MessagesMenu)
             },
+            {
+                path:'menu',
+                loadComponent: () => import('./pages/menu/menu/menu.component').then(x => x.Menu)
+            },
 
             /*{
                 path:'parameters',

src/app/pages/menu/menu-nav/menu-nav.component.html

@@ -0,0 +1,7 @@
+<button class="hamburger-btn" (click)="openNav()">
+    <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="100" height="100" viewBox="0,0,256,256">
+        <g fill-opacity="0.8" fill="#bd5a5a" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-size="none" style="mix-blend-mode: normal">
+            <g transform="scale(3.55556,3.55556)">
+                <path d="M56,48c2.209,0 4,1.791 4,4c0,2.209 -1.791,4 -4,4c-1.202,0 -38.798,0 -40,0c-2.209,0 -4,-1.791 -4,-4c0,-2.209 1.791,-4 4,-4c1.202,0 38.798,0 40,0zM56,32c2.209,0 4,1.791 4,4c0,2.209 -1.791,4 -4,4c-1.202,0 -38.798,0 -40,0c-2.209,0 -4,-1.791 -4,-4c0,-2.209 1.791,-4 4,-4c1.202,0 38.798,0 40,0zM56,16c2.209,0 4,1.791 4,4c0,2.209 -1.791,4 -4,4c-1.202,0 -38.798,0 -40,0c-2.209,0 -4,-1.791 -4,-4c0,-2.209 1.791,-4 4,-4c1.202,0 38.798,0 40,0z"></path></g></g>
+    </svg>
+</button>

src/app/pages/menu/menu-nav/menu-nav.component.ts

@@ -0,0 +1,16 @@
+import {Component, inject} from '@angular/core';
+import {Router} from "@angular/router";
+
+@Component({
+  selector: 'app-menu-nav',
+  imports: [],
+  templateUrl: './menu-nav.component.html',
+  styleUrl: './menu-nav.component.css'
+})
+export class MenuNav {
+  private router = inject(Router)
+
+  openNav() {
+    this.router.navigate(['/messages']);
+  }
+}

src/app/pages/menu/menu/menu.component.html

@@ -0,0 +1 @@
+<app-menu-nav/>

src/app/pages/menu/menu/menu.component.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {MenuNav} from "../menu-nav/menu-nav.component";
+
+@Component({
+  selector: 'app-menu',
+  imports: [
+    MenuNav
+  ],
+  templateUrl: './menu.component.html',
+  styleUrl: './menu.component.css'
+})
+export class Menu {
+
+}

src/app/pages/messages/messages-main/messages-main.component.html

@@ -16,6 +16,5 @@
         <app-messages-send/>
     </div>
 
-
 </div>
 

src/app/pages/messages/messages-main/messages-main.component.ts

@@ -2,6 +2,7 @@ import { Component } from '@angular/core';
 import {MessagesMenu} from "../messages-menu/messages-menu.component";
 import {MessagesInfoUser} from "../messages-infouser/messages-infouser.component";
 import {MessagesSend} from "../messages-send/messages-send.component";
+import {Router} from '@angular/router';
 
 @Component({
   selector: 'app-messages-main',

src/app/pages/messages/messages-menu/messages-menu.component.html

@@ -1,4 +1,4 @@
-<button class="hamburger-btn">
+<button class="hamburger-btn" (click)="openMenu()">
     <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="100" height="100" viewBox="0,0,256,256">
         <g fill-opacity="0.8" fill="#bd5a5a" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-size="none" style="mix-blend-mode: normal">
             <g transform="scale(3.55556,3.55556)">

src/app/pages/messages/messages-menu/messages-menu.component.ts

@@ -1,4 +1,5 @@
-import { Component } from '@angular/core';
+import {Component, inject} from '@angular/core';
+import {Router} from '@angular/router';
 
 @Component({
   selector: 'app-messages-menu',
@@ -7,5 +8,9 @@ import { Component } from '@angular/core';
   styleUrl: './messages-menu.component.css'
 })
 export class MessagesMenu {
+  private router = inject(Router)
 
+  openMenu() {
+    this.router.navigate(['/menu']);
+  }
 }