Refactor/app settings (#251)

* fix env setup bugs

* remove unused import

* fix layout issues

* changelog

Co-authored-by: hay-kot <hay-kot@pm.me>

frontend/src/components/Admin/MealPlanner/TimePickerDialog.vue

@@ -42,4 +42,7 @@ export default {
 </script>
 
 <style scoped>
+.v-text-field{
+      max-width: 300px;
+}
 </style>

frontend/src/components/Recipe/RecipeViewer/Ingredients.vue

@@ -10,14 +10,14 @@
       <v-checkbox
         hide-details
         v-model="ingredient.checked"
-        class=" pt-0 ingredients my-auto py-auto"
+        class="pt-0 my-auto py-auto"
         color="secondary"
       >
       </v-checkbox>
 
       <v-list-item-content>
         <vue-markdown
-          class="my-auto text-subtitle-1 mb-0"
+          class="ma-0 pa-0 text-subtitle-1 dense-markdown"
           :source="ingredient.text"
         >
         </vue-markdown>
@@ -55,12 +55,8 @@ export default {
 };
 </script>
 
-<style scoped>
-p {
-  margin-bottom: auto !important;
-}
-
-.my-card-text {
-  overflow-wrap: break-word;
+<style >
+.dense-markdown p {
+  margin: auto !important;
 }
 </style>

frontend/src/pages/Admin/MealPlanner/index.vue

@@ -57,28 +57,23 @@
         <strong>{{ groupSettings.webhookTime }}</strong>
       </p>
 
-      <v-row dense align="center">
-        <v-col cols="12" md="2" sm="5">
-          <v-switch
-            v-model="groupSettings.webhookEnable"
-            :label="$t('general.enabled')"
-          ></v-switch>
-        </v-col>
-        <v-col cols="12" md="3" sm="5">
-          <TimePickerDialog @save-time="saveTime" />
-        </v-col>
-        <v-col cols="12" md="4" sm="5">
-          <v-btn text color="info" @click="testWebhooks">
-            <v-icon left> mdi-webhook </v-icon>
-            {{ $t("settings.webhooks.test-webhooks") }}
-          </v-btn>
-        </v-col>
+      <v-row dense class="flex align-center">
+        <v-switch
+        class="mx-2"
+          v-model="groupSettings.webhookEnable"
+          :label="$t('general.enabled')"
+        ></v-switch>
+        <TimePickerDialog @save-time="saveTime" class="ma-2" />
+        <v-btn class="ma-2" color="info" @click="testWebhooks">
+          <v-icon left> mdi-webhook </v-icon>
+          {{ $t("settings.webhooks.test-webhooks") }}
+        </v-btn>
       </v-row>
 
       <v-row
         v-for="(url, index) in groupSettings.webhookUrls"
         :key="index"
-        align="center"
+        align=" center"
         dense
       >
         <v-col cols="1">