diff --git a/public/assets/images/vuefilemanager-horizontal-logo-dark.svg b/public/assets/images/vuefilemanager-horizontal-logo-dark.svg new file mode 100644 index 00000000..01bd425d --- /dev/null +++ b/public/assets/images/vuefilemanager-horizontal-logo-dark.svg @@ -0,0 +1,20 @@ + + + logo-horizontal-dark + + + + + + + + + + + .Vue + + + + + + \ No newline at end of file diff --git a/public/assets/images/vuefilemanager-horizontal-logo.svg b/public/assets/images/vuefilemanager-horizontal-logo.svg index 0bfc47df..34dfe7cb 100644 --- a/public/assets/images/vuefilemanager-horizontal-logo.svg +++ b/public/assets/images/vuefilemanager-horizontal-logo.svg @@ -1,19 +1,19 @@ - - - vuefilemanager-horizontal-logo - Created with Sketch. - {{ config.app_name }} @@ -53,7 +54,10 @@ import { mapGetters } from 'vuex' export default { name: 'IndexNavigation', computed: { - ...mapGetters(['config', 'index']), + ...mapGetters(['config', 'index', 'isDarkMode']), + logoSrc() { + return this.isDarkMode && this.config.app_logo_horizontal ? this.config.app_logo_horizontal_dark : this.config.app_logo_horizontal + } }, } diff --git a/resources/js/components/Index/IndexPageFooter.vue b/resources/js/components/Index/IndexPageFooter.vue index 0c120b37..5047acdc 100644 --- a/resources/js/components/Index/IndexPageFooter.vue +++ b/resources/js/components/Index/IndexPageFooter.vue @@ -3,9 +3,9 @@ @@ -38,7 +38,10 @@ import { mapGetters } from 'vuex' export default { name: 'IndexPageFooter', computed: { - ...mapGetters(['config']), + ...mapGetters(['config', 'isDarkMode']), + logoSrc() { + return this.isDarkMode && this.config.app_logo_horizontal ? this.config.app_logo_horizontal_dark : this.config.app_logo_horizontal + }, }, } diff --git a/resources/js/helpers/functionHelpers.js b/resources/js/helpers/functionHelpers.js index 86a1328e..15ed6ea6 100644 --- a/resources/js/helpers/functionHelpers.js +++ b/resources/js/helpers/functionHelpers.js @@ -349,7 +349,9 @@ const FunctionHelpers = { ? '/assets/payments/paystack-dark.svg' : '/assets/payments/paystack.svg', stripe: '/assets/payments/stripe.svg', - system: this.$getImage(store.getters.config.app_logo_horizontal), + system: store.getters.isDarkMode + ? this.$getImage(store.getters.config.app_logo_horizontal_dark) + : this.$getImage(store.getters.config.app_logo_horizontal), }[driver] || this.$getImage(store.getters.config.app_logo_horizontal) ) } diff --git a/resources/js/views/Admin/AppSettings/AppSettingsTabs/Appearance.vue b/resources/js/views/Admin/AppSettings/AppSettingsTabs/Appearance.vue index 6cf53bc8..dfa3318d 100644 --- a/resources/js/views/Admin/AppSettings/AppSettingsTabs/Appearance.vue +++ b/resources/js/views/Admin/AppSettings/AppSettingsTabs/Appearance.vue @@ -47,6 +47,14 @@ /> + + + + + + + + { this.app = { logo_horizontal: response.data.app_logo_horizontal, + logo_horizontal_dark: response.data.app_logo_horizontal_dark, description: response.data.app_description, favicon: response.data.app_favicon, title: response.data.app_title, color: response.data.app_color, logo: response.data.app_logo, + logo_dark: response.data.app_logo_dark, og_image: response.data.app_og_image, touch_icon: response.data.app_touch_icon, } diff --git a/resources/js/views/Admin/Dashboard.vue b/resources/js/views/Admin/Dashboard.vue index c3b3bc19..e99f525f 100644 --- a/resources/js/views/Admin/Dashboard.vue +++ b/resources/js/views/Admin/Dashboard.vue @@ -2,11 +2,11 @@
-