diff --git a/WardrobeManager.Api.Tests/Endpoints/IdentityEndpointsTests.cs b/WardrobeManager.Api.Tests/Endpoints/IdentityEndpointsTests.cs
index e21bf2f..96cb205 100644
--- a/WardrobeManager.Api.Tests/Endpoints/IdentityEndpointsTests.cs
+++ b/WardrobeManager.Api.Tests/Endpoints/IdentityEndpointsTests.cs
@@ -68,9 +68,9 @@ public async Task DoesAdminUserExist_WhenAdminDoesNotExist_ReturnsFalseResult()
     public async Task CreateAdminIfMissing_WhenCreatedSuccessfully_ReturnsCreated()
     {
         // Arrange
-        var credentials = new AdminUserCredentials { email = "admin@test.com", password = "SecurePass1!" };
+        var credentials = new AuthenticationCredentialsModel { Email = "admin@test.com", Password = "SecurePass1!" };
         _mockUserService
-            .Setup(s => s.CreateAdminIfMissing("admin@test.com", "SecurePass1!"))
+            .Setup(s => s.CreateAdminIfMissing(credentials))
             .ReturnsAsync((true, "Admin user created!"));
 
         // Act
@@ -84,9 +84,9 @@ public async Task CreateAdminIfMissing_WhenCreatedSuccessfully_ReturnsCreated()
     public async Task CreateAdminIfMissing_WhenAdminAlreadyExists_ReturnsConflict()
     {
         // Arrange
-        var credentials = new AdminUserCredentials { email = "admin@test.com", password = "SecurePass1!" };
+        var credentials = new AuthenticationCredentialsModel { Email = "admin@test.com", Password = "SecurePass1!" };
         _mockUserService
-            .Setup(s => s.CreateAdminIfMissing("admin@test.com", "SecurePass1!"))
+            .Setup(s => s.CreateAdminIfMissing(credentials))
             .ReturnsAsync((false, "Admin user already exists!"));
 
         // Act
diff --git a/WardrobeManager.Api.Tests/Services/ClothingServiceTests.cs b/WardrobeManager.Api.Tests/Services/ClothingServiceTests.cs
index 9ecfab6..d56d102 100644
--- a/WardrobeManager.Api.Tests/Services/ClothingServiceTests.cs
+++ b/WardrobeManager.Api.Tests/Services/ClothingServiceTests.cs
@@ -11,6 +11,7 @@
 using WardrobeManager.Api.Services.Interfaces;
 using WardrobeManager.Shared.DTOs;
 using WardrobeManager.Shared.Enums;
+using WardrobeManager.Shared.Services;
 using WardrobeManager.Shared.StaticResources;
 
 namespace WardrobeManager.Api.Tests.Services;
diff --git a/WardrobeManager.Api.Tests/Services/UserServiceTests.cs b/WardrobeManager.Api.Tests/Services/UserServiceTests.cs
index 5575967..b63e462 100644
--- a/WardrobeManager.Api.Tests/Services/UserServiceTests.cs
+++ b/WardrobeManager.Api.Tests/Services/UserServiceTests.cs
@@ -6,6 +6,7 @@
 using WardrobeManager.Api.Services.Implementation;
 using WardrobeManager.Api.Tests.Helpers;
 using WardrobeManager.Shared.DTOs;
+using WardrobeManager.Shared.Models;
 
 namespace WardrobeManager.Api.Tests.Services;
 
@@ -196,9 +197,14 @@ public async Task CreateAdminIfMissing_WhenAdminAlreadyExists_ReturnsFalseWithMe
         _mockUserManager.Setup(m => m.Users).Returns(users);
         _mockRoleManager.Setup(m => m.RoleExistsAsync("Admin")).ReturnsAsync(true);
         _mockUserManager.Setup(m => m.IsInRoleAsync(adminUser, "Admin")).ReturnsAsync(true);
+        var credentials = new AuthenticationCredentialsModel
+        {
+            Email = "admin@test.com",
+            Password = "password"
+        };
 
         // Act
-        var result = await _service.CreateAdminIfMissing("admin@test.com", "password");
+        var result = await _service.CreateAdminIfMissing(credentials);
 
         // Assert
         using (new AssertionScope())
@@ -221,9 +227,14 @@ public async Task CreateAdminIfMissing_WhenAdminDoesNotExist_CreatesAdminAndRetu
         _mockUserManager
             .Setup(m => m.AddToRoleAsync(It.IsAny<User>(), "Admin"))
             .ReturnsAsync(IdentityResult.Success);
+        var credentials = new AuthenticationCredentialsModel
+        {
+            Email = "admin@test.com",
+            Password = "SecurePass1!"
+        };
 
         // Act
-        var result = await _service.CreateAdminIfMissing("admin@test.com", "SecurePass1!");
+        var result = await _service.CreateAdminIfMissing(credentials);
 
         // Assert
         using (new AssertionScope())
diff --git a/WardrobeManager.Api/Endpoints/IdentityEndpoints.cs b/WardrobeManager.Api/Endpoints/IdentityEndpoints.cs
index d2f318d..1630a18 100644
--- a/WardrobeManager.Api/Endpoints/IdentityEndpoints.cs
+++ b/WardrobeManager.Api/Endpoints/IdentityEndpoints.cs
@@ -7,6 +7,7 @@
 using WardrobeManager.Api.Services.Implementation;
 using WardrobeManager.Api.Services.Interfaces;
 using WardrobeManager.Shared.Models;
+using WardrobeManager.Shared.StaticResources;
 
 #endregion
 
@@ -68,17 +69,23 @@ public static async Task<IResult> DoesAdminUserExist(IUserService userService)
     }
 
     public static async Task<IResult> CreateAdminIfMissing(IUserService userService,
-        [FromBody] AdminUserCredentials credentials)
+        [FromBody] AuthenticationCredentialsModel credentials)
     {
-        var res = await userService.CreateAdminIfMissing(credentials.email, credentials.password);
+        var res = StaticValidators.Validate(credentials);
+        if (!res.Success)
+        {
+            return Results.BadRequest(res.Message);
+        }
+        
+        var result = await userService.CreateAdminIfMissing(credentials);
 
-        if (res.Item1)
+        if (result.Item1)
         {
             return Results.Created();
         }
         else
         {
-            return Results.Conflict(res.Item2);
+            return Results.Conflict(result.Item2);
         }
     }
 }
\ No newline at end of file
diff --git a/WardrobeManager.Api/Program.cs b/WardrobeManager.Api/Program.cs
index 936fed3..5f2f047 100644
--- a/WardrobeManager.Api/Program.cs
+++ b/WardrobeManager.Api/Program.cs
@@ -13,6 +13,7 @@
 using WardrobeManager.Api.Services.Implementation;
 using WardrobeManager.Api.Services.Interfaces;
 using WardrobeManager.Shared.DTOs;
+using WardrobeManager.Shared.Services;
 using WardrobeManager.Shared.StaticResources;
 
 #endregion
diff --git a/WardrobeManager.Api/Properties/launchSettings.json b/WardrobeManager.Api/Properties/launchSettings.json
index f081300..7dccebf 100644
--- a/WardrobeManager.Api/Properties/launchSettings.json
+++ b/WardrobeManager.Api/Properties/launchSettings.json
@@ -15,7 +15,8 @@
       "launchBrowser": false,
       "launchUrl": "swagger",
       "environmentVariables": {
-        "ASPNETCORE_ENVIRONMENT": "Development"
+        "ASPNETCORE_ENVIRONMENT": "Development",
+        "DOTNET_WATCH_RESTART_ON_RUDE_EDIT": "1"
       },
       "dotnetRunMessages": true,
       "applicationUrl": "https://localhost:7026;http://localhost:5054"
diff --git a/WardrobeManager.Api/Services/Implementation/ClothingService.cs b/WardrobeManager.Api/Services/Implementation/ClothingService.cs
index 153d2df..3ed8347 100644
--- a/WardrobeManager.Api/Services/Implementation/ClothingService.cs
+++ b/WardrobeManager.Api/Services/Implementation/ClothingService.cs
@@ -11,6 +11,7 @@
 using WardrobeManager.Shared.DTOs;
 using WardrobeManager.Shared.Enums;
 using WardrobeManager.Shared.Models;
+using WardrobeManager.Shared.Services;
 using WardrobeManager.Shared.StaticResources;
 
 #endregion
diff --git a/WardrobeManager.Api/Services/Implementation/UserService.cs b/WardrobeManager.Api/Services/Implementation/UserService.cs
index 42ee7ae..8667ffb 100644
--- a/WardrobeManager.Api/Services/Implementation/UserService.cs
+++ b/WardrobeManager.Api/Services/Implementation/UserService.cs
@@ -11,6 +11,7 @@
 using WardrobeManager.Shared.DTOs;
 using WardrobeManager.Shared.Enums;
 using WardrobeManager.Shared.Models;
+using WardrobeManager.Shared.StaticResources;
 
 #endregion
 
@@ -103,7 +104,7 @@ public async Task<bool> DoesAdminUserExist()
         return false;
     }
 
