From 3e0c6acde6810fdbadad52d0d95234dc4344b359 Mon Sep 17 00:00:00 2001 From: Camilla Ett Date: Thu, 23 Nov 2023 14:11:56 +0900 Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E3=83=AA=E3=82=A2=E3=82=AF?= =?UTF-8?q?=E3=82=B7=E3=83=A7=E3=83=B3=E3=81=AE=E6=A8=AA=E5=B9=85=E3=82=92?= =?UTF-8?q?150px=E3=81=AB=E5=88=B6=E9=99=90=E3=81=99=E3=82=8B=E3=81=8B?= =?UTF-8?q?=E3=81=A9=E3=81=86=E3=81=8B=E3=83=A6=E3=83=BC=E3=82=B6=E3=83=BC?= =?UTF-8?q?=E3=81=8C=E9=81=B8=E3=81=B9=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- locales/en-US.yml | 1 + locales/index.d.ts | 1 + locales/ja-JP.yml | 1 + locales/ja-KS.yml | 1 + .../frontend/src/components/MkReactionsViewer.reaction.vue | 2 +- packages/frontend/src/pages/settings/general.vue | 3 +++ packages/frontend/src/store.ts | 4 ++++ 7 files changed, 12 insertions(+), 1 deletion(-) diff --git a/locales/en-US.yml b/locales/en-US.yml index 09fd726c9f..ff5e30eb2f 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -1032,6 +1032,7 @@ enableChartsForRemoteUser: "Generate remote user data charts" enableChartsForFederatedInstances: "Generate remote instance data charts" showClipButtonInNoteFooter: "Add \"Clip\" to note action menu" reactionsDisplaySize: "Reaction display size" +limitWidthOfReaction: "Limit Width of Reaction" noteIdOrUrl: "Note ID or URL" video: "Video" videos: "Videos" diff --git a/locales/index.d.ts b/locales/index.d.ts index 6baed91c42..290cfdd6f7 100644 --- a/locales/index.d.ts +++ b/locales/index.d.ts @@ -1035,6 +1035,7 @@ export interface Locale { "enableChartsForFederatedInstances": string; "showClipButtonInNoteFooter": string; "reactionsDisplaySize": string; + "limitWidthOfReaction": string; "noteIdOrUrl": string; "video": string; "videos": string; diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index e59a550df5..fd8b9cba6b 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -1032,6 +1032,7 @@ enableChartsForRemoteUser: "リモートユーザーのチャートを生成" enableChartsForFederatedInstances: "リモートサーバーのチャートを生成" showClipButtonInNoteFooter: "ノートのアクションにクリップを追加" reactionsDisplaySize: "リアクションの表示サイズ" +limitWidthOfReaction: "リアクションの横幅を制限する" noteIdOrUrl: "ノートIDまたはURL" video: "動画" videos: "動画" diff --git a/locales/ja-KS.yml b/locales/ja-KS.yml index aa68def1da..1af47c0128 100644 --- a/locales/ja-KS.yml +++ b/locales/ja-KS.yml @@ -1032,6 +1032,7 @@ enableChartsForRemoteUser: "リモートユーザーのチャートを作る" enableChartsForFederatedInstances: "リモートサーバーのチャートを作る" showClipButtonInNoteFooter: "ノートのアクションにクリップを追加" reactionsDisplaySize: "リアクションの表示のでかさ" +limitWidthOfReaction: "リアクションの横幅を制限する" noteIdOrUrl: "ノートIDかURL" video: "動画" videos: "動画" diff --git a/packages/frontend/src/components/MkReactionsViewer.reaction.vue b/packages/frontend/src/components/MkReactionsViewer.reaction.vue index 2b850016c5..6d4df92a06 100644 --- a/packages/frontend/src/components/MkReactionsViewer.reaction.vue +++ b/packages/frontend/src/components/MkReactionsViewer.reaction.vue @@ -11,7 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-only :class="[$style.root, { [$style.reacted]: note.myReaction == reaction, [$style.canToggle]: canToggle, [$style.small]: defaultStore.state.reactionsDisplaySize === 'small', [$style.large]: defaultStore.state.reactionsDisplaySize === 'large' }]" @click="toggleReaction()" > - + {{ count }} diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue index 06d3789829..313b5efc46 100644 --- a/packages/frontend/src/pages/settings/general.vue +++ b/packages/frontend/src/pages/settings/general.vue @@ -56,6 +56,7 @@ SPDX-License-Identifier: AGPL-3.0-only + {{ i18n.ts.limitWidthOfReaction }} @@ -226,6 +227,7 @@ const serverDisconnectedBehavior = computed(defaultStore.makeGetterSetter('serve const showNoteActionsOnlyHover = computed(defaultStore.makeGetterSetter('showNoteActionsOnlyHover')); const showClipButtonInNoteFooter = computed(defaultStore.makeGetterSetter('showClipButtonInNoteFooter')); const reactionsDisplaySize = computed(defaultStore.makeGetterSetter('reactionsDisplaySize')); +const limitWidthOfReaction = computed(defaultStore.makeGetterSetter('limitWidthOfReaction')); const collapseRenotes = computed(defaultStore.makeGetterSetter('collapseRenotes')); const reduceAnimation = computed(defaultStore.makeGetterSetter('animation', v => !v, v => !v)); const useBlurEffectForModal = computed(defaultStore.makeGetterSetter('useBlurEffectForModal')); @@ -290,6 +292,7 @@ watch([ overridedDeviceKind, mediaListWithOneImageAppearance, reactionsDisplaySize, + limitWidthOfReaction, highlightSensitiveMedia, keepScreenOn, disableStreamingTimeline, diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts index 6d95ddba35..12660e9e8d 100644 --- a/packages/frontend/src/store.ts +++ b/packages/frontend/src/store.ts @@ -330,6 +330,10 @@ export const defaultStore = markRaw(new Storage('base', { where: 'device', default: 'medium' as 'small' | 'medium' | 'large', }, + limitWidthOfReaction: { + where: 'device', + default: true, + }, forceShowAds: { where: 'device', default: false,