diff --git a/src/app/app.component.html b/src/app/app.component.html
index 3b82535..8239c6b 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,3 +1,6 @@
-<app-login-page />
-
-<router-outlet />
+<div class="min-h-screen bg-gray-100">
+  <app-navbar *ngIf="authService.isAdmin()"></app-navbar>
+  <main>
+    <router-outlet></router-outlet>
+  </main>
+</div>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index db3f8b7..e6e68ec 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,17 +1,21 @@
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
 import { RouterOutlet } from '@angular/router';
 import { initFlowbite } from 'flowbite';
-import { LoginPageComponent } from './components/login-page/login-page.component';
+import { NavbarComponent } from './components/navbar/navbar.component';
+import { AuthService } from './services/auth.service';
 
 @Component({
   selector: 'app-root',
-  imports: [RouterOutlet, LoginPageComponent],
   templateUrl: './app.component.html',
-  styleUrl: './app.component.css'
+  styleUrls: ['./app.component.css'],
+  imports: [CommonModule, RouterOutlet, NavbarComponent]
 })
-export class AppComponent implements OnInit {
+export class AppComponent {
   title = 'memorymap-admin';
 
+  constructor(public authService: AuthService) {}
+
   ngOnInit(): void {
     initFlowbite();
   }