Small ui fixes

frontend/src/components/FancyTextarea.vue

@@ -1,8 +1,9 @@
 <template>
 	<div class='fancy_textarea'>
-		<div 
-		 style='position: relative; display: inline-block;'
-		 v-bind:style='{width: width || "20rem"}'
+		<div
+			class='fancy_textarea__container'
+			style='position: relative; display: inline-block;'
+			v-bind:style='{width: width || "20rem"}'
 		>
 			<div
 				class='fancy_textarea__placeholder'
@@ -13,7 +14,6 @@
 			<textarea
 				class='input fancy_textarea__textarea'
 				v-bind:value='value'
-				v-bind:style='{width: width || "20rem"}'
 				v-on:input='updateValue($event.target.value)'
 				@focus='addActive'
 				@blur='removeActive'
@@ -62,6 +62,7 @@
 
 		@at-root #{&}__textarea {
 			height: 5rem;
+			width: 100%;
 		}
 
 		@at-root #{&}__placeholder {
@@ -117,4 +118,12 @@
 			}
 		}
 	}
+
+	@media (max-width: 420px) {
+		.fancy_textarea {
+			@at-root #{&}__container {
+				width: 100% !important;
+			}
+		}
+	}
 </style>

frontend/src/components/SearchBox.vue

@@ -47,6 +47,7 @@
 		border-radius: 0.25rem;
 		outline: none;
 		display: inline-block;
+		overflow: hidden;
 
 		@at-root #{&}__field {
 			outline: none;

frontend/src/components/routes/User.vue

@@ -194,6 +194,20 @@
 		.user__view_holder {
 			flex-direction: column;
 		}
+		.user_header {
+			@at-root #{&}__icon {
+				height: 3rem;
+				width: 3rem;
+				line-height: 3rem;
+				font-size: 2rem;
+			}
+			@at-root #{&}__username {
+				font-size: 1.75rem;
+			}
+			@at-root #{&}__date {
+				font-size: 1.25rem;
+			}
+		}
 		.user__links {
 			display: flex;
 			flex-direction: row;