diff --git a/packages/frontend/src/components/MkNoteHeader.vue b/packages/frontend/src/components/MkNoteHeader.vue index 37fcfa3cb9..0499e09046 100644 --- a/packages/frontend/src/components/MkNoteHeader.vue +++ b/packages/frontend/src/components/MkNoteHeader.vue @@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only <template> <header :class="$style.root"> - <MkCondensedLine :minScale="0" style="min-width: 0;"> + <component :is="defaultStore.state.enableCondensedLine ? 'MkCondensedLine' : 'div'" :minScale="0" style="min-width: 0;"> <div style="display: flex; white-space: nowrap; align-items: baseline;"> <div v-if="mock" :class="$style.name"> <MkUserName :user="note.user"/> @@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only <div v-if="note.user.isBot" :class="$style.isBot">bot</div> <div :class="$style.username"><MkAcct :user="note.user"/></div> </div> - </MkCondensedLine> + </component> <div v-if="note.user.badgeRoles" :class="$style.badgeRoles"> <img v-for="(role, i) in note.user.badgeRoles" :key="i" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl!"/> </div> @@ -44,6 +44,7 @@ import * as Misskey from 'misskey-js'; import { i18n } from '@/i18n.js'; import { notePage } from '@/filters/note.js'; import { userPage } from '@/filters/user.js'; +import { defaultStore } from '@/store.js'; defineProps<{ note: Misskey.entities.Note; diff --git a/packages/frontend/src/pages/settings/other.vue b/packages/frontend/src/pages/settings/other.vue index ab48703824..410a3f53c7 100644 --- a/packages/frontend/src/pages/settings/other.vue +++ b/packages/frontend/src/pages/settings/other.vue @@ -51,6 +51,9 @@ SPDX-License-Identifier: AGPL-3.0-only <template #label>{{ i18n.ts.experimentalFeatures }}</template> <div class="_gaps_m"> + <MkSwitch v-model="enableCondensedLine"> + <template #label>Enable condensed line</template> + </MkSwitch> </div> </MkFolder> @@ -101,6 +104,7 @@ import FormSection from '@/components/form/section.vue'; const $i = signinRequired(); const reportError = computed(defaultStore.makeGetterSetter('reportError')); +const enableCondensedLine = computed(defaultStore.makeGetterSetter('enableCondensedLine')); const devMode = computed(defaultStore.makeGetterSetter('devMode')); const defaultWithReplies = computed(defaultStore.makeGetterSetter('defaultWithReplies')); diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts index fd5cfcc196..1ddcca5afe 100644 --- a/packages/frontend/src/store.ts +++ b/packages/frontend/src/store.ts @@ -392,6 +392,10 @@ export const defaultStore = markRaw(new Storage('base', { where: 'device', default: 'horizontal' as 'vertical' | 'horizontal', }, + enableCondensedLine: { + where: 'device', + default: true, + }, additionalUnicodeEmojiIndexes: { where: 'device', default: {} as Record<string, Record<string, string[]>>,