From a53d786515151303adc4000da063ed9657483189 Mon Sep 17 00:00:00 2001 From: syuilo <syuilotan@yahoo.co.jp> Date: Mon, 21 May 2018 03:08:51 +0900 Subject: [PATCH] =?UTF-8?q?=E6=8A=95=E7=A8=BF=E3=81=AE=E8=A1=A8=E7=A4=BA?= =?UTF-8?q?=E3=82=B9=E3=82=BF=E3=82=A4=E3=83=AB=E3=82=92=E9=81=B8=E6=8A=9E?= =?UTF-8?q?=E3=81=A7=E3=81=8D=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/ja.yml | 3 ++ src/client/app/mobile/script.ts | 3 +- .../app/mobile/views/components/note.vue | 29 +++++++++++++++---- .../app/mobile/views/pages/settings.vue | 12 ++++++++ src/client/app/store.ts | 1 + 5 files changed, 42 insertions(+), 6 deletions(-) diff --git a/locales/ja.yml b/locales/ja.yml index 953556eedb..645dec9095 100644 --- a/locales/ja.yml +++ b/locales/ja.yml @@ -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: "「モバイルからの投稿」フラグを付けない" diff --git a/src/client/app/mobile/script.ts b/src/client/app/mobile/script.ts index be82ee8624..c73c0097cb 100644 --- a/src/client/app/mobile/script.ts +++ b/src/client/app/mobile/script.ts @@ -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 diff --git a/src/client/app/mobile/views/components/note.vue b/src/client/app/mobile/views/components/note.vue index 37b032886a..b940b6b20b 100644 --- a/src/client/app/mobile/views/components/note.vue +++ b/src/client/app/mobile/views/components/note.vue @@ -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 diff --git a/src/client/app/mobile/views/pages/settings.vue b/src/client/app/mobile/views/pages/settings.vue index 3b0df87549..034e8525a0 100644 --- a/src/client/app/mobile/views/pages/settings.vue +++ b/src/client/app/mobile/views/pages/settings.vue @@ -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 }); } diff --git a/src/client/app/store.ts b/src/client/app/store.ts index dceb51f2f3..972a994fb5 100644 --- a/src/client/app/store.ts +++ b/src/client/app/store.ts @@ -25,6 +25,7 @@ const defaultDeviceSettings = { preventUpdate: false, debug: false, lightmode: false, + postStyle: 'standard' }; export default (os: MiOS) => new Vuex.Store({