-    public async Task<(bool, string)> CreateAdminIfMissing(string email, string password)
+    public async Task<(bool, string)> CreateAdminIfMissing(AuthenticationCredentialsModel credentials)
     {
         if (await DoesAdminUserExist())
         {
@@ -115,13 +116,13 @@ public async Task<bool> DoesAdminUserExist()
 
         var user = new User
         {
-            Email = email,
-            NormalizedEmail = email.ToUpper(),
-            UserName = email.ToUpper(),
-            NormalizedUserName = email.ToUpper(),
+            Email = credentials.Email,
+            NormalizedEmail =  credentials.Email.ToUpper(ProjectConstants.DefaultCultureInfo),
+            UserName =  credentials.Email.ToUpper(ProjectConstants.DefaultCultureInfo),
+            NormalizedUserName =  credentials.Email.ToUpper(ProjectConstants.DefaultCultureInfo),
         };
 
-        var createResult = await _userManager.CreateAsync(user, password);
+        var createResult = await _userManager.CreateAsync(user, credentials.Password);
 
         if (createResult.Succeeded is false)
         {
diff --git a/WardrobeManager.Api/Services/Interfaces/IUserService.cs b/WardrobeManager.Api/Services/Interfaces/IUserService.cs
index 7aba802..04665b7 100644
--- a/WardrobeManager.Api/Services/Interfaces/IUserService.cs
+++ b/WardrobeManager.Api/Services/Interfaces/IUserService.cs
@@ -12,5 +12,5 @@ public interface IUserService
     Task UpdateUser(string userId, EditedUserDTO editedUser);
     Task DeleteUser(string userId);
     Task<bool> DoesAdminUserExist();
-    Task<(bool, string)> CreateAdminIfMissing(string email, string password);
+    Task<(bool, string)> CreateAdminIfMissing(AuthenticationCredentialsModel credentials);
 }
\ No newline at end of file
diff --git a/WardrobeManager.Presentation.Tests/ApiServiceTests.cs b/WardrobeManager.Presentation.Tests/ApiServiceTests.cs
index 946ebbb..69100dd 100644
--- a/WardrobeManager.Presentation.Tests/ApiServiceTests.cs
+++ b/WardrobeManager.Presentation.Tests/ApiServiceTests.cs
@@ -5,6 +5,7 @@
 using Moq.Protected;
 using WardrobeManager.Presentation.Services.Implementation;
 using WardrobeManager.Presentation.Services.Interfaces;
+using WardrobeManager.Shared.Models;
 
 namespace WardrobeManager.Presentation.Tests;
 
@@ -178,10 +179,10 @@ public async Task AddLog_WhenCalled_PostsToAddLogEndpoint()
     public async Task CreateAdminUserIfMissing_WhenSuccessful_ReturnsTrueWithMessage()
     {
         // Arrange
-        var credentials = new WardrobeManager.Shared.Models.AdminUserCredentials
+        var credentials = new AuthenticationCredentialsModel()
         {
-            email = "admin@test.com",
-            password = "SecurePass1!"
+            Email = "admin@test.com",
+            Password = "SecurePass1!"
         };
         var mockResponse = new HttpResponseMessage
         {
@@ -206,8 +207,8 @@ public async Task CreateAdminUserIfMissing_WhenSuccessful_ReturnsTrueWithMessage
         // Assert
         using (new FluentAssertions.Execution.AssertionScope())
         {
-            result.Item1.Should().BeTrue();
-            result.Item2.Should().Be("Admin user created!");
+            result.Success.Should().BeTrue();
+            result.Message.Should().Be("Admin user created!");
         }
     }
 
@@ -215,10 +216,10 @@ public async Task CreateAdminUserIfMissing_WhenSuccessful_ReturnsTrueWithMessage
     public async Task CreateAdminUserIfMissing_WhenAdminAlreadyExists_ReturnsFalseWithMessage()
     {
         // Arrange
-        var credentials = new WardrobeManager.Shared.Models.AdminUserCredentials
+        var credentials = new AuthenticationCredentialsModel
         {
-            email = "admin@test.com",
-            password = "SecurePass1!"
+            Email = "admin@test.com",
+            Password = "SecurePass1!"
         };
         var mockResponse = new HttpResponseMessage
         {
@@ -243,8 +244,8 @@ public async Task CreateAdminUserIfMissing_WhenAdminAlreadyExists_ReturnsFalseWi
         // Assert
         using (new FluentAssertions.Execution.AssertionScope())
         {
-            result.Item1.Should().BeFalse();
-            result.Item2.Should().Be("Admin user already exists!");
+            result.Success.Should().BeFalse();
+            result.Message.Should().Be("Admin user already exists!");
         }
     }
 
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/AddClothingItemViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/AddClothingItemViewModelTests.cs
index ac8f055..bb6177a 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/AddClothingItemViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/AddClothingItemViewModelTests.cs
@@ -8,6 +8,8 @@
 using WardrobeManager.Shared.StaticResources;
 using Blazing.Mvvm.Components;
 using Microsoft.Extensions.Configuration;
+using WardrobeManager.Presentation.ViewModels.Pages;
+using WardrobeManager.Shared.Services;
 
 namespace WardrobeManager.Presentation.Tests.ViewModels;
 
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/DashboardViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/DashboardViewModelTests.cs
index 5d773d0..b18a7f6 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/DashboardViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/DashboardViewModelTests.cs
@@ -1,5 +1,6 @@
 using FluentAssertions;
 using WardrobeManager.Presentation.ViewModels;
+using WardrobeManager.Presentation.ViewModels.Pages;
 
 namespace WardrobeManager.Presentation.Tests.ViewModels;
 
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/HomeViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/HomeViewModelTests.cs
index 57b4046..35b1f91 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/HomeViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/HomeViewModelTests.cs
@@ -1,5 +1,6 @@
 using FluentAssertions;
 using WardrobeManager.Presentation.ViewModels;
+using WardrobeManager.Presentation.ViewModels.Pages;
 
 namespace WardrobeManager.Presentation.Tests.ViewModels;
 
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/LoginViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/LoginViewModelTests.cs
index 8779bb3..884eea0 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/LoginViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/LoginViewModelTests.cs
@@ -11,6 +11,7 @@
 using WardrobeManager.Shared.Models;
 using Microsoft.AspNetCore.Components.Authorization;
 using System.Security.Claims;
+using WardrobeManager.Presentation.ViewModels.Pages;
 
 namespace WardrobeManager.Presentation.Tests.ViewModels;
 
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/NavBarViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/NavBarViewModelTests.cs
index 957ef5e..3044803 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/NavBarViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/NavBarViewModelTests.cs
@@ -7,6 +7,8 @@
 using WardrobeManager.Presentation.ViewModels;
 using WardrobeManager.Presentation.Tests.Helpers;
 using Microsoft.AspNetCore.Components.Authorization;
+using WardrobeManager.Presentation.ViewModels.Components;
+using WardrobeManager.Presentation.ViewModels.Pages;
 
 namespace WardrobeManager.Presentation.Tests.ViewModels;
 
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/SignupViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/SignupViewModelTests.cs
index 722d1b7..69d2952 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/SignupViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/SignupViewModelTests.cs
@@ -7,6 +7,7 @@
 using WardrobeManager.Presentation.Identity.Models;
 using WardrobeManager.Presentation.Services.Interfaces;
 using WardrobeManager.Presentation.ViewModels;
+using WardrobeManager.Presentation.ViewModels.Pages;
 using WardrobeManager.Shared.Enums;
 using WardrobeManager.Shared.Models;
 
@@ -108,6 +109,7 @@ public async Task SignupAsync_WhenSignupFails_DoesNotAttemptLogin()
     public async Task SignupAsync_WhenSignupSucceedsButLoginFails_AddsErrorNotification()
     {
         // Arrange
+        _viewModel.AuthenticationCredentialsModel = new AuthenticationCredentialsModel { Email = "test@gmail.com", Password = "SecurePassword1!" };
         _mockIdentityService
             .Setup(s => s.SignupAsync(It.IsAny<AuthenticationCredentialsModel>()))
             .ReturnsAsync(true);
diff --git a/WardrobeManager.Presentation.Tests/ViewModels/WardrobeViewModelTests.cs b/WardrobeManager.Presentation.Tests/ViewModels/WardrobeViewModelTests.cs
index fadc699..c0fae7a 100644
--- a/WardrobeManager.Presentation.Tests/ViewModels/WardrobeViewModelTests.cs
+++ b/WardrobeManager.Presentation.Tests/ViewModels/WardrobeViewModelTests.cs
@@ -6,6 +6,7 @@
 using WardrobeManager.Presentation.Tests.Helpers;
 using WardrobeManager.Shared.DTOs;
 using Blazing.Mvvm.Components;
+using WardrobeManager.Presentation.ViewModels.Pages;
 
 namespace WardrobeManager.Presentation.Tests.ViewModels;
 
diff --git a/WardrobeManager.Presentation/Components/Onboarding/OnboardingSection.razor b/WardrobeManager.Presentation/Components/Onboarding/OnboardingSection.razor
index c16e31c..341b0e6 100644
--- a/WardrobeManager.Presentation/Components/Onboarding/OnboardingSection.razor
+++ b/WardrobeManager.Presentation/Components/Onboarding/OnboardingSection.razor
@@ -1,14 +1,42 @@
 @namespace WardrobeManager.Presentation.Components.Onboarding
 
-<div class="grow w-full flex flex-col items-center gap-5 justify-evenly">
-    <h3 class="subheading-text text-primary">@Title</h3> 
-    @ChildContent
-    <button @onclick="ButtonClickCallback" class="btn btn-accent btn-wide subtitle-text">@ButtonText</button>
+<div class="grow w-full flex flex-col items-center gap-3 smj:gap-5 py-4 sm:py-12 px-4 sm:px-0">
+    <div class="grow flex flex-col items-center gap-5 justify-evenly min-h-[15rem] h-full sm:h-[30rem] w-full xl:w-[70rem]">
+        <h3 class="text-xl sm:text-4xl text-primary text-center">@Title</h3>
+        @ChildContent
+    </div>
+    <div class="flex gap-6 w-full justify-center">
+        <Button Type="ButtonType.Secondary" Size="ButtonSize.Large" Text="Back" OnClick="PreviousButtonClickCallback"/>
+        <Button Type="ButtonType.Primary" Size="ButtonSize.Large" Text="Next" OnClick="NextButtonClickCallback"/>
+        @if (SkipTutorialButtonClickCallback.HasDelegate)
+        {
+            <Button Type="ButtonType.Outline" Size="ButtonSize.Large" Text="Skip Tutorial" class="sm:ml-auto"
+                    OnClick="() => ShowSkipTutorialDialog = true"/>
+            <Dialog Show="@ShowSkipTutorialDialog" Width="500px" OnClose="() => ShowSkipTutorialDialog = false">
+                <Header>
+                    <div class="flex-col g4">
+                        <p class="large">Are you sure you want to skip the tutorial?</p>
+                        <p class="muted">The tutorial has important information that helps you start using the app.</p>
+                    </div>
+                </Header>
+                <Content>
+                    <span></span>
+                </Content>
+                <Footer>
+                    <div style="width: 100%; display: flex">
+                        <Button Text="Skip Tutorial" Type="ButtonType.Secondary" OnClick="SkipTutorialButtonClickCallback" />        
+                    </div>
+                </Footer>
+            </Dialog>
+        }
+    </div>
 </div>
 
 @code {
     [Parameter] public required string Title { get; set; }
     [Parameter] public required RenderFragment ChildContent { get; set; }
-    [Parameter] public required string ButtonText { get; set; }
-    [Parameter] public required EventCallback ButtonClickCallback { get; set; }
+    [Parameter] public required EventCallback NextButtonClickCallback { get; set; }
+    [Parameter] public required EventCallback PreviousButtonClickCallback { get; set; }
+    [Parameter] public EventCallback SkipTutorialButtonClickCallback { get; set; }
+    private bool ShowSkipTutorialDialog { get; set; }
 }
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/Components/Shared/Notifications.razor b/WardrobeManager.Presentation/Components/Shared/Notifications.razor
index 0b528f5..5295370 100644
--- a/WardrobeManager.Presentation/Components/Shared/Notifications.razor
+++ b/WardrobeManager.Presentation/Components/Shared/Notifications.razor
@@ -1,62 +1,50 @@
 @namespace WardrobeManager.Presentation.Components.Shared
 
-@inject INotificationService _notificationService
+@inherits MvvmComponentBase<NotificationsViewModel>
 
+<div class="flex flex-col items-end gap-2 absolute top-0 right-0 p-6 z-10 max-h-dvh overflow-y-scroll">
 
-<div class="toast toast-top toast-end">
-    @foreach (var notification in _notificationService.Notifications)
-    {
-        var cssClass = GetNotificationButtonType(notification.Type);
-
-        <Toast Show="@true" >
-            @notification.Message 
-        </Toast>
-    }
-</div>
-
-@code {
-
-    protected override void OnInitialized()
-    {
-        _notificationService.OnChange += StateHasChanged;
-        // this runs the callback method supplied every 5 seconds. it does not wait for the last 
-        // call to the method to finish. this can cause race conditions. it should be fine though
-        var _timer = new Timer(TryToClearNotifications, null, TimeSpan.Zero, TimeSpan.FromSeconds(5));
-    }
-
-    // Go through all notifications and try to remove the non-critical ones
-    private void TryToClearNotifications(object? state)
+    @if (_notificationService.Notifications.Count > 5)
     {
-        var notifications = _notificationService.Notifications;
-
-        foreach (var notification in notifications)
-        {
-            TimeSpan difference = DateTime.UtcNow - notification.CreationDate;
-
-            if (difference.TotalSeconds > 10 && notification.Type != NotificationType.Warning && notification.Type != NotificationType.Error)
-            {
-                _notificationService.RemoveNotification(notification);
-            }
-        }
+        <Button Type="ButtonType.Destructive" Text="Clear All Notifications" OnClick="ViewModel.ClearAllNotifications"/>
     }
 
-    private void Dismiss(NotificationMessage notification)
+    @foreach (var notification in _notificationService.Notifications)
     {
-        _notificationService.RemoveNotification(notification);
+        var cssClass = ViewModel.GetNotificationCss(notification.Type);
+        var message = ViewModel.GetTruncatedMessage(notification);
+
+        <Button Type="ButtonType.Outline" class="!bg-[#111]" Width="100%">
+            <div class="flex flex-row gap-2 rounded-md items-center justify-between w-full">
+                <span class="@cssClass " @onclick="() => notification.DialogOpen = true">@message</span>
+                <Button Icon="Close" Size="ButtonSize.Small" Type="ButtonType.Ghost"
+                        OnClick="() => ViewModel.Dismiss(notification)"/>
+            </div>
+        </Button>
+
+        <Dialog Show="@notification.DialogOpen" Width="500px" OnClose="() => notification.DialogOpen = false">
+            <Header>
+                <div class="flex-col g4">
+                    <p class="large">Notification</p>
+                    <p class="muted">Type: @notification.Type.ToString()</p>
+                    <p class="muted">Created: @notification.CreationDate</p>
+                </div>
+            </Header>
+            <Content>
+                <Text Weight="FontWeights.W700">Message:
+                    <Text Weight="FontWeights.W400" Class="wrap-anywhere">@notification.Message</Text>
+                </Text>
+            </Content>
+            <Footer>
+                <div style="width: 100%; display: flex">
+                    <Button Text="Close" Type="ButtonType.Secondary" OnClick="() => notification.DialogOpen = false"/>
+                </div>
+            </Footer>
+        </Dialog>
     }
+</div>
 
-    public void Dispose()
-    {
-        _notificationService.OnChange -= StateHasChanged;
-    }
+@code {
 
-    public ButtonType GetNotificationButtonType(NotificationType type)
-    {
-        return type switch
-        {
-            NotificationType.Error => ButtonType.Destructive,
-            _ => ButtonType.Outline
-        };
-    }
 
 }
diff --git a/WardrobeManager.Presentation/CustomHttpMessageHandler.cs b/WardrobeManager.Presentation/CustomHttpMessageHandler.cs
index e52288a..fb99aa8 100644
--- a/WardrobeManager.Presentation/CustomHttpMessageHandler.cs
+++ b/WardrobeManager.Presentation/CustomHttpMessageHandler.cs
@@ -1,5 +1,6 @@
 #region
 
+using System.Net;
 using Microsoft.AspNetCore.Components.WebAssembly.Http;
 using WardrobeManager.Presentation.Services.Interfaces;
 using WardrobeManager.Shared.Enums;
@@ -29,9 +30,11 @@ protected override async Task<HttpResponseMessage> SendAsync(HttpRequestMessage
         {
             // This sends the actual HTTP request
             var response = await base.SendAsync(request, cancellationToken);
-
-            // 1. Check for standard HTTP errors (like 404 Not Found, 500 Server Error)
-            if (!response.IsSuccessStatusCode)
+            
+            // The application continually checks the authentication state of the user via GetAuthenticationStateAsync 
+            // The method calls the backend. If the user is not authenticated the backend returns HTTP 401. 
+            // We don't want to notify the user of this as it is benign
+            if (!response.IsSuccessStatusCode && response.StatusCode != HttpStatusCode.Unauthorized)
             {
                 notificationService.AddNotification($"Server Error: {(int)response.StatusCode}", NotificationType.Error);
             }
diff --git a/WardrobeManager.Presentation/Identity/CookieAuthenticationStateProvider.cs b/WardrobeManager.Presentation/Identity/CookieAuthenticationStateProvider.cs
index d8115bd..5a9da25 100644
--- a/WardrobeManager.Presentation/Identity/CookieAuthenticationStateProvider.cs
+++ b/WardrobeManager.Presentation/Identity/CookieAuthenticationStateProvider.cs
@@ -164,7 +164,6 @@ public override async Task<AuthenticationState> GetAuthenticationStateAsync()
         // default to not authenticated
         var user = Unauthenticated;
 
-
         try
         {
             // the user info endpoint is secured, so if the user isn't logged in this will fail
diff --git a/WardrobeManager.Presentation/Layout/MainLayout.razor b/WardrobeManager.Presentation/Layout/MainLayout.razor
index b25beee..8811cf6 100644
--- a/WardrobeManager.Presentation/Layout/MainLayout.razor
+++ b/WardrobeManager.Presentation/Layout/MainLayout.razor
@@ -1,13 +1,8 @@
-@inherits LayoutComponentBase
+@inherits MvvmLayoutComponentBase<WardrobeManager.Presentation.ViewModels.Pages.MainLayoutViewModel>
 
-@inject IJSRuntime JSRuntime
-@inject INotificationService _notificationService
-@inject Initialization sysinfocusComponentsinit
-@inject BrowserExtensions browserExtensions
-
-<body class="dark h-full body-text transition-all duration-300 flex flex-col"
-      @onclick="sysinfocusComponentsinit.HandleMainLayoutClickEvent">
-<ErrorBoundary @ref="errorBoundary">
+<body class="dark min-h-full  body-text transition-all duration-300 flex flex-col relative"
+      @onclick="ViewModel.HandleMainLayoutClickEvent">
+<ErrorBoundary @ref="ViewModel.ErrorBoundary">
     <ChildContent>
         <NavMenu/>
         @Body
@@ -16,42 +11,9 @@
     <ErrorContent Context="ex">
         @{
             // fixlater: In the future, we should maybe not display raw exceptions to the user
-            _notificationService.AddNotification(ex.Message, NotificationType.Error);
-            Console.WriteLine(ex.Message);
+            _notificationService.AddNotification($"Unhandled Exception: {ex.Message}", NotificationType.Error);
         }
     </ErrorContent>
 </ErrorBoundary>
-</body>
 <Notifications/>
-
-@code {
-    private ErrorBoundary? errorBoundary;
-
-
-    // This runs every time any page is (fully) reloaded (in the browser)
-    protected override async Task OnInitializedAsync()
-    {
-        // var res = await _apiService.DoesAdminUserExist();
-        // if (res is false)
-        // {
-        //     _navManager.NavigateTo("/onboarding");
-        // }
-        //
-        // await base.OnInitializedAsync();
-    }
-
-    protected override async Task OnAfterRenderAsync(bool firstRender)
-    {
-        if (firstRender)
-        {
-            await browserExtensions.SetToLocalStorage("theme", "dark");
-            await sysinfocusComponentsinit.InitializeTheme();
-        }
-    }
-
-    protected override void OnParametersSet()
-    {
-        errorBoundary?.Recover();
-    }
-
-}
\ No newline at end of file
+</body>
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/Layout/NavMenu.razor b/WardrobeManager.Presentation/Layout/NavMenu.razor
index 2c7ed9b..3cad421 100644
--- a/WardrobeManager.Presentation/Layout/NavMenu.razor
+++ b/WardrobeManager.Presentation/Layout/NavMenu.razor
@@ -3,7 +3,7 @@
 
 @inject NavigationManager Navigation
 @inject IJSRuntime JsRuntime
-@inherits MvvmComponentBase<NavBarViewModel>
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Components.NavBarViewModel>
 
 <nav
         class="w-full flex flex-row justify-between lg:justify-around py-4 px-4 items-center">
@@ -50,6 +50,11 @@
                 <Authorized>
                         <div class="flex flex-wrap gap-3">
 
+                                <a href="/test">
+                                        <Button Type="ButtonType.Outline"
+                                                Text="Test"
+                                                Icon="Genetics"/>
+                                </a>
                                 <a href="/wardrobe">
                                         <Button Type="ButtonType.Outline"
                                                 Text="My Wardrobe"
diff --git a/WardrobeManager.Presentation/Pages/Authenticated/AddClothingItem.razor b/WardrobeManager.Presentation/Pages/Authenticated/AddClothingItem.razor
index 3a12064..ce3f671 100644
--- a/WardrobeManager.Presentation/Pages/Authenticated/AddClothingItem.razor
+++ b/WardrobeManager.Presentation/Pages/Authenticated/AddClothingItem.razor
@@ -4,7 +4,7 @@
 @using WardrobeManager.Shared.StaticResources
 @namespace WardrobeManager.Presentation.Pages.Authenticated
 @attribute [Authorize]
-@inherits MvvmComponentBase<AddClothingItemViewModel>
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Pages.AddClothingItemViewModel>
 
 <div class="max-w-75 sm:max-w-200 w-full mx-auto flex flex-col gap-5 items-center pb-10">
     <h1 class="subheading-text sm:heading-text text-center">Add a clothing item</h1>
diff --git a/WardrobeManager.Presentation/Pages/Authenticated/Dashboard.razor b/WardrobeManager.Presentation/Pages/Authenticated/Dashboard.razor
index 3f9d963..e687b29 100644
--- a/WardrobeManager.Presentation/Pages/Authenticated/Dashboard.razor
+++ b/WardrobeManager.Presentation/Pages/Authenticated/Dashboard.razor
@@ -1,7 +1,7 @@
 @page "/dashboard"
 
 @attribute [Authorize]
-@inherits MvvmOwningComponentBase<DashboardViewModel>
+@inherits MvvmOwningComponentBase<WardrobeManager.Presentation.ViewModels.Pages.DashboardViewModel>
 
 <PageTitle>Dashboard</PageTitle>
 
diff --git a/WardrobeManager.Presentation/Pages/Authenticated/Wardrobe.razor b/WardrobeManager.Presentation/Pages/Authenticated/Wardrobe.razor
index f8738e1..84fa863 100644
--- a/WardrobeManager.Presentation/Pages/Authenticated/Wardrobe.razor
+++ b/WardrobeManager.Presentation/Pages/Authenticated/Wardrobe.razor
@@ -1,8 +1,8 @@
 @page "/wardrobe"
 @attribute [Authorize]
 @using WardrobeManager.Shared.DTOs
-@using ActionType = WardrobeManager.Presentation.ViewModels.ActionType
-@inherits MvvmComponentBase<WardrobeViewModel>
+@using ActionType = WardrobeManager.Presentation.ViewModels.Pages.ActionType
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Pages.WardrobeViewModel>
 
 <PageTitle>Wardrobe</PageTitle>
 
diff --git a/WardrobeManager.Presentation/Pages/Public/Home.razor b/WardrobeManager.Presentation/Pages/Public/Home.razor
index 355557e..71b1067 100644
--- a/WardrobeManager.Presentation/Pages/Public/Home.razor
+++ b/WardrobeManager.Presentation/Pages/Public/Home.razor
@@ -2,7 +2,7 @@
 @using WardrobeManager.Shared.StaticResources
 
 @namespace WardrobeManager.Presentation.Pages.Public
-@inherits MvvmComponentBase<HomeViewModel>
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Pages.HomeViewModel>
 
 <PageTitle>Welcome - WardrobeManager</PageTitle>
 
diff --git a/WardrobeManager.Presentation/Pages/Public/Login.razor b/WardrobeManager.Presentation/Pages/Public/Login.razor
index d4ce391..dd5ea5e 100644
--- a/WardrobeManager.Presentation/Pages/Public/Login.razor
+++ b/WardrobeManager.Presentation/Pages/Public/Login.razor
@@ -1,5 +1,5 @@
 @page "/login"
-@inherits MvvmComponentBase<LoginViewModel>
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Pages.LoginViewModel>
 
 <PageTitle>Log in</PageTitle>
 
diff --git a/WardrobeManager.Presentation/Pages/Public/Onboarding.razor b/WardrobeManager.Presentation/Pages/Public/Onboarding.razor
index 8e1b9cd..94cb6b8 100644
--- a/WardrobeManager.Presentation/Pages/Public/Onboarding.razor
+++ b/WardrobeManager.Presentation/Pages/Public/Onboarding.razor
@@ -1,10 +1,97 @@
 @page "/onboarding"
-@using WardrobeManager.Presentation.Components.FormItems
+
+@using System.Linq.Expressions
 @using WardrobeManager.Presentation.Components.Onboarding
+@using WardrobeManager.Presentation.Components.FormItems
 @using WardrobeManager.Shared.StaticResources
+@using OnboardingViewModel = WardrobeManager.Presentation.ViewModels.Pages.OnboardingViewModel
 @namespace WardrobeManager.Presentation.Pages.Public
 
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Pages.OnboardingViewModel>
+
 <PageTitle>Onboarding - WardrobeManager</PageTitle>
 
 
-<h1 class="text-4xl">Onboarding!</h1>
+<div class="h-full flex flex-col items-center bg-primary-content gap-10 text-center">
+    <h3 class="subheading-text  sm:heading-text">Welcome to WardrobeManager!</h3>
+
+    <Stepper Style="max-width:90%;margin:auto" Class="sbc-stepper">
+        @for (int i = 0; i < OnboardingViewModel.NumberOfSteps; i++)
+        {
+            var currentStep = i + 1; // Start at 1
+            <StepperStep Class="sbc-stepper-step" State="ViewModel.GetStepperStateSafely(i)"
+                         Label="">@currentStep.ToString()</StepperStep>
+        }
+    </Stepper>
+
+    <div class="grow flex ">
+        @switch (ViewModel.CurrentStepIndex)
+        {
+            // These steps are mandatory and cannot be skipped
+            case 0:
+            {
+                <OnboardingSection
+                    Title="@($"{ProjectConstants.ProjectName} is an all-in-one solution to clothing management.")"
+                    NextButtonClickCallback="ViewModel.GoToNextSection"
+                    PreviousButtonClickCallback="ViewModel.GoToPreviousSection"
+                >
+                    <img src="@ProjectConstants.HomeBackgroundImage" class="h-48 sm:h-96 object-contain rounded-2xl"/>
+                </OnboardingSection>
+                break;
+            }
+            case 1:
+            {
+                <OnboardingSection Title="@($"First, lets make an administrator account before we get started")"
+                                   NextButtonClickCallback="ViewModel.CreateAdminUser"
+                                   PreviousButtonClickCallback="ViewModel.GoToPreviousSection">
+                    <h3 class="text-md sm:large">Please enter the credentials for the administrator account</h3>
+                    <div class="flex flex-col gap-3 w-full max-w-80">
+                        <Label Text="Enter a valid email" Info="This is for the Admin account only"/>
+                        <Input TItem="string"
+                               Value="@ViewModel.NewAdminCredentials.Email"
+                               ValueChanged="@((email) => ViewModel.SetEmail(email ?? ""))"
+                               Placeholder="Enter your email"/>
+                        <Label Text="Enter a valid password" Info="This is for the Admin account only"/>
+                        <Input TItem="string"
+                               Value="@ViewModel.NewAdminCredentials.Password"
+                               Type="password"
+                               ValueChanged="@((password) => ViewModel.SetPassword(password ?? ""))"
+                               Placeholder="Enter your password"/>
+                    </div>
+                </OnboardingSection>
+                break;
+            }
+            // These steps are tutorials and can be skipped
+            case 2:
+            {
+                <OnboardingSection Title="Tutorial: how to add a clothing item and view it in your wardrobe!"
+                                   NextButtonClickCallback="ViewModel.GoToNextSection"
+                                   PreviousButtonClickCallback="ViewModel.GoToPreviousSection"
+                                   SkipTutorialButtonClickCallback="ViewModel.FinishOnboarding"
+                                   >
+                    <div class="flex flex-col items-center gap-3">
+                        <h3 class="body-text sm:subtitle-text">Please watch this video on how to do this</h3>
+                        <img src="@ProjectConstants.HomeBackgroundImage" class="h-48 sm:h-96 object-contain rounded-2xl"/>
+                    </div>
+                </OnboardingSection>
+                break;
+            }
+            case 3:
+            {
+                <OnboardingSection Title="@($"Enjoy using {ProjectConstants.ProjectName}!")"
+                                   NextButtonClickCallback="ViewModel.GoToNextSection"
+                                   PreviousButtonClickCallback="ViewModel.GoToPreviousSection"
+                                   SkipTutorialButtonClickCallback="ViewModel.FinishOnboarding"
+                >
+                    <p class="body-text sm:subtitle-text">
+                        If you encounter any issues, please open an issue on the <a
+                            href="@ProjectConstants.ProjectGitRepo" class="text-blue-500">GitHub repo</a>
+                    </p>
+                </OnboardingSection>
+                break;
+            }
+        }
+
+    </div>
+
+</div>
diff --git a/WardrobeManager.Presentation/Pages/Public/Signup.razor b/WardrobeManager.Presentation/Pages/Public/Signup.razor
index 502e712..93fedbd 100644
--- a/WardrobeManager.Presentation/Pages/Public/Signup.razor
+++ b/WardrobeManager.Presentation/Pages/Public/Signup.razor
@@ -1,5 +1,5 @@
 @page "/signup"
-@inherits MvvmComponentBase<SignupViewModel>
+@inherits MvvmComponentBase<WardrobeManager.Presentation.ViewModels.Pages.SignupViewModel>
 
 <PageTitle>Sign up</PageTitle>
 
diff --git a/WardrobeManager.Presentation/Pages/Test.razor b/WardrobeManager.Presentation/Pages/Test.razor
index 355fc3a..2690931 100644
--- a/WardrobeManager.Presentation/Pages/Test.razor
+++ b/WardrobeManager.Presentation/Pages/Test.razor
@@ -4,93 +4,75 @@
 @page "/test"
 @using WardrobeManager.Shared.DTOs
 
-<Button Text="State Changed" Type="ButtonType.Outline" Class="border" OnClick="ff" />
+<div class="flex-col g1">
+    <h4>Basic Stepper</h4>
+    <Stepper Style="max-width:90%;margin:auto">
+        <StepperStep State="StepperState.Complete" Label="Process has been Initiated">1</StepperStep>
+        <StepperStep State="StepperState.Complete" Label="Data Collection underway">2</StepperStep>
+        <StepperStep State="StepperState.Failed" Label="Processing of collected data">3</StepperStep>
+        <StepperStep State="StepperState.Current" Label="Preparation of Reports">4</StepperStep>
+        <StepperStep State="StepperState.Initiated" Label="Delivery of Reports">5</StepperStep>
+    </Stepper>
 
-<div class="flex">
-    <Button Id="openPopover" Text="Open popover" Type="ButtonType.Outline" Class="border" OnClick="() => show = !show" />
+    <h4 style="margin-top:3rem">Stepper with Icons</h4>
+    <Stepper Style="max-width:600px;margin:auto">
+        <StepperStep State="StepperState.Skipped" Label="Initiated">
+            <Icon Name="start" Size="20px" Color="inherit" />
+        </StepperStep>
+        <StepperStep State="StepperState.Complete" Label="Collection">
+            <Icon Name="bookmark_manager" Size="20px" Color="inherit" />
+        </StepperStep>
+        <StepperStep State="StepperState.Failed" Label="Processing">
+            <Icon Name="cycle" Size="20px" Color="inherit" />
+        </StepperStep>
+        <StepperStep State="StepperState.Current" Label="Reporting">
+            <Icon Name="bar_chart" Size="20px" Color="inherit" />
+        </StepperStep>
+        <StepperStep State="StepperState.Pending" Label="Complete">
+            <Icon Name="check" Size="20px" Color="inherit" />
+        </StepperStep>
+    </Stepper>
+    
+    <Button Type="ButtonType.Primary" Text="Info Notification" OnClick="@(() => _notificationService.AddNotification("Info", NotificationType.Info))" />
+    <Button Type="ButtonType.Primary" Text="Success Notification" OnClick="@(() => _notificationService.AddNotification("Success", NotificationType.Success))" />
+    <Button Type="ButtonType.Primary" Text="Warning Notification" OnClick="@(() => _notificationService.AddNotification("Warning", NotificationType.Warning))" />
+    <Button Type="ButtonType.Primary" Text="Error Notification" OnClick="@(() => _notificationService.AddNotification("Error", NotificationType.Error))" />
 
-    <Popover Show="@show" ParentId="openPopover" OnClose="x => show = x">
-        <Card>
-            <CardHeader>
-                <h4 class="large">Dimensions</h4>
-                <p class="muted">Set the dimensions for the layer.</p>
-            </CardHeader>
-            <CardContent>
-                <style>
-                    .s1 {
-                        width: 125px;
-                        font-size: 14px
-                    }
-                </style>
-                <div class="flex-col g8">
-                    <div class="flex">
-                        <span class="s1">Width</span>
-                        <Input TItem="string" Focus />
-                    </div>
-                    <div class="flex">
-                        <span class="s1">Max. width</span>
-                        <Input TItem="string" />
-                    </div>
-                    <div class="flex">
-                        <span class="s1">Height</span>
-                        <Input TItem="string" />
-                    </div>
-                    <div class="flex">
-                        <span class="s1">Max. height</span>
-                        <Input TItem="string" />
-                    </div>
-                </div>
-            </CardContent>
-            <CardFooter>
-            </CardFooter>
-        </Card>
-    </Popover>
-</div>
-<div style="margin-top: 30vh">
-    <Button Id="openPopoverBottom" Text="Open popover" Type="ButtonType.Outline" Class="border" OnClick="() => showBottom = !showBottom" Style="margin-left: 60vw" />
-    <Popover Show="@showBottom" ParentId="openPopoverBottom" OnClose="x => showBottom = x">
-        <Card>
-            <CardHeader>
-                <h4 class="large">Dimensions</h4>
-                <p class="muted">Set the dimensions for the layer.</p>
-            </CardHeader>
-            <CardContent>
-                <style>
-                    .s1 {
-                        width: 125px;
-                        font-size: 14px
-                    }
-                </style>
-                <div class="flex-col g8">
-                    <div class="flex">
-                        <span class="s1">Width</span>
-                        <Input TItem="string" Focus />
-                    </div>
-                    <div class="flex">
-                        <span class="s1">Max. width</span>
-                        <Input TItem="string" />
-                    </div>
-                    <div class="flex">
-                        <span class="s1">Height</span>
-                        <Input TItem="string" />
-                    </div>
-                    <div class="flex">
-                        <span class="s1">Max. height</span>
-                        <Input TItem="string" />
-                    </div>
-                </div>
-            </CardContent>
-            <CardFooter>
-            </CardFooter>
-        </Card>
-    </Popover>
+
+    <h4 style="margin-top:3rem">Shopping Example</h4>
+    <Stepper Style="max-width:600px;margin:auto">
+        @foreach (var step in shoppings)
+        {
+            <StepperStep State="@step.Status" Label="@step.Label" OnClick="() => UpdateStatus(step)">
+                <Icon Name="@step.Icon" Size="20px" Color="inherit" />
+            </StepperStep>
+        }
+    </Stepper>
 </div>
 
-@code {
-    bool show, showBottom;
+@code
+{
+    private Shopping[] shoppings = [
+        new(1, "shopping_cart", "Add to Cart") { Status = StepperState.Initiated },
+        new(2, "add_home", "Delivery Address"),
+        new(3, "credit_card", "Payment Method"),
+        new(4, "preview", "Preview Order"),
+        new(5, "check", "Complete Order"),
+    ];
 
-    public void ff()
+    private void UpdateStatus(Shopping shopping)
     {
-        StateHasChanged();
+        // Reset all steps to Pending initially
+        foreach (var status in shoppings)
+            status.Status = StepperState.Pending;
+
+        // Mark steps as Complete upto the step number
+        for(int i = 0; i < shopping.No; i++)
+            shoppings[i].Status = StepperState.Complete;        
     }
+
+    private record Shopping(int No, string Icon, string Label)
+    {
+        public StepperState Status { get; set; } = StepperState.Pending;
+    };
 }
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/Program.cs b/WardrobeManager.Presentation/Program.cs
index 4754a19..eb95232 100644
--- a/WardrobeManager.Presentation/Program.cs
+++ b/WardrobeManager.Presentation/Program.cs
@@ -9,6 +9,7 @@
 using WardrobeManager.Presentation.Identity;
 using WardrobeManager.Presentation.Services.Implementation;
 using WardrobeManager.Presentation.Services.Interfaces;
+using WardrobeManager.Shared.Services;
 using WardrobeManager.Shared.StaticResources;
 
 #endregion
diff --git a/WardrobeManager.Presentation/Properties/launchSettings.json b/WardrobeManager.Presentation/Properties/launchSettings.json
index 64af980..68ff6e7 100644
--- a/WardrobeManager.Presentation/Properties/launchSettings.json
+++ b/WardrobeManager.Presentation/Properties/launchSettings.json
@@ -26,7 +26,8 @@
       "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
       "applicationUrl": "https://localhost:7147;http://localhost:5281",
       "environmentVariables": {
-        "ASPNETCORE_ENVIRONMENT": "Development"
+        "ASPNETCORE_ENVIRONMENT": "Development",
+        "DOTNET_WATCH_RESTART_ON_RUDE_EDIT": "1"
       }
     },
     "IIS Express": {
diff --git a/WardrobeManager.Presentation/Services/Implementation/ApiService.cs b/WardrobeManager.Presentation/Services/Implementation/ApiService.cs
index 2a90f5d..e135fbd 100644
--- a/WardrobeManager.Presentation/Services/Implementation/ApiService.cs
+++ b/WardrobeManager.Presentation/Services/Implementation/ApiService.cs
@@ -75,7 +75,7 @@ public async Task<bool> DoesAdminUserExist()
         return await res.Content.ReadFromJsonAsync<bool>();
     }
 
-    public async Task<(bool, string)> CreateAdminUserIfMissing(AdminUserCredentials credentials)
+    public async Task<Result<string>> CreateAdminUserIfMissing(AuthenticationCredentialsModel credentials)
     {
         var res = await _httpClient.PostAsJsonAsync("/create-admin-user-if-missing", credentials);
 
@@ -88,8 +88,8 @@ public async Task<bool> DoesAdminUserExist()
         {
             content = "Admin user created!";
         }
-
-        return (res.IsSuccessStatusCode, content);
+        
+        return new Result<string>(content, res.IsSuccessStatusCode, content);
     }
 
     #endregion
diff --git a/WardrobeManager.Presentation/Services/Interfaces/IApiService.cs b/WardrobeManager.Presentation/Services/Interfaces/IApiService.cs
index 2573611..78b14a0 100644
--- a/WardrobeManager.Presentation/Services/Interfaces/IApiService.cs
+++ b/WardrobeManager.Presentation/Services/Interfaces/IApiService.cs
@@ -26,6 +26,6 @@ public interface IApiService
     /// Creates an admin user if one doesn't exist (used for onboarding) 
     /// </summary>
     /// <param name="credentials">Onboarding user credentials</param>
-    /// <returns>bool: succeeded, string: text description</returns>
-    Task<(bool, string)> CreateAdminUserIfMissing(AdminUserCredentials credentials);
+    /// <returns>Result: string: text description</returns>
+    Task<Result<string>> CreateAdminUserIfMissing(AuthenticationCredentialsModel credentials);
 }
diff --git a/WardrobeManager.Presentation/ViewModels/NavMenuViewModel.cs b/WardrobeManager.Presentation/ViewModels/Components/NavMenuViewModel.cs
similarity index 90%
rename from WardrobeManager.Presentation/ViewModels/NavMenuViewModel.cs
rename to WardrobeManager.Presentation/ViewModels/Components/NavMenuViewModel.cs
index abcc186..1a8efc3 100644
--- a/WardrobeManager.Presentation/ViewModels/NavMenuViewModel.cs
+++ b/WardrobeManager.Presentation/ViewModels/Components/NavMenuViewModel.cs
@@ -1,10 +1,10 @@
 using Blazing.Mvvm.ComponentModel;
 using Blazing.Mvvm.Components;
 using CommunityToolkit.Mvvm.ComponentModel;
-using Microsoft.AspNetCore.Components;
 using WardrobeManager.Presentation.Services.Interfaces;
+using WardrobeManager.Presentation.ViewModels.Pages;
 
-namespace WardrobeManager.Presentation.ViewModels;
+namespace WardrobeManager.Presentation.ViewModels.Components;
 
 [ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
 public partial class NavBarViewModel(
diff --git a/WardrobeManager.Presentation/ViewModels/Components/NotificationsViewModel.cs b/WardrobeManager.Presentation/ViewModels/Components/NotificationsViewModel.cs
new file mode 100644
index 0000000..933a390
--- /dev/null
+++ b/WardrobeManager.Presentation/ViewModels/Components/NotificationsViewModel.cs
@@ -0,0 +1,91 @@
+using Blazing.Mvvm.ComponentModel;
+using Blazing.Mvvm.Components;
+using Sysinfocus.AspNetCore.Components;
+using WardrobeManager.Presentation.Services.Interfaces;
+using WardrobeManager.Shared.Enums;
+using WardrobeManager.Shared.Models;
+
+namespace WardrobeManager.Presentation.ViewModels.Components;
+
+[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
+public partial class NotificationsViewModel(
+    INotificationService notificationService
+)
+    : ViewModelBase
+{
+    private Timer? _timer; 
+    
+    public override async Task OnInitializedAsync()
+    {
+        notificationService.OnChange += NotifyStateChanged;
+        // this runs the callback method supplied every 5 seconds. it does not wait for the last 
+        // call to the method to finish. this can cause race conditions. it should be fine though
+        _timer = new Timer(TryToClearNotifications, null, TimeSpan.Zero, TimeSpan.FromSeconds(5));
+    }
+
+    // Go through all notifications and try to remove the non-critical ones
+    public void TryToClearNotifications(object? state)
+    {
+        var notifications = notificationService.Notifications;
+
+        foreach (var notification in notifications)
+        {
+            TimeSpan difference = DateTime.UtcNow - notification.CreationDate;
+
+            if (difference.TotalSeconds > 10 && notification.Type != NotificationType.Warning && notification.Type != NotificationType.Error)
+            {
+                notificationService.RemoveNotification(notification);
+            }
+        }
+    }
+
+    public void ClearAllNotifications()
+    {
+        foreach (var notification in notificationService.Notifications)
+        {
+            notificationService.RemoveNotification(notification);
+        }
+    }
+
+    public void Dismiss(NotificationMessage notification)
+    {
+        notificationService.RemoveNotification(notification);
+    }
+
+    public new void Dispose()
+    {
+        notificationService.OnChange -= NotifyStateChanged;
+        _timer?.Dispose();
+    }
+
+    public ButtonType GetNotificationButtonType(NotificationType type)
+    {
+        return type switch
+        {
+            NotificationType.Error => ButtonType.Destructive,
+            _ => ButtonType.Outline
+        };
+    }
+
+    public string GetNotificationCss(NotificationType type)
+    {
+        return type switch
+        {
+            NotificationType.Success => "text-[#28a745]",
+            NotificationType.Warning => "text-[#ffc107]",
+            NotificationType.Error => "text-[#dc3545]",
+            _ => "text-[#007bff]", // default is 'info' colour
+        };
+    }
+
+    public string GetTruncatedMessage(NotificationMessage notification)
+    {
+        if (notification.Message.Length >= 40)
+        {
+            return notification.Message[..37] + "...";
+        }
+
+        return notification.Message;
+    }
+    
+}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/DashboardViewModel.cs b/WardrobeManager.Presentation/ViewModels/DashboardViewModel.cs
deleted file mode 100644
index 7b7c158..0000000
--- a/WardrobeManager.Presentation/ViewModels/DashboardViewModel.cs
+++ /dev/null
@@ -1,20 +0,0 @@
-using Blazing.Mvvm.ComponentModel;
-using Blazing.Mvvm.Components;
-using CommunityToolkit.Mvvm.ComponentModel;
-using Microsoft.AspNetCore.Components;
-using Microsoft.AspNetCore.Components.Forms;
-using Microsoft.AspNetCore.Components.Web;
-using WardrobeManager.Presentation.Identity;
-using WardrobeManager.Presentation.Pages.Public;
-using WardrobeManager.Presentation.Services.Interfaces;
-using WardrobeManager.Shared.Enums;
-using WardrobeManager.Shared.Models;
-
-namespace WardrobeManager.Presentation.ViewModels;
-
-[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
-public partial class DashboardViewModel(
-    )
-    : ViewModelBase
-{
-}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/HomeViewModel.cs b/WardrobeManager.Presentation/ViewModels/HomeViewModel.cs
deleted file mode 100644
index 3a063b0..0000000
--- a/WardrobeManager.Presentation/ViewModels/HomeViewModel.cs
+++ /dev/null
@@ -1,20 +0,0 @@
-using Blazing.Mvvm.ComponentModel;
-using Blazing.Mvvm.Components;
-using CommunityToolkit.Mvvm.ComponentModel;
-using Microsoft.AspNetCore.Components;
-using Microsoft.AspNetCore.Components.Forms;
-using Microsoft.AspNetCore.Components.Web;
-using WardrobeManager.Presentation.Identity;
-using WardrobeManager.Presentation.Pages.Public;
-using WardrobeManager.Presentation.Services.Interfaces;
-using WardrobeManager.Shared.Enums;
-using WardrobeManager.Shared.Models;
-
-namespace WardrobeManager.Presentation.ViewModels;
-
-[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
-public partial class HomeViewModel(
-    )
-    : ViewModelBase
-{
-}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/AddClothingItemViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/AddClothingItemViewModel.cs
similarity index 93%
rename from WardrobeManager.Presentation/ViewModels/AddClothingItemViewModel.cs
rename to WardrobeManager.Presentation/ViewModels/Pages/AddClothingItemViewModel.cs
index 2c5557e..2f15969 100644
--- a/WardrobeManager.Presentation/ViewModels/AddClothingItemViewModel.cs
+++ b/WardrobeManager.Presentation/ViewModels/Pages/AddClothingItemViewModel.cs
@@ -1,14 +1,13 @@
 using Blazing.Mvvm.ComponentModel;
-using Blazing.Mvvm.Components;
 using CommunityToolkit.Mvvm.ComponentModel;
-using CommunityToolkit.Mvvm.ComponentModel.__Internals;
 using Microsoft.AspNetCore.Components.Forms;
 using WardrobeManager.Presentation.Services.Interfaces;
 using WardrobeManager.Shared.DTOs;
 using WardrobeManager.Shared.Enums;
+using WardrobeManager.Shared.Services;
 using WardrobeManager.Shared.StaticResources;
 
-namespace WardrobeManager.Presentation.ViewModels;
+namespace WardrobeManager.Presentation.ViewModels.Pages;
 
 [ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
 public partial class AddClothingItemViewModel(
@@ -33,7 +32,7 @@ public string GetNameWithSpacesAndEmoji<T>(T value) where T : Enum
     public async Task SubmitAsync()
     {
         // Crude error checking, in the future i'd prefer to use a form with error validation
-        var res = StaticValidators.Validate(NewClothingItem);
+        var res = StaticValidators.Validate<NewClothingItemDTO>(NewClothingItem);
         if (!res.Success)
         {
             notificationService.AddNotification(res.Message, NotificationType.Error);
diff --git a/WardrobeManager.Presentation/ViewModels/Pages/DashboardViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/DashboardViewModel.cs
new file mode 100644
index 0000000..d3892dc
--- /dev/null
+++ b/WardrobeManager.Presentation/ViewModels/Pages/DashboardViewModel.cs
@@ -0,0 +1,10 @@
+using Blazing.Mvvm.ComponentModel;
+
+namespace WardrobeManager.Presentation.ViewModels.Pages;
+
+[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
+public partial class DashboardViewModel(
+    )
+    : ViewModelBase
+{
+}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/Pages/HomeViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/HomeViewModel.cs
new file mode 100644
index 0000000..95d1606
--- /dev/null
+++ b/WardrobeManager.Presentation/ViewModels/Pages/HomeViewModel.cs
@@ -0,0 +1,10 @@
+using Blazing.Mvvm.ComponentModel;
+
+namespace WardrobeManager.Presentation.ViewModels.Pages;
+
+[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
+public partial class HomeViewModel(
+    )
+    : ViewModelBase
+{
+}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/LoginViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/LoginViewModel.cs
similarity index 89%
rename from WardrobeManager.Presentation/ViewModels/LoginViewModel.cs
rename to WardrobeManager.Presentation/ViewModels/Pages/LoginViewModel.cs
index 3e37795..36b352b 100644
--- a/WardrobeManager.Presentation/ViewModels/LoginViewModel.cs
+++ b/WardrobeManager.Presentation/ViewModels/Pages/LoginViewModel.cs
@@ -1,14 +1,11 @@
 using Blazing.Mvvm.ComponentModel;
 using Blazing.Mvvm.Components;
 using CommunityToolkit.Mvvm.ComponentModel;
-using Microsoft.AspNetCore.Components.Forms;
 using Microsoft.AspNetCore.Components.Web;
-using WardrobeManager.Presentation.Identity;
 using WardrobeManager.Presentation.Services.Interfaces;
-using WardrobeManager.Shared.Enums;
 using WardrobeManager.Shared.Models;
 
-namespace WardrobeManager.Presentation.ViewModels;
+namespace WardrobeManager.Presentation.ViewModels.Pages;
 
 [ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
 public partial class LoginViewModel(
diff --git a/WardrobeManager.Presentation/ViewModels/Pages/MainLayoutViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/MainLayoutViewModel.cs
new file mode 100644
index 0000000..6c72fd5
--- /dev/null
+++ b/WardrobeManager.Presentation/ViewModels/Pages/MainLayoutViewModel.cs
@@ -0,0 +1,51 @@
+using Blazing.Mvvm.ComponentModel;
+using Blazing.Mvvm.Components;
+using CommunityToolkit.Mvvm.ComponentModel;
+using Microsoft.AspNetCore.Components.Web;
+using Sysinfocus.AspNetCore.Components;
+using WardrobeManager.Presentation.Services.Interfaces;
+
+namespace WardrobeManager.Presentation.ViewModels.Pages;
+
+[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
+public partial class MainLayoutViewModel(
+    IMvvmNavigationManager navManager,
+    IApiService apiService,
+    Initialization sysinfocusComponentsinit,
+    BrowserExtensions browserExtensions
+)
+    : ViewModelBase
+{
+    [ObservableProperty] public ErrorBoundary? _errorBoundary;
+
+    public void HandleMainLayoutClickEvent()
+    {
+        sysinfocusComponentsinit.HandleMainLayoutClickEvent();
+    }
+
+    // This runs every time any page is (fully) reloaded (in the browser)
+    public override async Task OnInitializedAsync()
+    {
+        var res = await apiService.DoesAdminUserExist();
+        if (res is false)
+        {
+            navManager.NavigateTo<OnboardingViewModel>();
+        }
+
+        await base.OnInitializedAsync();
+    }
+
+    public override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            await browserExtensions.SetToLocalStorage("theme", "dark");
+            await sysinfocusComponentsinit.InitializeTheme();
+        }
+    }
+
+    public override void OnParametersSet()
+    {
+        ErrorBoundary?.Recover();
+    }
+}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/Pages/OnboardingViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/OnboardingViewModel.cs
new file mode 100644
index 0000000..ae058f6
--- /dev/null
+++ b/WardrobeManager.Presentation/ViewModels/Pages/OnboardingViewModel.cs
@@ -0,0 +1,128 @@
+using Blazing.Mvvm.ComponentModel;
+using Blazing.Mvvm.Components;
+using CommunityToolkit.Mvvm.ComponentModel;
+using Sysinfocus.AspNetCore.Components;
+using WardrobeManager.Presentation.Services.Interfaces;
+using WardrobeManager.Shared.Enums;
+using WardrobeManager.Shared.Models;
+using WardrobeManager.Shared.StaticResources;
+
+namespace WardrobeManager.Presentation.ViewModels.Pages;
+
+[ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
+public partial class OnboardingViewModel(
+    INotificationService notificationService,
+    IApiService apiService,
+    IMvvmNavigationManager navManager
+)
+    : ViewModelBase
+{
+    [ObservableProperty] private int _currentStepIndex = 0;
+    [ObservableProperty] private Dictionary<int, StepperState> _stepperStates = new();
+    [ObservableProperty] private AuthenticationCredentialsModel _newAdminCredentials = new();
+
+    public const int NumberOfSteps = 4;
+
+    public override async Task OnInitializedAsync()
+    {
+        // var exists = await apiService.DoesAdminUserExist();
+        // if (exists)
+        // {
+        //     navManager.NavigateTo<LoginViewModel>();
+        // }
+
+        // Initialize all stepper states as not completed
+        CurrentStepIndex = 0; // handles edgecase where you go to login page but navigate back and CurrentStepIndex is still whatever it was
+        for (int i = 0; i < NumberOfSteps; i++)
+        {
+            StepperStates[i] = i == 0 ? StepperState.Current : StepperState.Pending;
+        }
+    }
+
+    public void GoToNextSection()
+    {
+        if (CurrentStepIndex == NumberOfSteps - 1)
+        {
+            navManager.NavigateTo<LoginViewModel>();
+            return;
+        }
+
+        if (StepperStates.TryGetValue(CurrentStepIndex, out var stepperState))
+        {
+            StepperStates[CurrentStepIndex] = StepperState.Complete;
+        }
+
+        CurrentStepIndex++;
+
+        if (StepperStates.TryGetValue(CurrentStepIndex, out var nextStepperState))
+        {
+            StepperStates[CurrentStepIndex] = StepperState.Current;
+        }
+    }
+
+    public void GoToPreviousSection()
+    {
+        if (CurrentStepIndex == 0)
+        {
+            return;
+        }
+
+        if (StepperStates.TryGetValue(CurrentStepIndex, out var stepperState))
+        {
+            StepperStates[CurrentStepIndex] = StepperState.Pending;
+        }
+
+        CurrentStepIndex--;
+
+        if (StepperStates.TryGetValue(CurrentStepIndex, out var oldStepperState))
+        {
+            StepperStates[CurrentStepIndex] = StepperState.Current;
+        }
+    }
+
+    public void FinishOnboarding()
+    {
+        navManager.NavigateTo<LoginViewModel>();
+    }
+
+    public async Task CreateAdminUser()
+    {
+        var valid = StaticValidators.Validate<AuthenticationCredentialsModel>(NewAdminCredentials);
+        if (!valid.Success)
+        {
+            foreach (var error in valid.Message.Split(".", StringSplitOptions.RemoveEmptyEntries))
+            {
+                if (string.IsNullOrEmpty(error)) continue; // catches any blanks (i.e. last element)
+                notificationService.AddNotification(error, NotificationType.Error);
+            }
+
+            return;
+        }
+
+        var res = await apiService.CreateAdminUserIfMissing(NewAdminCredentials);
+        if (!res.Success)
+        {
+            notificationService.AddNotification(res.Message, NotificationType.Error);
+            return;
+        }
+
+        // If added the admin user was sucessful
+        GoToNextSection();
+    }
+
+    public StepperState GetStepperStateSafely(int key)
+    {
+        return CollectionExtensions.GetValueOrDefault(StepperStates, key, StepperState.Failed);
+    }
+
+    // Stupid that i'm doing this but its the easiest solution and idk what the best method is
+    public void SetEmail(string email)
+    {
+        NewAdminCredentials.Email = email;
+    }
+
+    public void SetPassword(string password)
+    {
+        NewAdminCredentials.Password = password;
+    }
+}
\ No newline at end of file
diff --git a/WardrobeManager.Presentation/ViewModels/SignupViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/SignupViewModel.cs
similarity index 82%
rename from WardrobeManager.Presentation/ViewModels/SignupViewModel.cs
rename to WardrobeManager.Presentation/ViewModels/Pages/SignupViewModel.cs
index 3dce53f..97e127f 100644
--- a/WardrobeManager.Presentation/ViewModels/SignupViewModel.cs
+++ b/WardrobeManager.Presentation/ViewModels/Pages/SignupViewModel.cs
@@ -3,12 +3,12 @@
 using CommunityToolkit.Mvvm.ComponentModel;
 using Microsoft.AspNetCore.Components.Forms;
 using Microsoft.AspNetCore.Components.Web;
-using WardrobeManager.Presentation.Identity;
 using WardrobeManager.Presentation.Services.Interfaces;
 using WardrobeManager.Shared.Enums;
 using WardrobeManager.Shared.Models;
+using WardrobeManager.Shared.StaticResources;
 
-namespace WardrobeManager.Presentation.ViewModels;
+namespace WardrobeManager.Presentation.ViewModels.Pages;
 
 [ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
 public partial class SignupViewModel(
@@ -46,6 +46,12 @@ public async Task DetectEnterPressed(KeyboardEventArgs e)
 
     public async Task SignupAsync()
     {
+        var res = StaticValidators.Validate<AuthenticationCredentialsModel>(AuthenticationCredentialsModel);
+        if (!res.Success)
+        {
+            notificationService.AddNotification(res.Message, NotificationType.Error);
+        }
+        
         var signupSuccess = await identityService.SignupAsync(AuthenticationCredentialsModel);
         if (!signupSuccess) return;
         
@@ -54,6 +60,7 @@ public async Task SignupAsync()
         if (!loginSuccess)
         {
             notificationService.AddNotification("Account created, but could not log you in. Please try again.", NotificationType.Error);
+            navManager.NavigateTo<LoginViewModel>();
         }
         
         notificationService.AddNotification("Account created and logged in successfully!", NotificationType.Success);
diff --git a/WardrobeManager.Presentation/ViewModels/WardrobeViewModel.cs b/WardrobeManager.Presentation/ViewModels/Pages/WardrobeViewModel.cs
similarity index 92%
rename from WardrobeManager.Presentation/ViewModels/WardrobeViewModel.cs
rename to WardrobeManager.Presentation/ViewModels/Pages/WardrobeViewModel.cs
index a5a0855..7087e41 100644
--- a/WardrobeManager.Presentation/ViewModels/WardrobeViewModel.cs
+++ b/WardrobeManager.Presentation/ViewModels/Pages/WardrobeViewModel.cs
@@ -1,15 +1,10 @@
 using Blazing.Mvvm.ComponentModel;
-using Blazing.Mvvm.Components;
 using CommunityToolkit.Mvvm.ComponentModel;
-using Microsoft.AspNetCore.Components.Forms;
-using Microsoft.AspNetCore.Components.Web;
-using WardrobeManager.Presentation.Identity;
 using WardrobeManager.Presentation.Services.Interfaces;
 using WardrobeManager.Shared.DTOs;
 using WardrobeManager.Shared.Enums;
-using WardrobeManager.Shared.Models;
 
-namespace WardrobeManager.Presentation.ViewModels;
+namespace WardrobeManager.Presentation.ViewModels.Pages;
 
 [ViewModelDefinition(Lifetime = ServiceLifetime.Scoped)]
 public partial class WardrobeViewModel(
diff --git a/WardrobeManager.Presentation/_Imports.razor b/WardrobeManager.Presentation/_Imports.razor
index 227c7cf..ee20fd9 100644
--- a/WardrobeManager.Presentation/_Imports.razor
+++ b/WardrobeManager.Presentation/_Imports.razor
@@ -23,7 +23,8 @@
 @using WardrobeManager.Presentation.Components.Shared
 @using WardrobeManager.Presentation.Identity
 @using WardrobeManager.Presentation.Services.Interfaces
-@using WardrobeManager.Presentation.ViewModels
+@using WardrobeManager.Presentation.ViewModels.Components
+@using WardrobeManager.Presentation.ViewModels.Pages
 
 @* My Services *@
 @inject IApiService _apiService
diff --git a/WardrobeManager.Presentation/wwwroot/css/custom.css b/WardrobeManager.Presentation/wwwroot/css/custom.css
deleted file mode 100644
index e69de29..0000000
diff --git a/WardrobeManager.Presentation/wwwroot/css/sysinfocus-styles.css b/WardrobeManager.Presentation/wwwroot/css/sysinfocus-styles.css
index 512d953..35c4a36 100644
--- a/WardrobeManager.Presentation/wwwroot/css/sysinfocus-styles.css
+++ b/WardrobeManager.Presentation/wwwroot/css/sysinfocus-styles.css
@@ -1,8 +1,23 @@
 /* Replacing Sysinfocus css styles.css file because it is override default tailwind styles */
 /* this is hacky since if the library styles change in the future something might break but what can you do? */
+
 @import url(https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,300,0,0);
 @import url('https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap');
 
+/* Custom modifications */
+/* 
+   So basically this line that connects Stepper steps is not being displayed
+   because the z-index is being weird so i'm manually overriding it here
+*/
+.sbc-stepper-step {
+    z-index: 2 !important;
+}
+/* ::before is where the line is */
+.sbc-stepper::before {
+    z-index: 1 !important;
+}
+
+
 :root {
     --grid-height: 200px;
     --color-scheme: dark;
diff --git a/WardrobeManager.Shared.Tests/StaticResources/MiscMethodsTests.cs b/WardrobeManager.Shared.Tests/StaticResources/MiscMethodsTests.cs
index 4d128d0..0d9e033 100644
--- a/WardrobeManager.Shared.Tests/StaticResources/MiscMethodsTests.cs
+++ b/WardrobeManager.Shared.Tests/StaticResources/MiscMethodsTests.cs
@@ -1,6 +1,7 @@
 using FluentAssertions;
 using FluentAssertions.Execution;
 using WardrobeManager.Shared.Enums;
+using WardrobeManager.Shared.Services;
 using WardrobeManager.Shared.StaticResources;
 
 namespace WardrobeManager.Shared.Tests.StaticResources;
diff --git a/WardrobeManager.Shared/Models/AdminUserCredentials.cs b/WardrobeManager.Shared/Models/AdminUserCredentials.cs
deleted file mode 100644
index 3d75f75..0000000
--- a/WardrobeManager.Shared/Models/AdminUserCredentials.cs
+++ /dev/null
@@ -1,9 +0,0 @@
-namespace WardrobeManager.Shared.Models;
-
-
-// Only used during onboarding when making a new admin user
-public class AdminUserCredentials
-{   
-    public string email { get; set; }
-    public string password { get; set; }
-}
\ No newline at end of file
diff --git a/WardrobeManager.Shared/Models/AuthenticationCredentialsModel.cs b/WardrobeManager.Shared/Models/AuthenticationCredentialsModel.cs
index c8ed1ae..05a267c 100644
--- a/WardrobeManager.Shared/Models/AuthenticationCredentialsModel.cs
+++ b/WardrobeManager.Shared/Models/AuthenticationCredentialsModel.cs
@@ -1,7 +1,7 @@
 namespace WardrobeManager.Shared.Models;
 
-public class AuthenticationCredentialsModel
+public record AuthenticationCredentialsModel
 {
-    public string Email = string.Empty;
-    public string Password = string.Empty;
+    public string Email { get; set; }= string.Empty;
+    public string Password { get; set; } = string.Empty;
 }
\ No newline at end of file
diff --git a/WardrobeManager.Shared/Models/NotificationMessage.cs b/WardrobeManager.Shared/Models/NotificationMessage.cs
index 474e58c..2cb894e 100644
--- a/WardrobeManager.Shared/Models/NotificationMessage.cs
+++ b/WardrobeManager.Shared/Models/NotificationMessage.cs
@@ -9,5 +9,6 @@ namespace WardrobeManager.Shared.Models;
 public class NotificationMessage(string message, NotificationType type) {
     public readonly string Message = message;
     public readonly NotificationType Type = type;
-    public DateTime CreationDate = DateTime.UtcNow;
+    public bool DialogOpen = false;
+    public readonly DateTime CreationDate = DateTime.UtcNow;
 }
\ No newline at end of file
diff --git a/WardrobeManager.Shared/Services/IMiscMethods.cs b/WardrobeManager.Shared/Services/IMiscMethods.cs
index 414855e..cef60b0 100644
--- a/WardrobeManager.Shared/Services/IMiscMethods.cs
+++ b/WardrobeManager.Shared/Services/IMiscMethods.cs
@@ -1,6 +1,6 @@
 using WardrobeManager.Shared.Enums;
 
-namespace WardrobeManager.Shared.StaticResources;
+namespace WardrobeManager.Shared.Services;
 
 public interface IMiscMethods
 {
diff --git a/WardrobeManager.Shared/Services/MiscMethods.cs b/WardrobeManager.Shared/Services/MiscMethods.cs
index fb2a09e..4e19ec6 100644
--- a/WardrobeManager.Shared/Services/MiscMethods.cs
+++ b/WardrobeManager.Shared/Services/MiscMethods.cs
@@ -2,13 +2,11 @@
 
 using System.Security.Cryptography;
 using System.Text.RegularExpressions;
-using WardrobeManager.Shared.DTOs;
 using WardrobeManager.Shared.Enums;
-using WardrobeManager.Shared.Models;
 
 #endregion
 
-namespace WardrobeManager.Shared.StaticResources;
+namespace WardrobeManager.Shared.Services;
 
 public class MiscMethods : IMiscMethods
 {
diff --git a/WardrobeManager.Shared/StaticResources/ProjectConstants.cs b/WardrobeManager.Shared/StaticResources/ProjectConstants.cs
index 68933b5..dff2bf0 100644
--- a/WardrobeManager.Shared/StaticResources/ProjectConstants.cs
+++ b/WardrobeManager.Shared/StaticResources/ProjectConstants.cs
@@ -1,3 +1,5 @@
+using System.Globalization;
+
 namespace WardrobeManager.Shared.StaticResources;
 
 public static class ProjectConstants
@@ -11,4 +13,5 @@ public static class ProjectConstants
     public const string DefaultItemImage = "/img/defaultItem.webp";
     public const string HomeBackgroundImage = "/img/home-background.webp";
     public const int MaxImageSizeInMBFallback = 5;
+    public static CultureInfo DefaultCultureInfo = new("en-CA");
 }
diff --git a/WardrobeManager.Shared/StaticResources/StaticValidators.cs b/WardrobeManager.Shared/StaticResources/StaticValidators.cs
index c35b007..e8992a6 100644
--- a/WardrobeManager.Shared/StaticResources/StaticValidators.cs
+++ b/WardrobeManager.Shared/StaticResources/StaticValidators.cs
@@ -10,7 +10,8 @@ public static class StaticValidators
     // A registry of validators (Map Type -> Validator Instance)
     private static readonly Dictionary<Type, IValidator> _validators = new()
     {
-        { typeof(NewClothingItemDTO), new NewClothingItemDTOValidator() }
+        { typeof(NewClothingItemDTO), new NewClothingItemDTOValidator() },
+        { typeof(AuthenticationCredentialsModel), new AuthenticationCredentialsModelValidator()}
     };
 
     public static Result<T> Validate<T>(T input)
@@ -38,6 +39,7 @@ public static Result<T> Validate<T>(T input)
 
 
 // All static validators below (in one file to stay clean)
+// Note: put a period at the end of each message so the frontend can split up the error into multiple notifications
 public class NewClothingItemDTOValidator : AbstractValidator<NewClothingItemDTO>
 {
     public NewClothingItemDTOValidator()
@@ -47,3 +49,18 @@ public NewClothingItemDTOValidator()
             .MaximumLength(50).WithMessage("Name is too long.");
     }
 }
+public class AuthenticationCredentialsModelValidator: AbstractValidator<AuthenticationCredentialsModel>
+{
+    public AuthenticationCredentialsModelValidator()
+    {
+        RuleFor(x => x.Email)
+            .NotNull().NotEmpty().WithMessage("Email is required")
+            .EmailAddress().WithMessage("Invalid email address.");
+        RuleFor(x => x.Password)
+            .NotNull().NotEmpty().WithMessage("Password must not be empty.")
+            .MinimumLength(6).WithMessage("Password must have at least 6 characters.")
+            .MaximumLength(50).WithMessage("Password is too long.")
+            .Must(x => x.Any(char.IsDigit)).WithMessage("Password must have at least one digit.")
+            .Must(x => x.Any(char.IsUpper)).WithMessage("Password must have at least one uppercase.");
+    }
+}
diff --git a/docs/pull_request_template.md b/docs/pull_request_template.md
new file mode 100644
index 0000000..05ca8e4
--- /dev/null
+++ b/docs/pull_request_template.md
@@ -0,0 +1,10 @@
+General Acceptance Criteria 
+
+* [ ] Responsive UI & Consistent Theme
+* [ ] Confirmation for Destructive actions
+* [ ] Helpful tooltips
+* [ ] Client-side and server-side input validation
+* [ ] Load under 3 seconds, performance optimizations (lazy loading, etc)
+* [ ] Authorized services must be authorized
+* [ ] Test happy paths and unhappy paths
+* [ ] Write unit tests for new functionality
\ No newline at end of file