タイムラインのノートを話して表示するオプション

This commit is contained in:
syuilo 2020-12-11 22:36:57 +09:00
parent 3356f7113f
commit 1ade89be35
7 changed files with 26 additions and 6 deletions

View file

@ -663,6 +663,7 @@ experimentalFeatures: "実験的機能"
developer: "開発者"
makeExplorable: "アカウントを見つけやすくする"
makeExplorableDescription: "オフにすると、「みつける」にアカウントが載らなくなります。"
showGapBetweenNotesInTimeline: "タイムラインのノートを離して表示"
_aboutMisskey:
about: "Misskeyはsyuiloによって2014年から開発されている、オープンソースのソフトウェアです。"

View file

@ -1,5 +1,5 @@
<template>
<XNotes ref="tl" :pagination="pagination" @before="$emit('before')" @after="e => $emit('after', e)" @queue="$emit('queue', $event)"/>
<XNotes :class="{ _noGap_: !$store.state.device.showGapBetweenNotesInTimeline }" ref="tl" :pagination="pagination" @before="$emit('before')" @after="e => $emit('after', e)" @queue="$emit('queue', $event)"/>
</template>
<script lang="ts">

View file

@ -33,6 +33,7 @@
<FormSwitch v-model:value="disableAnimatedMfm">{{ $t('disableAnimatedMfm') }}</FormSwitch>
<FormSwitch v-model:value="reduceAnimation">{{ $t('reduceUiAnimation') }}</FormSwitch>
<FormSwitch v-model:value="useBlurEffectForModal">{{ $t('useBlurEffectForModal') }}</FormSwitch>
<FormSwitch v-model:value="showGapBetweenNotesInTimeline">{{ $t('showGapBetweenNotesInTimeline') }}</FormSwitch>
<FormSwitch v-model:value="loadRawImages">{{ $t('loadRawImages') }}</FormSwitch>
<FormSwitch v-model:value="disableShowingAnimatedImages">{{ $t('disableShowingAnimatedImages') }}</FormSwitch>
<FormSwitch v-model:value="useSystemFont">{{ $t('useSystemFont') }}</FormSwitch>
@ -140,6 +141,11 @@ export default defineComponent({
set(value) { this.$store.commit('device/set', { key: 'useBlurEffectForModal', value: value }); }
},
showGapBetweenNotesInTimeline: {
get() { return this.$store.state.device.showGapBetweenNotesInTimeline; },
set(value) { this.$store.commit('device/set', { key: 'showGapBetweenNotesInTimeline', value: value }); }
},
disableAnimatedMfm: {
get() { return !this.$store.state.device.animatedMfm; },
set(value) { this.$store.commit('device/set', { key: 'animatedMfm', value: !value }); }

View file

@ -80,6 +80,7 @@ export const defaultDeviceSettings = {
useFullReactionPicker: false,
reactionPickerWidth: 1,
reactionPickerHeight: 1,
showGapBetweenNotesInTimeline: true,
sidebarDisplay: 'full', // full, icon, hide
instanceTicker: 'remote', // none, remote, always
roomGraphicsQuality: 'medium',

View file

@ -287,12 +287,24 @@ hr {
}
}
._close_ ._list_ > * {
._noGap_ ._list_ {
@extend ._panel;
> * {
margin: 0 !important;
border: none;
border-bottom: solid 1px var(--divider);
border-radius: 0;
box-shadow: none;
}
}
._inContainer_ ._list_ > * {
margin: 0 !important;
border: none;
border-bottom: solid 1px var(--divider);
border-radius: 0;
box-shadow: none;
}
._loadMore {

View file

@ -1,6 +1,6 @@
<template>
<!-- sectionを利用しているのはdeck.vue側でcolumnに対してfirst-of-typeを効かせるため -->
<section class="dnpfarvg _panel _narrow_" :class="{ paged: isMainColumn, naked, _close_: !isMainColumn, active, isStacked, draghover, dragging, dropready }"
<section class="dnpfarvg _panel _narrow_" :class="{ paged: isMainColumn, naked, _inContainer_: !isMainColumn, active, isStacked, draghover, dragging, dropready }"
@dragover.prevent.stop="onDragover"
@dragleave="onDragleave"
@drop.prevent.stop="onDrop"

View file

@ -15,7 +15,7 @@
<span class="handle"><Fa :icon="faBars"/></span>{{ $t('_widgets.' + element.name) }}<button class="remove _button" @click="removeWidget(element)"><Fa :icon="faTimes"/></button>
</header>
<div @click="widgetFunc(element.id)">
<component class="_close_ _forceContainerFull_" :is="`mkw-${element.name}`" :widget="element" :ref="element.id" :setting-callback="setting => settings[element.id] = setting"/>
<component class="_inContainer_ _forceContainerFull_" :is="`mkw-${element.name}`" :widget="element" :ref="element.id" :setting-callback="setting => settings[element.id] = setting"/>
</div>
</div>
</template>
@ -23,7 +23,7 @@
<button @click="editMode = false" class="_textButton" style="font-size: 0.9em;"><Fa :icon="faCheck"/> {{ $t('editWidgetsExit') }}</button>
</template>
<template v-else>
<component v-for="widget in widgets" class="_close_ _forceContainerFull_" :is="`mkw-${widget.name}`" :key="widget.id" :widget="widget"/>
<component v-for="widget in widgets" class="_inContainer_ _forceContainerFull_" :is="`mkw-${widget.name}`" :key="widget.id" :widget="widget"/>
<button @click="editMode = true" class="_textButton" style="font-size: 0.9em;"><Fa :icon="faPencilAlt"/> {{ $t('editWidgets') }}</button>
</template>
</div>