タイトルバー非表示オプション

This commit is contained in:
syuilo 2020-12-29 11:47:36 +09:00
parent 22049b10ff
commit 6b6483c9fc
5 changed files with 15 additions and 5 deletions

View file

@ -670,6 +670,7 @@ center: "中央"
wide: "広い" wide: "広い"
narrow: "狭い" narrow: "狭い"
reloadToApplySetting: "設定はページリロード後に反映されます。今すぐリロードしますか?" reloadToApplySetting: "設定はページリロード後に反映されます。今すぐリロードしますか?"
showTitlebar: "タイトルバーを表示する"
_aboutMisskey: _aboutMisskey:
about: "Misskeyはsyuiloによって2014年から開発されている、オープンソースのソフトウェアです。" about: "Misskeyはsyuiloによって2014年から開発されている、オープンソースのソフトウェアです。"

View file

@ -36,7 +36,7 @@
<span class="localOnly" v-if="note.localOnly"><Fa :icon="faBiohazard"/></span> <span class="localOnly" v-if="note.localOnly"><Fa :icon="faBiohazard"/></span>
</div> </div>
</div> </div>
<article class="article" @contextmenu="onContextmenu"> <article class="article" @contextmenu.prevent.stop="onContextmenu">
<MkAvatar class="avatar" :user="appearNote.user"/> <MkAvatar class="avatar" :user="appearNote.user"/>
<div class="main"> <div class="main">
<XNoteHeader class="header" :note="appearNote" :mini="true"/> <XNoteHeader class="header" :note="appearNote" :mini="true"/>

View file

@ -1,5 +1,6 @@
<template> <template>
<FormBase> <FormBase>
<FormSwitch v-model:value="titlebar">{{ $ts.showTitlebar }}</FormSwitch>
<FormSwitch v-model:value="showFixedPostForm">{{ $ts.showFixedPostForm }}</FormSwitch> <FormSwitch v-model:value="showFixedPostForm">{{ $ts.showFixedPostForm }}</FormSwitch>
<FormSelect v-model:value="lang"> <FormSelect v-model:value="lang">
@ -133,6 +134,7 @@ export default defineComponent({
useOsNativeEmojis: defaultStore.makeGetterSetter('useOsNativeEmojis'), useOsNativeEmojis: defaultStore.makeGetterSetter('useOsNativeEmojis'),
disableShowingAnimatedImages: defaultStore.makeGetterSetter('disableShowingAnimatedImages'), disableShowingAnimatedImages: defaultStore.makeGetterSetter('disableShowingAnimatedImages'),
loadRawImages: defaultStore.makeGetterSetter('loadRawImages'), loadRawImages: defaultStore.makeGetterSetter('loadRawImages'),
titlebar: defaultStore.makeGetterSetter('titlebar'),
imageNewTab: defaultStore.makeGetterSetter('imageNewTab'), imageNewTab: defaultStore.makeGetterSetter('imageNewTab'),
nsfw: defaultStore.makeGetterSetter('nsfw'), nsfw: defaultStore.makeGetterSetter('nsfw'),
disablePagesScript: defaultStore.makeGetterSetter('disablePagesScript'), disablePagesScript: defaultStore.makeGetterSetter('disablePagesScript'),

View file

@ -180,6 +180,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device', where: 'device',
default: 'full' as 'full' | 'icon' default: 'full' as 'full' | 'icon'
}, },
titlebar: {
where: 'device',
default: true
},
})); }));
// TODO: 他のタブと永続化されたstateを同期 // TODO: 他のタブと永続化されたstateを同期

View file

@ -2,8 +2,8 @@
<div class="mk-app" :class="{ wallpaper }"> <div class="mk-app" :class="{ wallpaper }">
<XSidebar ref="nav" class="sidebar"/> <XSidebar ref="nav" class="sidebar"/>
<div class="contents" ref="contents"> <div class="contents" ref="contents" :class="{ withHeader: $store.state.titlebar }" @contextmenu.prevent.stop="onContextmenu">
<header class="header" ref="header" @contextmenu.prevent.stop="onContextmenu" @click="onHeaderClick"> <header v-if="$store.state.titlebar" class="header" ref="header" @click="onHeaderClick">
<XHeader :info="pageInfo"/> <XHeader :info="pageInfo"/>
</header> </header>
<main ref="main"> <main ref="main">
@ -162,7 +162,7 @@ export default defineComponent({
this.navHidden = navWidth === 0; this.navHidden = navWidth === 0;
if (this.$refs.contents == null) return; if (this.$refs.contents == null) return;
const width = this.$refs.contents.offsetWidth; const width = this.$refs.contents.offsetWidth;
this.$refs.header.style.width = `${width}px`; if (this.$refs.header) this.$refs.header.style.width = `${width}px`;
}, },
showNav() { showNav() {
@ -256,7 +256,10 @@ export default defineComponent({
> .contents { > .contents {
width: 100%; width: 100%;
min-width: 0; min-width: 0;
padding-top: $header-height;
&.withHeader {
padding-top: $header-height;
}
> .header { > .header {
position: fixed; position: fixed;