feat: prismisskey用に背景画像などを変更する

This commit is contained in:
mattyatea 2023-09-20 09:02:50 +09:00
parent 1b463d9c31
commit bec8237cb3
6 changed files with 554 additions and 465 deletions

View file

@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div :class="$style.root">
<div :class="$style.top">
<div :class="$style.banner" :style="{ backgroundImage: `url(${ instance.bannerUrl })` }"></div>
<div :class="$style.banner" :style="{ backgroundImage: `url(${ bannerUrl })` }"></div>
<button class="_button" :class="$style.instance" @click="openInstanceMenu">
<img :src="instance.iconUrl || instance.faviconUrl || '/favicon.ico'" alt="" :class="$style.instanceIcon"/>
</button>
@ -46,15 +46,24 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { computed, defineAsyncComponent, toRef } from 'vue';
import {computed, defineAsyncComponent, ref, toRef, watch} from 'vue';
import { openInstanceMenu } from './common';
import * as os from '@/os';
import { navbarItemDef } from '@/navbar';
import { $i, openAccountMenu as openAccountMenu_ } from '@/account';
import { defaultStore } from '@/store';
import {bannerDark, bannerLight, defaultStore} from '@/store';
import { i18n } from '@/i18n';
import { instance } from '@/instance';
let bannerUrl = ref(defaultStore.state.bannerUrl);
const darkMode = computed(defaultStore.makeGetterSetter('darkMode'));
watch(darkMode, () => {
if (darkMode.value){
bannerUrl.value = bannerDark;
}else{
bannerUrl.value = bannerLight;
}
})
const menu = toRef(defaultStore.state, 'menu');
const otherMenuItemIndicated = computed(() => {
for (const def in navbarItemDef) {