More localization (#525)

* More localization

* Localize search dialog

* Fix "about" page title

frontend/src/components/MealPlan/MealPlanCard.vue

@@ -4,14 +4,14 @@
     <BaseDialog
       title="Custom Meal"
       :title-icon="$globals.icons.primary"
-      submit-text="Save"
+      :submit-text="$t('general.save')"
       :top="true"
       ref="customMealDialog"
       @submit="pushCustomMeal"
     >
       <v-card-text>
-        <v-text-field autofocus v-model="customMeal.name" label="Name"> </v-text-field>
+        <v-text-field autofocus v-model="customMeal.name" :label="$t('general.name')"> </v-text-field>
-        <v-textarea v-model="customMeal.description" label="Description"> </v-textarea>
+        <v-textarea v-model="customMeal.description" :label="$t('recipe.description')"> </v-textarea>
       </v-card-text>
     </BaseDialog>
     <v-col cols="12" sm="12" md="6" lg="4" xl="3" v-for="(planDay, index) in value" :key="index">
@@ -23,7 +23,7 @@
                 <v-icon left>
                   {{ $globals.icons.edit }}
                 </v-icon>
-                No Recipe
+                {{ $t('reicpe.no-recipe') }}
               </v-btn>
             </v-fade-transition>
           </CardImage>
@@ -40,14 +40,14 @@
                   <v-icon left>
                     {{ $globals.icons.edit }}
                   </v-icon>
-                  No Recipe
+                  {{ $t('reicpe.no-recipe') }}
                 </v-btn>
               </v-fade-transition>
               <v-btn color="info" outlined small @click="openSearch(index, modes.sides)">
                 <v-icon small class="mr-1">
                   {{ $globals.icons.create }}
                 </v-icon>
-                Side
+                {{ $t('meal-plan.side') }}
               </v-btn>
             </v-card-actions>
           </v-hover>

frontend/src/components/Recipe/CommentSection/index.vue

@@ -4,7 +4,7 @@
       <v-icon large class="mr-2">
         mdi-comment-text-multiple-outline
       </v-icon>
-      Comments
+      {{ $t('recipe.comments') }}
     </v-card-title>
     <v-divider class="mx-2"></v-divider>
     <v-card class="ma-2" v-for="(comment, index) in comments" :key="comment.id">
@@ -43,7 +43,7 @@
     <v-card-text v-if="loggedIn">
       <v-textarea auto-grow row-height="1" outlined v-model="newComment"> </v-textarea>
       <div class="d-flex">
-        <TheButton class="ml-auto" create @click="createNewComment"> Comment </TheButton>
+        <TheButton class="ml-auto" create @click="createNewComment"> {{ $t('recipe.comment-action') }} </TheButton>
       </div>
     </v-card-text>
   </v-card>

frontend/src/components/Recipe/Parts/Instructions.vue

@@ -14,7 +14,7 @@
             dense
             solo
             flat
-            placeholder="Section Title"
+            :placeholder="$t('recipe.section-title')"
             background-color="primary"
           >
           </v-text-field>
@@ -41,7 +41,7 @@
               </v-btn>
               {{ $t("recipe.step-index", { step: index + 1 }) }}
               <v-btn v-if="edit" text color="primary" class="ml-auto" @click="toggleShowTitle(index)">
-                {{ !showTitleEditor[index] ? "Insert Section" : "Remove Section" }}
+                {{ !showTitleEditor[index] ? $t('recipe.insert-section') : $t('recipe.remove-section') }}
               </v-btn>
             </v-card-title>
             <v-card-text v-if="edit">

frontend/src/components/Recipe/RecipePageActionMenu.vue

@@ -78,34 +78,39 @@ export default {
   data() {
     return {
       edit: false,
-      editorButtons: [
-        {
-          text: "Delete",
-          icon: this.$globals.icons.delete,
-          event: DELETE_EVENT,
-          color: "error",
-        },
-        {
-          text: "JSON",
-          icon: "mdi-code-braces",
-          event: JSON_EVENT,
-          color: "accent",
-        },
-        {
-          text: "Close",
-          icon: "mdi-close",
-          event: CLOSE_EVENT,
-          color: "",
-        },
-        {
-          text: "Save",
-          icon: this.$globals.icons.save,
-          event: SAVE_EVENT,
-          color: "success",
-        },
-      ],
     };
   },
+  
+  computed: {
+      editorButtons() {
+        return [
+          {
+            text: this.$t('general.delete'),
+            icon: this.$globals.icons.delete,
+            event: DELETE_EVENT,
+            color: "error",
+          },
+          {
+            text: this.$t('general.json'),
+            icon: "mdi-code-braces",
+            event: JSON_EVENT,
+            color: "accent",
+          },
+          {
+            text: this.$t('general.close'),
+            icon: "mdi-close",
+            event: CLOSE_EVENT,
+            color: "",
+          },
+          {
+            text: this.$t('general.save'),
+            icon: this.$globals.icons.save,
+            event: SAVE_EVENT,
+            color: "success",
+          },
+        ]; 
+      },
+  },
   methods: {
     emitHandler(event) {
       switch (event) {

frontend/src/components/UI/Dialogs/SearchDialog.vue

@@ -39,9 +39,9 @@
       <v-card class="mt-1 pa-1" relative>
         <v-card-actions>
           <div class="mr-auto">
-            Results
+            {{ $t('search.results') }}
           </div>
-          <router-link to="/search"> Advanced Search </router-link>
+          <router-link to="/search"> {{ $t('search.advanced-search') }} </router-link>
         </v-card-actions>
         <v-card-actions v-if="loading">
           <SiteLoader :loading="loading" />

frontend/src/components/UI/TheSidebar.vue

@@ -9,7 +9,7 @@
             <v-icon> mdi-heart </v-icon>
           </v-list-item-icon>
           <v-list-item-content>
-            <v-list-item-title> Favorites </v-list-item-title>
+            <v-list-item-title> {{ $t('general.favorites') }} </v-list-item-title>
           </v-list-item-content>
         </v-list-item>
       </template>

frontend/src/locales/messages/en-US.json

@@ -4,6 +4,7 @@
     "take-me-home": "Take me Home"
   },
   "about": {
+    "about": "About",
     "about-mealie": "About Mealie",
     "api-docs": "API Docs",
     "api-port": "API Port",
@@ -54,6 +55,7 @@
     "clear": "Clear",
     "close": "Close",
     "confirm": "Confirm",
+    "confirm-delete-generic": "Are you sure you want to delete this?",
     "copied": "Copied",
     "create": "Create",
     "created": "Created",
@@ -61,7 +63,6 @@
     "custom": "Custom",
     "dashboard": "Dashboard",
     "delete": "Delete",
-    "confirm-delete-generic": "Are you sure you want to delete this?",
     "disabled": "Disabled",
     "download": "Download",
     "edit": "Edit",
@@ -69,6 +70,7 @@
     "exception": "Exception",
     "failed-count": "Failed: {count}",
     "failure-uploading-file": "Failure uploading file",
+    "favorites": "Favorites",
     "field-required": "Field Required",
     "file-folder-not-found": "File/folder not found",
     "file-uploaded": "File uploaded",
@@ -79,10 +81,12 @@
     "image": "Image",
     "image-upload-failed": "Image upload failed",
     "import": "Import",
+    "json": "JSON",
     "keyword": "Keyword",
     "link": "Link",
     "link-copied": "Link Copied",
     "monday": "Monday",
+    "more": "More",
     "name": "Name",
     "new": "New",
     "no": "No",
@@ -120,8 +124,7 @@
     "url": "URL",
     "view": "View",
     "wednesday": "Wednesday",
-    "yes": "Yes",
+    "yes": "Yes"
-    "more": "More"
   },
   "group": {
     "are-you-sure-you-want-to-delete-the-group": "Are you sure you want to delete <b>{groupName}<b/>?",
@@ -151,6 +154,7 @@
     "edit-meal-plan": "Edit Meal Plan",
     "end-date": "End Date",
     "group": "Group (Beta)",
+    "main": "Main",
     "meal-planner": "Meal Planner",
     "meal-plans": "Meal Plans",
     "mealplan-categories": "MEALPLAN CATEGORIES",
@@ -166,6 +170,8 @@
     "only-recipes-with-these-categories-will-be-used-in-meal-plans": "Only recipes with these categories will be used in Meal Plans",
     "planner": "Planner",
     "quick-week": "Quick Week",
+    "side": "Side",
+    "sides": "Sides",
     "start-date": "Start Date"
   },
   "migration": {
@@ -183,18 +189,18 @@
   },
   "new-recipe": {
     "bulk-add": "Bulk Add",
-    "error-title": "Looks Like We Couldn't Find Anything",
     "error-details": "Only websites containing ld+json or microdata can be imported imported by Mealie. Most major recipe websites support this data structure. If your site cannot be imported but there is json data in the log, please submit a github issue with the URL and data.",
+    "error-title": "Looks Like We Couldn't Find Anything",
     "from-url": "Import a Recipe",
     "paste-in-your-recipe-data-each-line-will-be-treated-as-an-item-in-a-list": "Paste in your recipe data. Each line will be treated as an item in a list",
     "recipe-url": "Recipe URL",
     "url-form-hint": "Copy and paste a link from your favorite recipe website"
   },
   "page": {
-    "page": "Page",
     "all-recipes": "All Recipes",
     "home-page": "Home Page",
     "new-page-created": "New page created",
+    "page": "Page",
     "page-creation-failed": "Page creation failed",
     "page-deleted": "Page deleted",
     "page-deletion-failed": "Page deletion failed",
@@ -206,24 +212,27 @@
   },
   "recipe": {
     "add-key": "Add Key",
+    "add-to-favorites": "Add to Favorites",
     "api-extras": "API Extras",
     "assets": "Assets",
     "calories": "Calories",
     "calories-suffix": "calories",
     "carbohydrate-content": "Carbohydrate",
     "categories": "Categories",
-    "disable-comments": "Disable Comments",
+    "comment-action": "Comment",
-    "disable-amount": "Disable Ingredient Amounts",
+    "comments": "Comments",
     "delete-confirmation": "Are you sure you want to delete this recipe?",
     "delete-recipe": "Delete Recipe",
     "description": "Description",
+    "disable-amount": "Disable Ingredient Amounts",
+    "disable-comments": "Disable Comments",
     "fat-content": "Fat",
     "fiber-content": "Fiber",
     "grams": "grams",
     "ingredient": "Ingredient",
     "ingredients": "Ingredients",
+    "insert-section": "Insert Section",
     "instructions": "Instructions",
-    "share-recipe-message": "I wanted to share my {0} recipe with you.",
     "key-name-required": "Key Name Required",
     "landscape-view-coming-soon": "Landscape View (Coming Soon)",
     "milligrams": "milligrams",
@@ -249,7 +258,11 @@
     "recipe-settings": "Recipe Settings",
     "recipe-update-failed": "Recipe update failed",
     "recipe-updated": "Recipe updated",
+    "remove-from-favorites": "Remove from Favorites",
+    "remove-section": "Remove Section",
+    "section-title": "Section Title",
     "servings": "Servings",
+    "share-recipe-message": "I wanted to share my {0} recipe with you.",
     "show-assets": "Show Assets",
     "show-nutrition-values": "Show Nutrition Values",
     "sodium-content": "Sodium",
@@ -258,16 +271,19 @@
     "title": "Title",
     "total-time": "Total Time",
     "unable-to-delete-recipe": "Unable to Delete Recipe",
-    "view-recipe": "View Recipe",
+    "view-recipe": "View Recipe"
-    "add-to-favorites": "Add to Favorites",
+  },
-    "remove-from-favorites": "Remove from Favorites"
+  "reicpe": {
+    "no-recipe": "No Recipe"
   },
   "search": {
+    "advanced-search": "Advanced Search",
     "and": "and",
     "exclude": "Exclude",
     "include": "Include",
     "max-results": "Max Results",
     "or": "Or",
+    "results": "Results",
     "search": "Search",
     "search-mealie": "Search Mealie (press /)",
     "search-placeholder": "Search...",
@@ -338,6 +354,8 @@
       "secondary": "Secondary",
       "select-a-theme-from-the-dropdown-or-create-a-new-theme-note-that-the-default-theme-will-be-served-to-all-users-who-have-not-set-a-theme-preference": "Select a theme from the dropdown or create a new theme. Note that the default theme will be served to all users who have not set a theme preference.",
       "success": "Success",
+      "switch-to-dark-mode": "Switch to dark mode",
+      "switch-to-light-mode": "Switch to light mode",
       "theme": "Theme",
       "theme-deleted": "Theme deleted",
       "theme-name": "Theme Name",
@@ -345,9 +363,7 @@
       "theme-saved": "Theme Saved",
       "theme-settings": "Theme Settings",
       "theme-updated": "Theme updated",
-      "warning": "Warning",
+      "warning": "Warning"
-      "switch-to-light-mode": "Switch to light mode",
-      "switch-to-dark-mode": "Switch to dark mode"
     },
     "token": {
       "active-tokens": "ACTIVE TOKENS",

frontend/src/pages/MealPlan/ThisWeek.vue

@@ -7,7 +7,7 @@
       <v-divider class="mx-2"></v-divider>
       <v-row>
         <v-col cols="12" md="5" sm="12">
-          <v-card-title class="headline">Main</v-card-title>
+          <v-card-title class="headline">{{ $t('meal-plan.main') }}</v-card-title>
           <RecipeCard
             :name="planDay.meals[0].name"
             :slug="planDay.meals[0].slug"
@@ -15,7 +15,7 @@
           />
         </v-col>
         <v-col cols="12" lg="6" md="6" sm="12">
-          <v-card-title class="headline">Sides</v-card-title>
+          <v-card-title class="headline">{{ $t('meal-plan.sides') }}</v-card-title>
           <MobileRecipeCard
             class="mb-1"
             v-for="(side, index) in planDay.meals.slice(1)"

frontend/src/routes/admin.js

@@ -60,7 +60,7 @@ export const adminRoutes = {
       path: "about",
       component: About,
       meta: {
-        title: "general.about",
+        title: "about.about",
       },
     },
     {