Added Auth Context

implement login client code (todo: server login)
Added aboa icon

AobaClient/assets/style/colors.scss

@@ -1,8 +1,8 @@
 $mainBGColor: #584577;
-$featureColor: #CE2D4F;
+$featureColor: #ce2d4f;
 $accentColor: #f0eaf8;
 
 $mainTextColor: #eee;
 $brightTextColor: #fff;
 $invertTextColor: #222;
-$invertBrightTextColor: #000;
+$invertBrightTextColor: #000;

AobaClient/assets/style/main.scss

@@ -26,7 +26,8 @@ body {
 
 #content {
 	grid-area: Content;
-	margin-left: $navBarSize;
+	padding: 10px;
+	/* margin-left: $navBarSize; */
 }
 
 .mediaGrid {
@@ -55,6 +56,7 @@ body {
 				text-align: center;
 				width: 100%;
 				display: block;
+				overflow: hidden;
 			}
 			.details {
 				display: flex;

AobaClient/assets/style/mixins.scss

@@ -1,4 +1,4 @@
-$navBarSize: 40px;
+$navBarSize: 64px;
 
 @mixin mobile {
 	@media (max-width: 700px) {
@@ -40,4 +40,4 @@ $navBarSize: 40px;
 	@container (max-width: 1200px) {
 		@content;
 	}
-}
+}

AobaClient/assets/style/nav.scss

@@ -1,6 +1,5 @@
-@import 'mixins';
-@import 'colors';
-
+@import "mixins";
+@import "colors";
 
 nav {
 	display: grid;
@@ -9,14 +8,20 @@ nav {
 	background-color: $featureColor;
 	height: 100dvh;
 	position: fixed;
+	width: $navBarSize;
 
-	>* {
+	> * {
 		display: flex;
 		flex-direction: column;
 	}
 
 	.branding {
 		grid-area: Branding;
+
+		img {
+			width: $navBarSize;
+			object-fit: contain;
+		}
 	}
 
 	.mainNav {
@@ -30,5 +35,4 @@ nav {
 	.utils {
 		grid-area: Utils;
 	}
-
-}
+}