diff --git a/locales/ja.yml b/locales/ja.yml index 3f3d3b6d7e..1797f534ee 100644 --- a/locales/ja.yml +++ b/locales/ja.yml @@ -810,6 +810,7 @@ mobile/views/pages/settings/settings.profile.vue: title: "プロフィール" will-be-published: "これらのプロフィールは公開されます。" name: "名前" + account: "アカウント" location: "場所" description: "自己紹介" birthday: "誕生日" @@ -837,6 +838,7 @@ mobile/views/pages/settings.vue: specify-language: "言語を指定" design: "デザインと表示" dark-mode: "ダークモード" + i-am-under-limited-internet: "私は通信を制限されている" circle-icons: "円形のアイコンを使用" timeline: "タイムライン" show-reply-target: "リプライ先を表示する" diff --git a/src/client/app/common/views/components/avatar.vue b/src/client/app/common/views/components/avatar.vue index 8ec359e83c..8cc72fb518 100644 --- a/src/client/app/common/views/components/avatar.vue +++ b/src/client/app/common/views/components/avatar.vue @@ -21,10 +21,13 @@ export default Vue.extend({ } }, computed: { + lightmode(): boolean { + return localStorage.getItem('lightmode') == 'true'; + }, style(): any { return { backgroundColor: this.user.avatarColor && this.user.avatarColor.length == 3 ? `rgb(${ this.user.avatarColor.join(',') })` : null, - backgroundImage: `url(${ this.user.avatarUrl }?thumbnail)`, + backgroundImage: this.lightmode ? null : `url(${ this.user.avatarUrl }?thumbnail)`, borderRadius: (this as any).clientSettings.circleIcons ? '100%' : null }; } diff --git a/src/client/app/mobile/views/components/media-image.vue b/src/client/app/mobile/views/components/media-image.vue index 9e0f8e5f7e..d4ee0c66a9 100644 --- a/src/client/app/mobile/views/components/media-image.vue +++ b/src/client/app/mobile/views/components/media-image.vue @@ -16,10 +16,13 @@ export default Vue.extend({ } }, computed: { + lightmode(): boolean { + return localStorage.getItem('lightmode') == 'true'; + }, style(): any { return { 'background-color': this.image.properties.avgColor && this.image.properties.avgColor.length == 3 ? `rgb(${this.image.properties.avgColor.join(',')})` : 'transparent', - 'background-image': this.raw ? `url(${this.image.url})` : `url(${this.image.url}?thumbnail&size=512)` + 'background-image': this.lightmode ? null : this.raw ? `url(${this.image.url})` : `url(${this.image.url}?thumbnail&size=512)` }; } } diff --git a/src/client/app/mobile/views/pages/settings.vue b/src/client/app/mobile/views/pages/settings.vue index 5143a96dd5..307593e210 100644 --- a/src/client/app/mobile/views/pages/settings.vue +++ b/src/client/app/mobile/views/pages/settings.vue @@ -51,6 +51,10 @@ <div> <md-switch v-model="clientSettings.disableViaMobile" @change="onChangeDisableViaMobile">%i18n:@disable-via-mobile%</md-switch> </div> + + <div> + <md-switch v-model="lightmode">%i18n:@i-am-under-limited-internet%</md-switch> + </div> </md-card-content> </md-card> @@ -134,6 +138,7 @@ export default Vue.extend({ version, codename, darkmode: localStorage.getItem('darkmode') == 'true', + lightmode: localStorage.getItem('lightmode') == 'true', lang: localStorage.getItem('lang') || '', latestVersion: undefined, checkingForUpdate: false @@ -150,6 +155,11 @@ export default Vue.extend({ darkmode() { (this as any)._updateDarkmode_(this.darkmode); }, + + lightmode() { + localStorage.setItem('lightmode', this.lightmode); + }, + lang() { localStorage.setItem('lang', this.lang); } diff --git a/src/client/app/mobile/views/pages/settings/settings.profile.vue b/src/client/app/mobile/views/pages/settings/settings.profile.vue index 0315fc56bc..8d98e11a87 100644 --- a/src/client/app/mobile/views/pages/settings/settings.profile.vue +++ b/src/client/app/mobile/views/pages/settings/settings.profile.vue @@ -10,6 +10,13 @@ <md-input v-model="name" :disabled="saving"/> </md-field> + <md-field> + <label>%i18n:@account%</label> + <span class="md-prefix">@</span> + <md-input v-model="username" readonly></md-input> + <span class="md-suffix">@{{ host }}</span> + </md-field> + <md-field> <md-icon>%fa:map-marker-alt%</md-icon> <label>%i18n:@location%</label> @@ -54,12 +61,14 @@ <script lang="ts"> import Vue from 'vue'; -import { apiUrl } from '../../../../config'; +import { apiUrl, host } from '../../../../config'; export default Vue.extend({ data() { return { + host, name: null, + username: null, location: null, description: null, birthday: null, @@ -72,6 +81,7 @@ export default Vue.extend({ created() { this.name = (this as any).os.i.name || ''; + this.username = (this as any).os.i.username; this.location = (this as any).os.i.profile.location; this.description = (this as any).os.i.description; this.birthday = (this as any).os.i.profile.birthday; diff --git a/src/client/app/reset.styl b/src/client/app/reset.styl index 10bd3113a2..c0a88f27b0 100644 --- a/src/client/app/reset.styl +++ b/src/client/app/reset.styl @@ -1,3 +1,6 @@ +input + min-width 0px + input:not([type]) input[type='text'] input[type='password']