image bug fix

frontend/src/components/Recipe/MobileRecipeCard.vue

@@ -2,8 +2,13 @@
   <v-card :ripple="false" class="mx-auto" hover :to="`/recipe/${slug}`" @click="$emit('selected')">
     <v-list-item three-line>
       <v-list-item-avatar tile size="125" class="v-mobile-img rounded-sm my-0 ml-n4">
-        <v-img v-if="!fallBackImage" :src="getImage(slug)" @error="fallBackImage = true"></v-img>
-        <v-icon color="primary" class="icon-position" size="100">
+        <v-img
+          v-if="!fallBackImage"
+          :src="getImage(slug)"
+          @load="fallBackImage = false"
+          @error="fallBackImage = true"
+        ></v-img>
+        <v-icon v-else color="primary" class="icon-position" size="100">
           mdi-silverware-variant
         </v-icon>
       </v-list-item-avatar>

frontend/src/pages/Admin/Profile/UserCard.vue

@@ -2,7 +2,7 @@
   <StatCard icon="mdi-account">
     <template v-slot:avatar>
       <v-avatar color="accent" size="120" class="white--text headline mt-n16">
-        <img :src="userProfileImage" v-if="!hideImage" @error="hideImage = true" />
+        <img :src="userProfileImage" v-if="!hideImage" @error="hideImage = true" @load="hideImage = false" />
         <div v-else>
           {{ initials }}
         </div>