diff --git a/frontend/src/components/Settings/Backup/index.vue b/frontend/src/components/Settings/Backup/index.vue
index 70c2c9edb..d16e65164 100644
--- a/frontend/src/components/Settings/Backup/index.vue
+++ b/frontend/src/components/Settings/Backup/index.vue
@@ -34,6 +34,8 @@
:backups="availableBackups"
/>
+
+ General Settings
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/frontend/src/components/Settings/Migration/MigrationCard.vue b/frontend/src/components/Settings/Migration/MigrationCard.vue
new file mode 100644
index 000000000..139ff2dc1
--- /dev/null
+++ b/frontend/src/components/Settings/Migration/MigrationCard.vue
@@ -0,0 +1,97 @@
+
+
+
+ {{ title }}
+
+
+
+
+
+ {{ description }}
+
+
+
+
+
+ mdi-import
+
+
+
+ {{ migration.name }}
+
+ {{ readableTime(migration.date) }}
+
+
+
+
+
+
+ Delete
+
+
+ Import
+
+
+
+
+
+
+
+ No Migration Data Avaiable
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/frontend/src/components/Settings/Migration/index.vue b/frontend/src/components/Settings/Migration/index.vue
index 4de4e6dcf..976756298 100644
--- a/frontend/src/components/Settings/Migration/index.vue
+++ b/frontend/src/components/Settings/Migration/index.vue
@@ -1,44 +1,96 @@
-
- {{$t('migration.recipe-migration')}}
-
+
+
+
+
+ {{ $t("migration.recipe-migration") }}
+
+
+
-
- Chowdown
- Nextcloud Recipes
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
diff --git a/frontend/src/components/Settings/Theme/ColorPickerDialog.vue b/frontend/src/components/Settings/Theme/ColorPickerDialog.vue
index 6da100082..3504e9e49 100644
--- a/frontend/src/components/Settings/Theme/ColorPickerDialog.vue
+++ b/frontend/src/components/Settings/Theme/ColorPickerDialog.vue
@@ -1,36 +1,28 @@
-
- {{ buttonText }}
-
-
-
- {{ buttonText }} {{$t('settings.color')}}
-
-
-
-
-
-
-
-
-
-
-
- {{$t('settings.swatches')}}
- {{$t('general.select')}}
-
-
-
+
+
{{ buttonText }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -44,21 +36,30 @@ export default {
return {
dialog: false,
swatches: false,
- color: "#FF00FF",
+ color: "#1976D2",
+ mask: "!#XXXXXXXX",
+ menu: false,
};
},
-
+ computed: {
+ swatchStyle() {
+ const { value, menu } = this;
+ return {
+ backgroundColor: value,
+ cursor: "pointer",
+ height: "30px",
+ width: "30px",
+ borderRadius: menu ? "50%" : "4px",
+ transition: "border-radius 200ms ease-in-out",
+ };
+ },
+ },
watch: {
color() {
this.updateColor();
},
},
methods: {
- toggleSwatches() {
- if (this.swatches) {
- this.swatches = false;
- } else this.swatches = true;
- },
updateColor() {
this.$emit("input", this.color);
},
diff --git a/frontend/src/components/UI/SuccessFailureAlert.vue b/frontend/src/components/UI/SuccessFailureAlert.vue
index 784ed2e82..0f6982d63 100644
--- a/frontend/src/components/UI/SuccessFailureAlert.vue
+++ b/frontend/src/components/UI/SuccessFailureAlert.vue
@@ -1,32 +1,50 @@
-
-
- {{ successHeader }}
-
-
- {{ success }}
-
-
-
-
- {{ failedHeader }}
-
-
- {{ fail }}
-
-
-
-
+
+
+ {{ title }}
+
+
+
+
+ {{ successHeader }}
+
+ - {{ success }}
+
+
+
+
+
+ {{ failedHeader }}
+
+ - {{ fail }}
+
+
+
+
+
+
+
diff --git a/frontend/src/i18n.js b/frontend/src/i18n.js
index 2b285c50a..41d46703c 100644
--- a/frontend/src/i18n.js
+++ b/frontend/src/i18n.js
@@ -1,23 +1,27 @@
-import Vue from 'vue'
-import VueI18n from 'vue-i18n'
+import Vue from "vue";
+import VueI18n from "vue-i18n";
-Vue.use(VueI18n)
+Vue.use(VueI18n);
-function loadLocaleMessages () {
- const locales = require.context('./locales', true, /[A-Za-z0-9-_,\s]+\.json$/i)
- const messages = {}
+function loadLocaleMessages() {
+ const locales = require.context(
+ "./locales",
+ true,
+ /[A-Za-z0-9-_,\s]+\.json$/i
+ );
+ const messages = {};
locales.keys().forEach(key => {
- const matched = key.match(/([A-Za-z0-9-_]+)\./i)
+ const matched = key.match(/([A-Za-z0-9-_]+)\./i);
if (matched && matched.length > 1) {
- const locale = matched[1]
- messages[locale] = locales(key)
+ const locale = matched[1];
+ messages[locale] = locales(key);
}
- })
- return messages
+ });
+ return messages;
}
export default new VueI18n({
- locale: process.env.VUE_APP_I18N_LOCALE || 'en',
- fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
- messages: loadLocaleMessages()
-})
+ locale: "en",
+ fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || "en",
+ messages: loadLocaleMessages(),
+});
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 76a58cfef..a99f64d6a 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -4,7 +4,7 @@ import vuetify from "./plugins/vuetify";
import store from "./store/store";
import VueRouter from "vue-router";
import { routes } from "./routes";
-import i18n from './i18n'
+import i18n from "./i18n";
Vue.config.productionTip = false;
Vue.use(VueRouter);
@@ -14,12 +14,13 @@ const router = new VueRouter({
mode: process.env.NODE_ENV === "production" ? "history" : "hash",
});
+
new Vue({
vuetify,
store,
router,
i18n,
- render: (h) => h(App)
+ render: h => h(App),
}).$mount("#app");
// Truncate
diff --git a/frontend/src/pages/SettingsPage.vue b/frontend/src/pages/SettingsPage.vue
index 441029ef3..bc1d2a924 100644
--- a/frontend/src/pages/SettingsPage.vue
+++ b/frontend/src/pages/SettingsPage.vue
@@ -13,7 +13,8 @@
"
>
-
+
+
@@ -39,6 +40,7 @@