Added an edit overlay to the user avatar.

app/assets/css/launcher.css

@@ -286,14 +286,48 @@ p {
     height: 75px;
 }
 
-/* User profile avater. */
-#user_avatar {
+/* User profile avatar container. */
+#avatarContainer {
     border-radius: 50%;
     border: 2px solid #cad7e1;
     background: rgba(1, 2, 1, 0.5);
     height: 70px;
+    width: 70px;
     width: auto;
     box-shadow: 0px 0px 10px 0px rgb(0, 0, 0);
+    overflow: hidden;
+    position: relative;
+}
+
+/* Avatar edit overlay. */
+#avatarOverlay {
+    opacity: 0;
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-family: 'Avenir Book';
+    color: #fff;
+    transition: 0.25s ease;
+    font-weight: bold;
+    letter-spacing: 2px;
+    background: linear-gradient(65deg, rgba(0, 0, 0, 0.4), rgba(136, 77, 77, 0.4) 60%);
+    -webkit-user-select: none;
+    cursor: pointer;
+}
+#avatarOverlay:hover {
+    opacity: 1;
+}
+
+/* User profile avater image. */
+#avatarImage {
+    height: 100%;
+    width: auto;
 }
 
 /* User profile name text. */