Use capital letter for avatar icon, fix alignment

frontend/src/components/AvatarIcon.vue

@@ -55,7 +55,7 @@
 					if(this.userPicture) {
 						return ''
 					} else {
-						return this.user.username[0].toLowerCase()
+						return this.user.username[0].toUpperCase()
 					}
 				} else {
 					return ''
@@ -125,8 +125,8 @@
 			@at-root #{&}--small {
 				height: 2.5rem;
 				width: 2.5rem;
-				font-size: 2rem;
-				line-height: 2.25rem;
+				font-size: 1.75rem;
+				line-height: 2.5rem;
 			}
 		}
 		@at-root #{&}__header_info {

frontend/src/components/routes/User.vue

@@ -8,7 +8,7 @@
 					"background-image": userPicture,
 				}'
 			>
-				{{userPicture ? '' : username[0]}}
+				{{userPicture ? '' : username[0].toUpperCase()}}
 			</div>
 			<div class='user_header__info'>
 				<span class='user_header__username'>{{username}}</span>
@@ -124,7 +124,7 @@
 		@at-root #{&}__icon {
 			height: 6rem;
 			width: 6rem;
-			line-height: 5rem;
+			line-height: 5.5rem;
 			@include text($font--role-emphasis, 5rem)
 			text-align: center;
 			background-color: $color__gray--darkest;