From 4979c5180cdff43f931d70b3ce77c97e106610c8 Mon Sep 17 00:00:00 2001 From: mattyatea Date: Wed, 20 Sep 2023 09:25:19 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20prismisskey=E7=94=A8=E3=81=ABicon?= =?UTF-8?q?=E5=A4=89=E6=9B=B4=E3=81=99=E3=82=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/frontend/src/pages/about.vue | 8 +++++--- packages/frontend/src/pages/settings/theme.vue | 5 ++++- packages/frontend/src/store.ts | 6 ++++++ packages/frontend/src/ui/_common_/navbar-for-mobile.vue | 8 +++++--- packages/frontend/src/ui/_common_/navbar.vue | 9 ++++++--- packages/frontend/src/widgets/WidgetInstanceInfo.vue | 9 ++++++--- 6 files changed, 32 insertions(+), 13 deletions(-) diff --git a/packages/frontend/src/pages/about.vue b/packages/frontend/src/pages/about.vue index 0cd6e32264..d263fe8940 100644 --- a/packages/frontend/src/pages/about.vue +++ b/packages/frontend/src/pages/about.vue @@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
- +
{{ instance.name ?? host }}
@@ -115,7 +115,7 @@ import { i18n } from '@/i18n'; import { definePageMetadata } from '@/scripts/page-metadata'; import { claimAchievement } from '@/scripts/achievements'; import { instance } from '@/instance'; -import {bannerDark, bannerLight, defaultStore} from "@/store"; +import {bannerDark, bannerLight, defaultStore, iconDark, iconLight} from "@/store"; const props = withDefaults(defineProps<{ initialTab?: string; @@ -132,13 +132,15 @@ watch($$(tab), () => { } }); let bannerUrl = ref(defaultStore.state.bannerUrl); - +let iconUrl = ref(defaultStore.state.iconUrl); const darkMode = computed(defaultStore.makeGetterSetter('darkMode')); watch(darkMode, () => { if (darkMode.value){ bannerUrl.value = bannerDark; + iconUrl.value = iconDark; }else{ bannerUrl.value = bannerLight; + iconUrl.value = iconLight; } }) const initStats = () => os.api('stats', { diff --git a/packages/frontend/src/pages/settings/theme.vue b/packages/frontend/src/pages/settings/theme.vue index c1a904708e..58485a442d 100644 --- a/packages/frontend/src/pages/settings/theme.vue +++ b/packages/frontend/src/pages/settings/theme.vue @@ -98,7 +98,7 @@ import MkButton from '@/components/MkButton.vue'; import {getBuiltinThemesRef} from '@/scripts/theme'; import {selectFile} from '@/scripts/select-file'; import {isDeviceDarkmode} from '@/scripts/is-device-darkmode'; -import { ColdDeviceStorage, defaultStore , bannerDark,bannerLight} from '@/store'; +import {ColdDeviceStorage, defaultStore, bannerDark, bannerLight, iconDark, iconLight} from '@/store'; import {i18n} from '@/i18n'; import {instance} from '@/instance'; import {uniqueBy} from '@/scripts/array'; @@ -148,10 +148,13 @@ const themesCount = installedThemes.value.length; watch(darkMode, () => { if (darkMode.value) { defaultStore.set('bannerUrl', bannerDark) + defaultStore.set('iconUrl', iconDark) }else if(!darkMode.value) { defaultStore.set('bannerUrl', bannerLight) + defaultStore.set('iconUrl', iconLight) }else{ defaultStore.set('bannerUrl', bannerDark) + defaultStore.set('iconUrl', iconDark) } }) diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts index 984cf98b04..7635175289 100644 --- a/packages/frontend/src/store.ts +++ b/packages/frontend/src/store.ts @@ -42,6 +42,8 @@ export const notePostInterruptors: NotePostInterruptor[] = []; export const pageViewInterruptors: PageViewInterruptor[] = []; export const bannerDark='https://files.prismisskey.space/misskey/ac141052-7a16-4608-bc08-263566326a6d.jpg' export const bannerLight ='https://files.prismisskey.space/misskey/e8d13afc-2348-4b13-a64a-f55a19e8d7aa.jpg' +export const iconDark='https://files.prismisskey.space/misskey/c7e56b1d-4c4f-408f-bf73-3175f4eb26ca.png' +export const iconLight='https://files.prismisskey.space/misskey/f3b3c9f8-ff2a-474d-a858-64ffe9023e22.png' // TODO: それぞれいちいちwhereとかdefaultというキーを付けなきゃいけないの冗長なのでなんとかする(ただ型定義が面倒になりそう) @@ -267,6 +269,10 @@ export const defaultStore = markRaw(new Storage('base', { where: 'device', default: bannerDark }, + iconUrl:{ + where: 'device', + default: iconDark + }, instanceTicker: { where: 'device', default: 'remote' as 'none' | 'remote' | 'always', diff --git a/packages/frontend/src/ui/_common_/navbar-for-mobile.vue b/packages/frontend/src/ui/_common_/navbar-for-mobile.vue index 4221d8781b..020a97d45c 100644 --- a/packages/frontend/src/ui/_common_/navbar-for-mobile.vue +++ b/packages/frontend/src/ui/_common_/navbar-for-mobile.vue @@ -8,7 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@@ -51,17 +51,19 @@ import { openInstanceMenu } from './common'; import * as os from '@/os'; import { navbarItemDef } from '@/navbar'; import { $i, openAccountMenu as openAccountMenu_ } from '@/account'; -import {bannerDark, bannerLight, defaultStore} from '@/store'; +import {bannerDark, bannerLight, defaultStore, iconDark, iconLight} from '@/store'; import { i18n } from '@/i18n'; import { instance } from '@/instance'; let bannerUrl = ref(defaultStore.state.bannerUrl); - +let iconUrl = ref(defaultStore.state.iconUrl); const darkMode = computed(defaultStore.makeGetterSetter('darkMode')); watch(darkMode, () => { if (darkMode.value){ bannerUrl.value = bannerDark; + iconUrl.value = iconDark; }else{ bannerUrl.value = bannerLight; + iconUrl.value = iconLight; } }) const menu = toRef(defaultStore.state, 'menu'); diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue index e711918e54..cbfcc1dd14 100644 --- a/packages/frontend/src/ui/_common_/navbar.vue +++ b/packages/frontend/src/ui/_common_/navbar.vue @@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@@ -78,21 +78,24 @@ import {openInstanceMenu} from './common'; import * as os from '@/os'; import {navbarItemDef} from '@/navbar'; import {$i, openAccountMenu as openAccountMenu_} from '@/account'; -import {bannerDark, bannerLight, defaultStore} from '@/store'; +import {bannerDark, bannerLight, defaultStore, iconDark, iconLight} from '@/store'; import {i18n} from '@/i18n'; import {instance} from '@/instance'; const iconOnly = ref(false); let bannerUrl = ref(defaultStore.state.bannerUrl); - +let iconUrl = ref(defaultStore.state.iconUrl); const darkMode = computed(defaultStore.makeGetterSetter('darkMode')); watch(darkMode, () => { if (darkMode.value){ bannerUrl.value = bannerDark; + iconUrl.value = iconDark; }else{ bannerUrl.value = bannerLight; + iconUrl.value = iconLight; } }) + const menu = computed(() => defaultStore.state.menu); const otherMenuItemIndicated = computed(() => { for (const def in navbarItemDef) { diff --git a/packages/frontend/src/widgets/WidgetInstanceInfo.vue b/packages/frontend/src/widgets/WidgetInstanceInfo.vue index 2adeaaef59..36db872e9c 100644 --- a/packages/frontend/src/widgets/WidgetInstanceInfo.vue +++ b/packages/frontend/src/widgets/WidgetInstanceInfo.vue @@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
- +
@@ -24,20 +24,23 @@ import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExp import { GetFormResultType } from '@/scripts/form'; import { host } from '@/config'; import { instance } from '@/instance'; -import {bannerDark, bannerLight, defaultStore} from "@/store"; +import {bannerDark, bannerLight, defaultStore, iconDark, iconLight} from "@/store"; import {computed, ref, watch} from "vue"; const name = 'instanceInfo'; let bannerUrl = ref(defaultStore.state.bannerUrl); - +let iconUrl = ref(defaultStore.state.iconUrl); const darkMode = computed(defaultStore.makeGetterSetter('darkMode')); watch(darkMode, () => { if (darkMode.value){ bannerUrl.value = bannerDark; + iconUrl.value = iconDark; }else{ bannerUrl.value = bannerLight; + iconUrl.value = iconLight; } }) + const widgetPropsDef = { };