small fixes

src/components/UserProfile.vue

@@ -21,18 +21,18 @@ const avatar = computed(() => {
 </script>
 
 <template>
-  <div>
+  <v-sheet border class="pa-4 d-flex flex-column ga-2">
     <div v-if="user" class="d-flex ga-4">
       <v-avatar size="x-large" color="info" :image="avatar" />
 
       <div>
-        <div>name: {{ user.name }}</div>
-        <div>email: {{ user.email }}</div>
-        <div>created at: {{ user.createdAt }}</div>
+        <div>Name: {{ user.name }}</div>
+        <div>E-mail: {{ user.email }}</div>
+        <div>Created At: {{ user.createdAt }}</div>
       </div>
     </div>
     <v-skeleton-loader v-else type="avatar, list-item-three-line" />
-  </div>
+  </v-sheet>
 </template>
 
 <style scoped lang="scss"></style>