オプトインにする
This commit is contained in:
kakkokari-gtyih
parent
e781b2e0a6
commit
45680d7a28
1
locales/index.d.ts
vendored
1
locales/index.d.ts
vendored
|
|
@ -1138,6 +1138,7 @@ export interface Locale {
|
|||
"privacyPolicy": string;
|
||||
"privacyPolicyUrl": string;
|
||||
"tosAndPrivacyPolicy": string;
|
||||
"showUnreadNotificationCount": string;
|
||||
"_announcement": {
|
||||
"forExistingUsers": string;
|
||||
"forExistingUsersDescription": string;
|
||||
|
|
|
|||
|
|
@ -1135,6 +1135,7 @@ impressumDescription: "ドイツなどの一部の国と地域では表示が義
|
|||
privacyPolicy: "プライバシーポリシー"
|
||||
privacyPolicyUrl: "プライバシーポリシーURL"
|
||||
tosAndPrivacyPolicy: "利用規約・プライバシーポリシー"
|
||||
showUnreadNotificationCount: "未読の通知の数を表示する"
|
||||
|
||||
_announcement:
|
||||
forExistingUsers: "既存ユーザーのみ"
|
||||
|
|
|
|||
|
|
@ -8,16 +8,16 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div class="szkkfdyq _popup _shadow" :class="{ asDrawer: type === 'drawer' }" :style="{ maxHeight: maxHeight ? maxHeight + 'px' : '' }">
|
||||
<div class="main">
|
||||
<template v-for="item in items">
|
||||
<button v-if="item.action" v-click-anime class="_button item" @click="$event => { item.action($event); close(); }">
|
||||
<button v-if="item.action" :key="item.text" v-click-anime class="_button item" @click="$event => { item.action($event); close(); }">
|
||||
<i class="icon" :class="item.icon"></i>
|
||||
<div class="text">{{ item.text }}</div>
|
||||
<span v-if="item.indicate && item.indicateValue" class="indicatorWithValue"><span>{{ item.indicateValue }}</span></span>
|
||||
<span v-if="item.indicate && item.indicateValue && defaultStore.state.showUnreadNotificationCount" class="indicatorWithValue"><span>{{ item.indicateValue }}</span></span>
|
||||
<span v-else-if="item.indicate" class="indicator"><i class="_indicatorCircle"></i></span>
|
||||
</button>
|
||||
<MkA v-else v-click-anime :to="item.to" class="item" @click.passive="close()">
|
||||
<MkA v-else :key="item.text" v-click-anime :to="item.to" class="item" @click.passive="close()">
|
||||
<i class="icon" :class="item.icon"></i>
|
||||
<div class="text">{{ item.text }}</div>
|
||||
<span v-if="item.indicate && item.indicateValue" class="indicatorWithValue"><span>{{ item.indicateValue }}</span></span>
|
||||
<span v-if="item.indicate && item.indicateValue && defaultStore.state.showUnreadNotificationCount" class="indicatorWithValue"><span>{{ item.indicateValue }}</span></span>
|
||||
<span v-else-if="item.indicate" class="indicator"><i class="_indicatorCircle"></i></span>
|
||||
</MkA>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -119,6 +119,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkSwitch v-model="useSystemFont">{{ i18n.ts.useSystemFont }}</MkSwitch>
|
||||
<MkSwitch v-model="disableDrawer">{{ i18n.ts.disableDrawer }}</MkSwitch>
|
||||
<MkSwitch v-model="forceShowAds">{{ i18n.ts.forceShowAds }}</MkSwitch>
|
||||
<MkSwitch v-model="showUnreadNotificationCount">{{ i18n.ts.showUnreadNotificationCount }}</MkSwitch>
|
||||
<MkSwitch v-model="enableDataSaverMode">{{ i18n.ts.dataSaver }}</MkSwitch>
|
||||
</div>
|
||||
<div>
|
||||
|
|
@ -249,6 +250,7 @@ const mediaListWithOneImageAppearance = computed(defaultStore.makeGetterSetter('
|
|||
const notificationPosition = computed(defaultStore.makeGetterSetter('notificationPosition'));
|
||||
const notificationStackAxis = computed(defaultStore.makeGetterSetter('notificationStackAxis'));
|
||||
const keepScreenOn = computed(defaultStore.makeGetterSetter('keepScreenOn'));
|
||||
const showUnreadNotificationCount = computed(defaultStore.makeGetterSetter('showUnreadNotificationCount'));
|
||||
|
||||
watch(lang, () => {
|
||||
miLocalStorage.setItem('lang', lang.value as string);
|
||||
|
|
@ -285,6 +287,7 @@ watch([
|
|||
reactionsDisplaySize,
|
||||
highlightSensitiveMedia,
|
||||
keepScreenOn,
|
||||
showUnreadNotificationCount,
|
||||
], async () => {
|
||||
await reloadAsk();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -357,6 +357,10 @@ export const defaultStore = markRaw(new Storage('base', {
|
|||
where: 'device',
|
||||
default: false,
|
||||
},
|
||||
showUnreadNotificationCount: {
|
||||
where: 'deviceAccount',
|
||||
default: false,
|
||||
},
|
||||
}));
|
||||
|
||||
// TODO: 他のタブと永続化されたstateを同期
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<component :is="navbarItemDef[item].to ? 'MkA' : 'button'" v-else-if="navbarItemDef[item] && (navbarItemDef[item].show !== false)" class="_button" :class="[$style.item, { [$style.active]: navbarItemDef[item].active }]" :activeClass="$style.active" :to="navbarItemDef[item].to" v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}">
|
||||
<i class="ti-fw" :class="[$style.itemIcon, navbarItemDef[item].icon]"></i><span :class="$style.itemText">{{ navbarItemDef[item].title }}</span>
|
||||
<span v-if="navbarItemDef[item].indicated" :class="$style.itemIndicator">
|
||||
<span v-if="navbarItemDef[item].indicateValue" :class="$style.itemIndicateValueIcon"><span>{{ navbarItemDef[item].indicateValue }}</span></span>
|
||||
<span v-if="navbarItemDef[item].indicateValue && defaultStore.state.showUnreadNotificationCount" :class="$style.itemIndicateValueIcon"><span>{{ navbarItemDef[item].indicateValue }}</span></span>
|
||||
<i v-else class="_indicatorCircle"></i>
|
||||
</span>
|
||||
</component>
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
>
|
||||
<i class="ti-fw" :class="[$style.itemIcon, navbarItemDef[item].icon]"></i><span :class="$style.itemText">{{ navbarItemDef[item].title }}</span>
|
||||
<span v-if="navbarItemDef[item].indicated" :class="$style.itemIndicator">
|
||||
<span v-if="navbarItemDef[item].indicateValue" :class="$style.itemIndicateValueIcon"><span>{{ navbarItemDef[item].indicateValue }}</span></span>
|
||||
<span v-if="navbarItemDef[item].indicateValue && defaultStore.state.showUnreadNotificationCount" :class="$style.itemIndicateValueIcon"><span>{{ navbarItemDef[item].indicateValue }}</span></span>
|
||||
<i v-else class="_indicatorCircle"></i>
|
||||
</span>
|
||||
</component>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div v-if="item === '-'" class="divider"></div>
|
||||
<component :is="navbarItemDef[item].to ? 'MkA' : 'button'" v-else-if="navbarItemDef[item] && (navbarItemDef[item].show !== false)" v-click-anime class="item _button" :class="item" activeClass="active" :to="navbarItemDef[item].to" v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}">
|
||||
<i class="ti-fw" :class="navbarItemDef[item].icon"></i><span class="text">{{ navbarItemDef[item].title }}</span>
|
||||
<span v-if="navbarItemDef[item].indicated" class="indicator"><i class="_indicatorCircle"></i></span>
|
||||
<span v-if="navbarItemDef[item].indicated" class="indicator">
|
||||
<span v-if="navbarItemDef[item].indicateValue && defaultStore.state.showUnreadNotificationCount" class="itemIndicateValueIcon"><span>{{ navbarItemDef[item].indicateValue }}</span></span>
|
||||
<i v-else class="_indicatorCircle"></i>
|
||||
</span>
|
||||
</component>
|
||||
</template>
|
||||
<div class="divider"></div>
|
||||
|
|
@ -218,6 +221,30 @@ watch(defaultStore.reactiveState.menuDisplay, () => {
|
|||
color: var(--navIndicator);
|
||||
font-size: 8px;
|
||||
animation: blink 1s infinite;
|
||||
|
||||
&:has(.itemIndicateValueIcon) {
|
||||
animation: none;
|
||||
left: auto;
|
||||
right: 20px;
|
||||
}
|
||||
|
||||
& > .itemIndicateValueIcon {
|
||||
display: inline-flex;
|
||||
color: var(--fgOnAccent);
|
||||
font-weight: 700;
|
||||
background: var(--navIndicator);
|
||||
height: 1.5em;
|
||||
min-width: 1.5em;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 99rem;
|
||||
|
||||
& > span {
|
||||
display: inline-block;
|
||||
padding: 0 .25em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<button :class="$style.navButton" class="_button" @click="mainRouter.push('/my/notifications')">
|
||||
<i :class="$style.navButtonIcon" class="ti ti-bell"></i>
|
||||
<span v-if="$i?.hasUnreadNotification" :class="$style.navButtonIndicator">
|
||||
<span v-if="$i?.unreadNotificationCount" :class="$style.navButtonIndicateValueIcon"><span>{{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}</span></span>
|
||||
<span v-if="$i?.unreadNotificationCount && defaultStore.state.showUnreadNotificationCount" :class="$style.navButtonIndicateValueIcon"><span>{{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}</span></span>
|
||||
<i v-else class="_indicatorCircle"></i>
|
||||
</span>
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<button :class="$style.navButton" class="_button" @click="mainRouter.push('/my/notifications')">
|
||||
<i :class="$style.navButtonIcon" class="ti ti-bell"></i>
|
||||
<span v-if="$i?.hasUnreadNotification" :class="$style.navButtonIndicator">
|
||||
<span v-if="$i?.unreadNotificationCount" :class="$style.navButtonIndicateValueIcon"><span>{{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}</span></span>
|
||||
<span v-if="$i?.unreadNotificationCount && defaultStore.state.showUnreadNotificationCount" :class="$style.navButtonIndicateValueIcon"><span>{{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}</span></span>
|
||||
<i v-else class="_indicatorCircle"></i>
|
||||
</span>
|
||||
</button>
|
||||
|
|
|
|||
Loading…
Reference in a new issue