From 034a21e20338281846e7c7173b79d16366d2c852 Mon Sep 17 00:00:00 2001 From: Hayden <64056131+hay-kot@users.noreply.github.com> Date: Mon, 24 May 2021 10:12:46 -0800 Subject: [PATCH] TheButton global component (#425) Co-authored-by: hay-kot --- docs/docs/overrides/api.html | 2 +- frontend/src/App.vue | 1 - .../components/MealPlan/MealPlanEditor.vue | 4 +- frontend/src/components/Recipe/CardImage.vue | 31 ++-- .../src/components/UI/Buttons/TheButton.vue | 158 ++++++++++++++++++ .../UI/Dialogs/NewCategoryTagDialog.vue | 8 +- frontend/src/components/UI/TheRecipeFab.vue | 2 +- frontend/src/components/UI/TheSidebar.vue | 2 +- frontend/src/main.js | 1 + .../src/pages/Admin/Profile/APITokenCard.vue | 5 +- .../pages/Admin/Profile/ProfileGroupCard.vue | 5 +- .../pages/Admin/Profile/ProfileThemeCard.vue | 6 +- frontend/src/pages/Admin/Profile/UserCard.vue | 5 +- .../Admin/Settings/CustomPageCreator.vue | 16 +- .../pages/Admin/Settings/HomePageSettings.vue | 5 +- .../Admin/ToolBox/CategoryTagEditor/index.vue | 15 +- .../pages/Admin/ToolBox/EventNotification.vue | 20 +-- frontend/src/pages/MealPlan/Planner.vue | 8 +- frontend/src/pages/Recipe/ViewRecipe.vue | 12 +- frontend/src/pages/Recipes/CustomPage.vue | 34 ++-- frontend/src/pages/SearchPage/index.vue | 84 +++++----- frontend/src/pages/ShoppingList/index.vue | 28 +--- frontend/src/utils/globals.js | 6 +- 23 files changed, 283 insertions(+), 175 deletions(-) create mode 100644 frontend/src/components/UI/Buttons/TheButton.vue diff --git a/docs/docs/overrides/api.html b/docs/docs/overrides/api.html index fbb71d9fc315..e1bb9f54a230 100644 --- a/docs/docs/overrides/api.html +++ b/docs/docs/overrides/api.html @@ -14,7 +14,7 @@
diff --git a/frontend/src/App.vue b/frontend/src/App.vue index d87abafaf490..6abf35e5e528 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -78,5 +78,4 @@ export default { :root { scrollbar-color: transparent transparent; } - diff --git a/frontend/src/components/MealPlan/MealPlanEditor.vue b/frontend/src/components/MealPlan/MealPlanEditor.vue index 682842a90502..cab725912a6f 100644 --- a/frontend/src/components/MealPlan/MealPlanEditor.vue +++ b/frontend/src/components/MealPlan/MealPlanEditor.vue @@ -9,9 +9,7 @@ - - {{ $t("general.update") }} - + diff --git a/frontend/src/components/Recipe/CardImage.vue b/frontend/src/components/Recipe/CardImage.vue index f3667b3c2aa1..c24cd8f9ffc8 100644 --- a/frontend/src/components/Recipe/CardImage.vue +++ b/frontend/src/components/Recipe/CardImage.vue @@ -1,22 +1,21 @@ diff --git a/frontend/src/components/UI/Buttons/TheButton.vue b/frontend/src/components/UI/Buttons/TheButton.vue new file mode 100644 index 000000000000..cc9fce06b7fa --- /dev/null +++ b/frontend/src/components/UI/Buttons/TheButton.vue @@ -0,0 +1,158 @@ + + + + + \ No newline at end of file diff --git a/frontend/src/components/UI/Dialogs/NewCategoryTagDialog.vue b/frontend/src/components/UI/Dialogs/NewCategoryTagDialog.vue index 8179912289cf..75c362270edf 100644 --- a/frontend/src/components/UI/Dialogs/NewCategoryTagDialog.vue +++ b/frontend/src/components/UI/Dialogs/NewCategoryTagDialog.vue @@ -24,13 +24,9 @@ + - - {{ $t("general.cancel") }} - - - {{ $t("general.create") }} - + diff --git a/frontend/src/components/UI/TheRecipeFab.vue b/frontend/src/components/UI/TheRecipeFab.vue index 2971d1bb4eb6..2403b491cc62 100644 --- a/frontend/src/components/UI/TheRecipeFab.vue +++ b/frontend/src/components/UI/TheRecipeFab.vue @@ -50,7 +50,7 @@ diff --git a/frontend/src/components/UI/TheSidebar.vue b/frontend/src/components/UI/TheSidebar.vue index d3f9462b8dc5..100739ef7486 100644 --- a/frontend/src/components/UI/TheSidebar.vue +++ b/frontend/src/components/UI/TheSidebar.vue @@ -127,7 +127,7 @@ export default { return pages.map(x => ({ title: x.name, to: `/pages/${x.slug}`, - icon: this.$globals.icons.tags, + icon: this.$globals.icons.pages, })); } return []; diff --git a/frontend/src/main.js b/frontend/src/main.js index 1f53a7238979..90ce10f913ce 100644 --- a/frontend/src/main.js +++ b/frontend/src/main.js @@ -11,6 +11,7 @@ import "typeface-roboto/index.css"; Vue.config.productionTip = false; Vue.use(VueRouter); +Vue.component("TheButton", () => import("@/components/UI/Buttons/TheButton.vue")); Vue.prototype.$globals = globals; diff --git a/frontend/src/pages/Admin/Profile/APITokenCard.vue b/frontend/src/pages/Admin/Profile/APITokenCard.vue index 3a39bee6b4c7..9af38374707f 100644 --- a/frontend/src/pages/Admin/Profile/APITokenCard.vue +++ b/frontend/src/pages/Admin/Profile/APITokenCard.vue @@ -72,10 +72,7 @@ diff --git a/frontend/src/pages/Admin/Profile/ProfileGroupCard.vue b/frontend/src/pages/Admin/Profile/ProfileGroupCard.vue index d7ffbb85b311..6f1ea9fdde8e 100644 --- a/frontend/src/pages/Admin/Profile/ProfileGroupCard.vue +++ b/frontend/src/pages/Admin/Profile/ProfileGroupCard.vue @@ -105,10 +105,7 @@ {{ $t("settings.webhooks.test-webhooks") }} - - {{ $globals.icons.save }} - {{ $t("general.update") }} - + diff --git a/frontend/src/pages/Admin/Profile/ProfileThemeCard.vue b/frontend/src/pages/Admin/Profile/ProfileThemeCard.vue index 672286166151..882773fd8660 100644 --- a/frontend/src/pages/Admin/Profile/ProfileThemeCard.vue +++ b/frontend/src/pages/Admin/Profile/ProfileThemeCard.vue @@ -73,10 +73,8 @@ - - - {{ $globals.icons.create }} {{ $t("general.create") }} - + + diff --git a/frontend/src/pages/Admin/Profile/UserCard.vue b/frontend/src/pages/Admin/Profile/UserCard.vue index 5a47fb7fb13b..73e659f0a201 100644 --- a/frontend/src/pages/Admin/Profile/UserCard.vue +++ b/frontend/src/pages/Admin/Profile/UserCard.vue @@ -89,10 +89,7 @@ file-name="profile_image" /> - - {{ $globals.icons.save }} - {{ $t("general.update") }} - + diff --git a/frontend/src/pages/Admin/Settings/CustomPageCreator.vue b/frontend/src/pages/Admin/Settings/CustomPageCreator.vue index e500ecfab3dd..9b6bca969547 100644 --- a/frontend/src/pages/Admin/Settings/CustomPageCreator.vue +++ b/frontend/src/pages/Admin/Settings/CustomPageCreator.vue @@ -5,9 +5,7 @@

{{ $t("settings.custom-pages") }} - - {{ $t("general.create") }} - +

@@ -33,13 +31,9 @@ - - {{ $t("general.delete") }} - + - - {{ $t("general.edit") }} - + @@ -47,9 +41,7 @@ - - {{ $t("general.save") }} - + diff --git a/frontend/src/pages/Admin/Settings/HomePageSettings.vue b/frontend/src/pages/Admin/Settings/HomePageSettings.vue index 4f442f7248c0..268bdb0db8c5 100644 --- a/frontend/src/pages/Admin/Settings/HomePageSettings.vue +++ b/frontend/src/pages/Admin/Settings/HomePageSettings.vue @@ -126,10 +126,7 @@ - - {{ $globals.icons.save }} - {{ $t("general.save") }} - + diff --git a/frontend/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue b/frontend/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue index 42b61236009c..e27fd469a61e 100644 --- a/frontend/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue +++ b/frontend/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue @@ -36,11 +36,11 @@
- + {{ $t("general.create") }} - + @@ -72,15 +72,12 @@ + {{ item.name }} + - {{ item.name }} + - - {{ $t("general.edit") }} - - - {{ $t("general.delete") }} - + diff --git a/frontend/src/pages/Admin/ToolBox/EventNotification.vue b/frontend/src/pages/Admin/ToolBox/EventNotification.vue index 298bfe680798..015273b26eb7 100644 --- a/frontend/src/pages/Admin/ToolBox/EventNotification.vue +++ b/frontend/src/pages/Admin/ToolBox/EventNotification.vue @@ -10,12 +10,7 @@ @submit="createNotification" > diff --git a/frontend/src/pages/SearchPage/index.vue b/frontend/src/pages/SearchPage/index.vue index 6e50573921a4..87b45dc4c8da 100644 --- a/frontend/src/pages/SearchPage/index.vue +++ b/frontend/src/pages/SearchPage/index.vue @@ -1,53 +1,45 @@ diff --git a/frontend/src/pages/ShoppingList/index.vue b/frontend/src/pages/ShoppingList/index.vue index 10c2416eb03d..567f0aa9f41f 100644 --- a/frontend/src/pages/ShoppingList/index.vue +++ b/frontend/src/pages/ShoppingList/index.vue @@ -14,14 +14,8 @@ - @@ -37,12 +31,7 @@ - - - {{ $globals.icons.delete }} - - Delete - + @@ -63,12 +52,8 @@ {{ activeList.name }}
- - Save - - - Edit - + + @@ -276,5 +261,8 @@ export default { }; - \ No newline at end of file diff --git a/frontend/src/utils/globals.js b/frontend/src/utils/globals.js index c1c3d4a11cac..44841fec817d 100644 --- a/frontend/src/utils/globals.js +++ b/frontend/src/utils/globals.js @@ -2,13 +2,17 @@ const icons = { primary: "mdi-silverware-variant", // Crud - create: "mdi-plus", + createAlt: "mdi-plus", + create: "mdi-plus-circle", delete: "mdi-delete", save: "mdi-content-save", + update: "mdi-content-save-edit", edit: "mdi-square-edit-outline", + close: "mdi-close", // Organization tags: "mdi-tag-multiple-outline", + pages: "mdi-book-outline", // Admin user: "mdi-account",