Style/update mobile styles (#1008)

* update styling for mobile

* remove Coming Soon

frontend/components/Domain/Recipe/RecipeTimeCard.vue

@@ -1,6 +1,13 @@
 <template>
   <div>
-    <v-chip v-for="(time, index) in allTimes" :key="index" label color="accent custom-transparent" class="ma-1">
+    <v-chip
+      v-for="(time, index) in allTimes"
+      :key="index"
+      :small="$vuetify.breakpoint.smAndDown"
+      label
+      color="accent custom-transparent"
+      class="ma-1"
+    >
       <v-icon left>
         {{ $globals.icons.clockOutline }}
       </v-icon>
@@ -58,7 +65,7 @@ export default defineComponent({
     return {
       showCards,
       allTimes,
-    }
+    };
   },
 });
 </script>

frontend/components/Layout/AppHeader.vue

@@ -36,8 +36,8 @@
         <v-icon> {{ $globals.icons.search }}</v-icon>
       </v-btn>
       <v-btn v-if="$auth.loggedIn" text @click="$auth.logout()">
-        <v-icon left>{{ $globals.icons.logout }}</v-icon>
-        {{ $t("user.logout") }}
+        <v-icon :left="$vuetify.breakpoint.smAndUp">{{ $globals.icons.logout }}</v-icon>
+        {{ $vuetify.breakpoint.smAndUp ? $t("user.logout") : "" }}
       </v-btn>
       <v-btn v-else text nuxt to="/login">
         <v-icon left>{{ $globals.icons.user }}</v-icon>