Get avatar from localstorage

components/layout/LayoutHeaderMenuAvatar.vue

-<template functional>
+<template>
   <button
     type="button"
     class="inline-flex items-center relative px-2 dark:border-gray-500 border-2 rounded-full hover:shadow-lg focus:outline-none focus:ring-2 transition-shadow"
@@ -7,7 +7,8 @@
     <fa icon="bars" class="ml-2 text-gray-500" />
 
     <div class="flex items-center h-10 w-10 pl-3">
-      <fa icon="user-circle" class="text-3xl" />
+      <img v-if="user" :src="user.avatar_url" class="rounded-full" />
+      <fa v-else icon="user-circle" class="text-3xl" />
     </div>
   </button>
 </template>
@@ -15,5 +16,15 @@
 <script>
 export default {
   name: 'LayoutHeaderMenuAvatar',
+  data() {
+    return {
+      user: null,
+    }
+  },
+  mounted() {
+    if (localStorage.getItem('netlify-cms-user')) {
+      this.user = JSON.parse(localStorage.getItem('netlify-cms-user'))
+    }
+  },
 }
 </script>