feat: Added MudBlazor and reworked MainLayout

CouchLog/Components/Layout/MainLayout.razor

@@ -1,19 +1,45 @@
 @inherits LayoutComponentBase
 
-<div class="page">
-    <div class="sidebar">
-        <NavMenu />
-    </div>
+<MudThemeProvider />
+<MudPopoverProvider />
+<MudDialogProvider />
+<MudSnackbarProvider />
 
-    <main>
-        <article class="content px-4">
+<MudLayout>
+    <MudAppBar Elevation="1">
+        <MudIconButton  Icon="@Icons.Material.Filled.Menu"
+                        Color="Color.Inherit"
+                        Edge="Edge.Start"
+                        OnClick="ToggleDrawer" />
+        <MudText Typo="Typo.h5" Class="ml-3">CouchLog</MudText>
+        <MudSpacer />
+    </MudAppBar>
+
+    <MudDrawer  @bind-Open="_drawerOpen"
+                ClipMode="DrawerClipMode.Always" 
+                Elevation="2">
+        <NavMenu />
+    </MudDrawer>
+
+    <MudMainContent>
+        <MudContainer MaxWidth="MaxWidth.Large" Class="mt-4">
             @Body
-        </article>
-    </main>
-</div>
+        </MudContainer>
+    </MudMainContent>
+</MudLayout>
 
 <div id="blazor-error-ui" data-nosnippet>
     An unhandled error has occurred.
     <a href="." class="reload">Reload</a>
     <span class="dismiss">🗙</span>
 </div>
+
+@code
+{
+    private bool _drawerOpen = true;
+
+    private void ToggleDrawer()
+    {
+        _drawerOpen = !_drawerOpen;
+    }
+}