enhance(client): ノートのリアクションを大きく表示するオプションを追加

This commit is contained in:
syuilo 2023-03-30 12:49:23 +09:00
parent e9769c937b
commit ffbe896f28
5 changed files with 20 additions and 1 deletions

View File

@ -19,6 +19,7 @@
### Client
- 検索ページでURLを入力した際に照会したときと同等の挙動をするように
- ノートのリアクションを大きく表示するオプションを追加
### Server
-

View File

@ -983,6 +983,7 @@ retryAllQueuesConfirmText: "一時的にサーバーの負荷が増大するこ
enableChartsForRemoteUser: "リモートユーザーのチャートを生成"
enableChartsForFederatedInstances: "リモートサーバーのチャートを生成"
showClipButtonInNoteFooter: "ノートのアクションにクリップを追加"
largeNoteReactions: "ノートのリアクションを大きく表示"
_achievements:
earnedAt: "獲得日時"

View File

@ -3,7 +3,7 @@
ref="buttonEl"
v-ripple="canToggle"
class="_button"
:class="[$style.root, { [$style.reacted]: note.myReaction == reaction, [$style.canToggle]: canToggle }]"
:class="[$style.root, { [$style.reacted]: note.myReaction == reaction, [$style.canToggle]: canToggle, [$style.large]: defaultStore.state.largeNoteReactions }]"
@click="toggleReaction()"
>
<MkReactionIcon :class="$style.icon" :reaction="reaction" :emoji-url="note.reactionEmojis[reaction.substr(1, reaction.length - 2)]"/>
@ -118,6 +118,17 @@ useTooltip(buttonEl, async (showing) => {
cursor: default;
}
&.large {
height: 42px;
font-size: 1.5em;
border-radius: 6px;
> .count {
font-size: 0.7em;
line-height: 42px;
}
}
&.reacted {
background: var(--accent);

View File

@ -48,6 +48,7 @@
<div class="_gaps_s">
<MkSwitch v-model="showNoteActionsOnlyHover">{{ i18n.ts.showNoteActionsOnlyHover }}</MkSwitch>
<MkSwitch v-model="showClipButtonInNoteFooter">{{ i18n.ts.showClipButtonInNoteFooter }}</MkSwitch>
<MkSwitch v-model="largeNoteReactions">{{ i18n.ts.largeNoteReactions }}</MkSwitch>
<MkSwitch v-model="collapseRenotes">{{ i18n.ts.collapseRenotes }}</MkSwitch>
<MkSwitch v-model="advancedMfm">{{ i18n.ts.enableAdvancedMfm }}</MkSwitch>
<MkSwitch v-if="advancedMfm" v-model="animatedMfm">{{ i18n.ts.enableAnimatedMfm }}</MkSwitch>
@ -145,6 +146,7 @@ const overridedDeviceKind = computed(defaultStore.makeGetterSetter('overridedDev
const serverDisconnectedBehavior = computed(defaultStore.makeGetterSetter('serverDisconnectedBehavior'));
const showNoteActionsOnlyHover = computed(defaultStore.makeGetterSetter('showNoteActionsOnlyHover'));
const showClipButtonInNoteFooter = computed(defaultStore.makeGetterSetter('showClipButtonInNoteFooter'));
const largeNoteReactions = computed(defaultStore.makeGetterSetter('largeNoteReactions'));
const collapseRenotes = computed(defaultStore.makeGetterSetter('collapseRenotes'));
const reduceAnimation = computed(defaultStore.makeGetterSetter('animation', v => !v, v => !v));
const useBlurEffectForModal = computed(defaultStore.makeGetterSetter('useBlurEffectForModal'));

View File

@ -294,6 +294,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: false,
},
largeNoteReactions: {
where: 'device',
default: false,
},
aiChanMode: {
where: 'device',
default: false,