-
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index 55de53fb07..642f4fd384 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -119,6 +119,7 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ i18n.ts.useSystemFont }}
{{ i18n.ts.disableDrawer }}
{{ i18n.ts.forceShowAds }}
+
{{ i18n.ts.showUnreadNotificationCount }}
{{ i18n.ts.dataSaver }}
@@ -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();
});
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 58730c7cef..aeacb30fc4 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -357,6 +357,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: false,
},
+ showUnreadNotificationCount: {
+ where: 'deviceAccount',
+ default: false,
+ },
}));
// TODO: 他のタブと永続化されたstateを同期
diff --git a/packages/frontend/src/ui/_common_/navbar-for-mobile.vue b/packages/frontend/src/ui/_common_/navbar-for-mobile.vue
index aa4a8c4145..534ab4981c 100644
--- a/packages/frontend/src/ui/_common_/navbar-for-mobile.vue
+++ b/packages/frontend/src/ui/_common_/navbar-for-mobile.vue
@@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ navbarItemDef[item].title }}
- {{ navbarItemDef[item].indicateValue }}
+ {{ navbarItemDef[item].indicateValue }}
diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue
index 5c8346016f..6c0cfdb487 100644
--- a/packages/frontend/src/ui/_common_/navbar.vue
+++ b/packages/frontend/src/ui/_common_/navbar.vue
@@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
>
{{ navbarItemDef[item].title }}
- {{ navbarItemDef[item].indicateValue }}
+ {{ navbarItemDef[item].indicateValue }}
diff --git a/packages/frontend/src/ui/classic.sidebar.vue b/packages/frontend/src/ui/classic.sidebar.vue
index 9172d51893..77711707e3 100644
--- a/packages/frontend/src/ui/classic.sidebar.vue
+++ b/packages/frontend/src/ui/classic.sidebar.vue
@@ -21,7 +21,10 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ navbarItemDef[item].title }}
-
+
+ {{ navbarItemDef[item].indicateValue }}
+
+
@@ -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 {
diff --git a/packages/frontend/src/ui/deck.vue b/packages/frontend/src/ui/deck.vue
index 39fc8a162f..3605b87f4b 100644
--- a/packages/frontend/src/ui/deck.vue
+++ b/packages/frontend/src/ui/deck.vue
@@ -55,7 +55,7 @@ SPDX-License-Identifier: AGPL-3.0-only
- {{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}
+ {{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}
diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue
index befd6ed257..1e111427d8 100644
--- a/packages/frontend/src/ui/universal.vue
+++ b/packages/frontend/src/ui/universal.vue
@@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
- {{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}
+ {{ $i.unreadNotificationCount > 20 ? '20+' : $i.unreadNotificationCount }}