diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/pages/settings/general.vue | 19 | ||||
| -rw-r--r-- | src/client/style.scss | 12 | ||||
| -rw-r--r-- | src/server/web/views/base.pug | 5 |
3 files changed, 36 insertions, 0 deletions
diff --git a/src/client/pages/settings/general.vue b/src/client/pages/settings/general.vue index f119fb684f..6ebda9efeb 100644 --- a/src/client/pages/settings/general.vue +++ b/src/client/pages/settings/general.vue @@ -37,6 +37,13 @@ <option v-for="x in langs" :value="x[0]" :key="x[0]">{{ x[1] }}</option> </mk-select> </div> + <div class="_content"> + <div>{{ $t('fontSize') }}</div> + <mk-radio v-model="fontSize" value="small"><span style="font-size: 14px;">Aa</span></mk-radio> + <mk-radio v-model="fontSize" :value="null"><span style="font-size: 16px;">Aa</span></mk-radio> + <mk-radio v-model="fontSize" value="large"><span style="font-size: 18px;">Aa</span></mk-radio> + <mk-radio v-model="fontSize" value="veryLarge"><span style="font-size: 20px;">Aa</span></mk-radio> + </div> </section> </template> @@ -47,6 +54,7 @@ import MkInput from '../../components/ui/input.vue'; import MkButton from '../../components/ui/button.vue'; import MkSwitch from '../../components/ui/switch.vue'; import MkSelect from '../../components/ui/select.vue'; +import MkRadio from '../../components/ui/radio.vue'; import i18n from '../../i18n'; import { apiUrl, langs } from '../../config'; @@ -58,12 +66,14 @@ export default Vue.extend({ MkButton, MkSwitch, MkSelect, + MkRadio, }, data() { return { langs, lang: localStorage.getItem('lang'), + fontSize: localStorage.getItem('fontSize'), wallpaperUploading: false, faImage, faCog } @@ -101,6 +111,15 @@ export default Vue.extend({ localStorage.setItem('lang', this.lang); localStorage.removeItem('locale'); location.reload(); + }, + + fontSize() { + if (this.fontSize == null) { + localStorage.removeItem('fontSize'); + } else { + localStorage.setItem('fontSize', this.fontSize); + } + location.reload(); } }, diff --git a/src/client/style.scss b/src/client/style.scss index b1c6c9b0b3..b3891314c0 100644 --- a/src/client/style.scss +++ b/src/client/style.scss @@ -58,6 +58,18 @@ html { } } } + + &.f-small { + font-size: 0.9em; + } + + &.f-large { + font-size: 1.1em; + } + + &.f-veryLarge { + font-size: 1.2em; + } } html.changing-theme { diff --git a/src/server/web/views/base.pug b/src/server/web/views/base.pug index 7ca196a34c..94f5a8e0e2 100644 --- a/src/server/web/views/base.pug +++ b/src/server/web/views/base.pug @@ -48,6 +48,11 @@ html } } + const fontSize = localStorage.getItem('fontSize'); + if (fontSize) { + document.documentElement.classList.add('f-' + fontSize); + } + body noscript: p | JavaScriptを有効にしてください |