1
0
forked from mirror/misskey

投稿の表示スタイルを選択できるように

This commit is contained in:
syuilo 2018-05-21 03:08:51 +09:00
parent 42c811a523
commit a53d786515
5 changed files with 42 additions and 6 deletions

View File

@ -841,6 +841,9 @@ mobile/views/pages/settings.vue:
show-reply-target: "リプライ先を表示する"
show-my-renotes: "自分の行ったRenoteを表示する"
show-renoted-my-notes: "Renoteされた自分の投稿を表示する"
post-style: "投稿の表示スタイル"
post-style-standard: "標準"
post-style-smart: "スマート"
behavior: "動作"
fetch-on-scroll: "スクロールで自動読み込み"
disable-via-mobile: "「モバイルからの投稿」フラグを付けない"

View File

@ -5,7 +5,7 @@
import Vue from 'vue';
import VueRouter from 'vue-router';
import { MdCard, MdButton, MdField, MdMenu, MdList, MdSwitch, MdSubheader, MdDialog, MdDialogAlert } from 'vue-material/dist/components';
import { MdCard, MdButton, MdField, MdMenu, MdList, MdSwitch, MdSubheader, MdDialog, MdDialogAlert, MdRadio } from 'vue-material/dist/components';
import 'vue-material/dist/vue-material.min.css';
import 'vue-material/dist/theme/default.css';
@ -48,6 +48,7 @@ Vue.use(MdSwitch);
Vue.use(MdSubheader);
Vue.use(MdDialog);
Vue.use(MdDialogAlert);
Vue.use(MdRadio);
/**
* init

View File

@ -1,5 +1,5 @@
<template>
<div class="note" :class="{ renote: isRenote }">
<div class="note" :class="{ renote: isRenote, smart: $store.state.device.postStyle == 'smart' }">
<div class="reply-to" v-if="p.reply && (!os.isSignedIn || clientSettings.showReplyTarget)">
<x-sub :note="p.reply"/>
</div>
@ -12,9 +12,10 @@
<mk-time :time="note.createdAt"/>
</div>
<article>
<mk-avatar class="avatar" :user="p.user"/>
<mk-avatar class="avatar" :user="p.user" v-if="$store.state.device.postStyle != 'smart'"/>
<div class="main">
<header>
<mk-avatar class="avatar" :user="p.user" v-if="$store.state.device.postStyle == 'smart'"/>
<router-link class="name" :to="p.user | userPage">{{ p.user | userName }}</router-link>
<span class="is-bot" v-if="p.user.host === null && p.user.isBot">bot</span>
<span class="username"><mk-acct :user="p.user"/></span>
@ -262,6 +263,15 @@ root(isDark)
@media (min-width 500px)
font-size 16px
&.smart
> article
> .main
width 100%
> header
align-items center
margin-bottom 4px
> .renote
display flex
align-items center
@ -279,11 +289,15 @@ root(isDark)
.avatar
display inline-block
width 28px
height 28px
width 20px
height 20px
margin 0 8px 0 0
border-radius 6px
@media (min-width 500px)
width 28px
height 28px
[data-fa]
margin-right 4px
@ -352,13 +366,18 @@ root(isDark)
@media (min-width 500px)
margin-bottom 2px
> .avatar
margin-right 8px
width 20px
height 20px
border-radius 100%
> .name
display block
margin 0 0.5em 0 0
padding 0
overflow hidden
color isDark ? #fff : #627079
font-size 1em
font-weight bold
text-decoration none
text-overflow ellipsis

View File

@ -35,6 +35,13 @@
<md-switch v-model="clientSettings.showRenotedMyNotes" @change="onChangeShowRenotedMyNotes">%i18n:@show-renoted-my-notes%</md-switch>
</div>
</div>
<div>
<div class="md-body-2">%i18n:@post-style%</div>
<md-radio v-model="postStyle" value="standard">%i18n:@post-style-standard%</md-radio>
<md-radio v-model="postStyle" value="smart">%i18n:@post-style-smart%</md-radio>
</div>
</md-card-content>
</md-card>
@ -145,6 +152,11 @@ export default Vue.extend({
return Vue.filter('userName')((this as any).os.i);
},
postStyle: {
get() { return this.$store.state.device.postStyle; },
set(value) { this.$store.commit('device/set', { key: 'postStyle', value }); }
},
lightmode: {
get() { return this.$store.state.device.lightmode; },
set(value) { this.$store.commit('device/set', { key: 'lightmode', value }); }

View File

@ -25,6 +25,7 @@ const defaultDeviceSettings = {
preventUpdate: false,
debug: false,
lightmode: false,
postStyle: 'standard'
};
export default (os: MiOS) => new Vuex.Store({