improve sidebar

assets/scss/partials/sidebar.scss

@@ -4,56 +4,31 @@
 
 #sidebar {
 	background: var(--sidebar-background);
-	border-top: 2px solid var(--vriish-rose);
 	display: flex;
 	flex-direction: column;
 	gap: 1em;
-	grid-area: sidebar;
-	margin-top: -2px;
-	max-height: 100vh;
-	padding: 1em;
-	position: sticky;
+	height: calc(100vh - 2rem);
+	padding: 0.5em;
+	position: fixed;
 	top: 0;
-	z-index: 1;
+	z-index: 2;
+	margin: 1rem;
+	border-radius: 2rem;
 	header {
 		text-align: center;
 		user-select: none;
 		#avatar {
 			border-radius: 500% 300% / 300% 500%;
-			width: calc(100% - 2em);
-			max-width: 200px;
+			max-width: 64px;
 			transition: .4s border-radius ease-in-out;
 			&:hover {
 				border-radius: 300% 500% / 500% 300%;
 			}
 		}
-		#name {
-			margin: 0;
-			font-weight: bold;
-			font-size: 1.8em;
-		}
-		#information {
-			margin: 0;
-			font-size: .8em;
-			#social-links {
-				list-style: none;
-				margin: 0;
-				padding: 0;
-				.icon {
-					height: 2em;
-					transition: color 0.2s linear;
-					&.mastodon-icon {
-						color: hsl(239.6, 100%, 69.4%);
-						&:hover {
-							color: hsl(251.5, 58.9%, 51.4%);
-						}
-					}
-				}
-			}
-		}
 	}
 	#sidebar-menu {
 		user-select: none;
+		text-align: center;
 		ul {
 			list-style: none;
 			padding: 0;
@@ -97,11 +72,28 @@
 			text-decoration: none;
 		}
 	}
-	aside {
-		bottom: 1em;
-		position: absolute;
-		left: 1em;
-		right: 1em;
+	#social-links {
+		text-align: center;
+		margin-top: auto;
+		ul {
+			list-style: none;
+			margin: 0;
+			padding: 0;
+		}
+		.icon {
+			height: 2em;
+			transition: color 0.2s linear;
+			&.mastodon-icon {
+				color: hsl(239.6, 100%, 69.4%);
+				&:hover {
+					color: hsl(251.5, 58.9%, 51.4%);
+				}
+			}
+		}
+	}
+	#localization {
+		bottom: 0.5em;
+		text-align: center;
 		@media (max-width: 920px) {
 			position: initial;
 		}

assets/scss/variables.scss

@@ -6,7 +6,7 @@
 	--text-2: hsl(210, 21%, 80%);
 	--text-secondary: hsl(210, 21%, 40%);
 	
-	--sidebar-background: hsl(210, 21%, 10%);
+	--sidebar-background: hsla(210, 21%, 10%, 20%);
 
 	--vriish-rose: hsl(0, 100%, 75%);
 	--orange: hsl(25, 100%, 75%);