other user profile loading icon

Author: supalarry

frontend/src/components/app/users/User.vue

@@ -1,11 +1,14 @@
 <template>
   <!-- eslint-disable max-len -->
   <div class="sm:mx-16 lg:mx-32">
-    <section class="mx-auto">
+    <div v-if="!user" class="mx-auto flex items-center justify-center mt-32">
+      <img class="h-36" src="../../../assets/loading.svg">
+    </div>
+    <section v-else class="mx-auto">
       <div v-on:click="goBack()" class="sort-button py-0 ml-auto rounded-md text-lg w-20 md:w-16 mr-4 sm:mr-0 mb-4">
         <h1 class="noSelect">←</h1>
       </div>
-      <div v-if="user" class="md:flex md:items-start">
+      <div class="md:flex md:items-start">
         <UserImages v-bind:images="user.images" v-bind:gender="user.gender" class="md:w-7/12 md:order-2 sm:rounded-t md:rounded-r-md md:rounded-l-none"></UserImages>
         <UserProfile class="md:w-5/12 md:order-1 md:overflow-scroll md:border-b md:border-l md:rounded-l-md" v-bind:user="user"></UserProfile>
       </div>