dark mode logo

This commit is contained in:
Čarodej
2022-03-15 18:03:28 +01:00
parent f6f4184fb2
commit aa5742dafa
20 changed files with 185 additions and 79 deletions

View File

@@ -47,6 +47,14 @@
/>
</AppInputText>
<AppInputText :title="$t('App Logo Dark Mode (optional)')">
<ImageInput
@input="$updateImage('/admin/settings', 'app_logo_dark', app.logo_dark)"
:image="$getImage(app.logo_dark)"
v-model="app.logo_dark"
/>
</AppInputText>
<AppInputText :title="$t('admin_settings.appearance.logo_horizontal')">
<ImageInput
@input="$updateImage('/admin/settings', 'app_logo_horizontal', app.logo_horizontal)"
@@ -55,6 +63,14 @@
/>
</AppInputText>
<AppInputText :title="$t('App Logo Horizontal Dark Mode (optional)')">
<ImageInput
@input="$updateImage('/admin/settings', 'app_logo_horizontal_dark', app.logo_horizontal_dark)"
:image="$getImage(app.logo_horizontal_dark)"
v-model="app.logo_horizontal_dark"
/>
</AppInputText>
<AppInputText :title="$t('admin_settings.appearance.favicon')">
<ImageInput
@input="$updateImage('/admin/settings', 'app_favicon', app.favicon)"
@@ -124,17 +140,19 @@ export default {
axios
.get('/api/admin/settings', {
params: {
column: 'app_title|app_description|app_logo|app_favicon|app_logo_horizontal|app_color|app_og_image|app_touch_icon',
column: 'app_title|app_description|app_logo|app_logo_dark|app_favicon|app_logo_horizontal|app_logo_horizontal_dark|app_color|app_og_image|app_touch_icon',
},
})
.then((response) => {
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,
}

View File

@@ -2,11 +2,11 @@
<div id="single-page">
<div id="page-content" v-if="!isLoading && data">
<!--Headline-->
<div v-if="config.isAdminVueFileManagerBar" class="mb-4 hidden justify-between md:mb-6 md:block md:flex">
<div v-if="config.isAdminVueFileManagerBar" class="mb-4 hidden justify-between items-center md:mb-6 md:block md:flex">
<!--VueFileManager logo-->
<a href="https://vuefilemanager.com" target="_blank">
<img
src="/assets/images/vuefilemanager-horizontal-logo.svg"
:src="isDarkMode ? '/assets/images/vuefilemanager-horizontal-logo-dark.svg' : '/assets/images/vuefilemanager-horizontal-logo.svg'"
alt="VueFileManager"
class="light-mode"
/>
@@ -223,7 +223,7 @@ export default {
Spinner,
},
computed: {
...mapGetters(['config']),
...mapGetters(['config', 'isDarkMode']),
},
data() {
return {