update

angular/src/app/app-routing.module.ts

@@ -8,6 +8,7 @@ import {AuthComponent} from './navpages/auth/auth.component';
 import {InfoComponent} from './navpages/info/info.component';
 import {SvgComponent} from './navpages/svg/svg.component';
 import {NotificationComponent} from './navpages/notification/notification.component';
+import {PomodoroComponent} from "./navpages/pomodoro/pomodoro.component";
 
 
 
@@ -19,6 +20,7 @@ const routes: Routes = [
   {path: 'page1', component: Page1Component},
   {path: 'info', component: InfoComponent},
   {path: 'notification', component: NotificationComponent},
+  {path: 'pomodoro', component: PomodoroComponent},
   {path: 'svg', component: SvgComponent},
   {path: 'auth', component: AuthComponent},
 

angular/src/app/app.module.ts

@@ -20,6 +20,7 @@ import { InfoComponent } from './navpages/info/info.component';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { NotificationComponent } from './navpages/notification/notification.component';
 import {HttpClientModule} from '@angular/common/http';
+import { PomodoroComponent } from './navpages/pomodoro/pomodoro.component';
 
 
 @NgModule({
@@ -34,7 +35,8 @@ import {HttpClientModule} from '@angular/common/http';
     DataComponent,
     SvgComponent,
     InfoComponent,
-    NotificationComponent
+    NotificationComponent,
+    PomodoroComponent
   ],
   imports: [
     BrowserModule,

angular/src/app/navbars/navbar/navbar.component.html

@@ -21,6 +21,7 @@
   <button mat-menu-item (click)="navigateMenu('Page0')">Page0</button>
   <button mat-menu-item (click)="navigateMenu('Page1')">Page1</button>
   <button mat-menu-item (click)="navigateMenu('Notification')">Notification</button>
+  <button mat-menu-item (click)="navigateMenu('Pomodoro')">Pomodoro</button>
   <button mat-menu-item (click)="navigateMenu('Info')">Info</button>
   <button mat-menu-item (click)="navigateMenu('SVG')">SVG</button>
   <button mat-menu-item (click)="navigateMenu('Auth')">Auth</button>

angular/src/app/navbars/navbar/navbar.component.ts

@@ -39,6 +39,9 @@ export class NavbarComponent implements OnInit {
     if (tag === 'Notification'){
       this.router.navigate(['/notification']);
     }
+    if (tag === 'Pomodoro'){
+      this.router.navigate(['/pomodoro']);
+    }
   }
 
   onNavigate(): void{

angular/src/app/navpages/pomodoro/pomodoro.component.html

@@ -0,0 +1 @@
+<p>pomodoro works!</p>

angular/src/app/navpages/pomodoro/pomodoro.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PomodoroComponent } from './pomodoro.component';
+
+describe('PomodoroComponent', () => {
+  let component: PomodoroComponent;
+  let fixture: ComponentFixture<PomodoroComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ PomodoroComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PomodoroComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

angular/src/app/navpages/pomodoro/pomodoro.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-pomodoro',
+  templateUrl: './pomodoro.component.html',
+  styleUrls: ['./pomodoro.component.css']
+})
+export class PomodoroComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}