feat: prismisskey用にicon変更する

packages/frontend/src/pages/about.vue

@@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div class="_gaps_m">
 			<div :class="$style.banner" :style="{ backgroundImage: `url(${ bannerUrl })` }">
 				<div style="overflow: clip;">
-					<img :src="instance.iconUrl ?? instance.faviconUrl ?? '/favicon.ico'" alt="" :class="$style.bannerIcon"/>
+					<img :src="iconUrl" alt="" :class="$style.bannerIcon"/>
 					<div :class="$style.bannerName">
 						<b>{{ instance.name ?? host }}</b>
 					</div>
@@ -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', {

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)
   }
 })
 

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',

packages/frontend/src/ui/_common_/navbar-for-mobile.vue

@@ -8,7 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<div :class="$style.top">
 		<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"/>
+			<img :src="iconUrl" alt="" :class="$style.instanceIcon"/>
 		</button>
 	</div>
 	<div :class="$style.middle">
@@ -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');

packages/frontend/src/ui/_common_/navbar.vue

@@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
         <div :class="$style.banner" :style="{ backgroundImage: `url(${ bannerUrl })` }"></div>
         <button v-tooltip.noDelay.right="instance.name ?? i18n.ts.instance" class="_button" :class="$style.instance"
                 @click="openInstanceMenu">
-          <img :src="instance.iconUrl || instance.faviconUrl || '/favicon.ico'" alt="" :class="$style.instanceIcon"/>
+          <img :src="iconUrl" alt="" :class="$style.instanceIcon"/>
         </button>
       </div>
       <div :class="$style.middle">
@@ -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) {

packages/frontend/src/widgets/WidgetInstanceInfo.vue

@@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <div class="_panel">
 	<div :class="$style.container" :style="{ backgroundImage: instance.bannerUrl ? `url(${ bannerUrl })` : null }">
 		<div :class="$style.iconContainer">
-			<img :src="instance.iconUrl ?? instance.faviconUrl ?? '/favicon.ico'" alt="" :class="$style.icon"/>
+			<img :src="iconUrl" alt="" :class="$style.icon"/>
 		</div>
 		<div :class="$style.bodyContainer">
 			<div :class="$style.body">
@@ -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 = {
 };