Update user routes

src/components/SelectButton.vue

@@ -147,7 +147,7 @@
 				left: 0;
 				bottom: 0;
 				position: fixed;
-				font-size: 1.5rem;
+				font-size: 1.25rem;
 				opacity: 1;
 				border-radius: 0.25rem 0.25rem 0 0;
 				transition: opacity 0.2s, bottom 0.2s;

src/components/routes/User.vue

@@ -123,6 +123,7 @@
 	}
 	.user__view_holder {
 		display: flex;
+		flex-direction: row;
 	}
 	.user__links {
 		width: 8rem;
@@ -136,7 +137,7 @@
 			&:hover { color: $color__darkgray--primary; }
 
 			@at-root #{&}--selected {
-				font-weight: 500;
+				font-weight: bold;
 
 				&::before {
 					content: '';
@@ -156,4 +157,37 @@
 		flex-grow: 1;
 		width: 0;
 	}
+
+	@media (max-width: 420px) {
+		.user_route {
+			width: inherit;
+		}
+		.user__view_holder {
+			flex-direction: column;
+		}
+		.user__links {
+			display: flex;
+			flex-direction: row;
+
+			@at-root #{&}__menu_item {
+				margin-right: 0.5rem;
+
+				&:hover {
+					color: $color__text--primary;
+				}
+
+				@at-root #{&}--selected::before {
+					width: 100%;
+					height: 0.2rem;
+					left: 0rem;
+					top: auto;
+					border-radius: 1rem;
+					bottom: -0.375rem;
+				}
+			}
+		}
+		.user__view {
+			width: auto;
+		}
+	}
 </style>

src/components/routes/UserPosts.vue

@@ -110,4 +110,10 @@
 			margin-bottom: 1rem;
 		}
 	}
+
+	@media (max-width: 420px) {
+		.user_posts {
+			margin-top: 1rem;
+		}
+	}
 </style>