mirror of
https://git.joinsharkey.org/Sharkey/Sharkey.git
synced 2024-11-23 05:43:07 +02:00
full view
This commit is contained in:
parent
7ec0670748
commit
0265c85ba3
2 changed files with 31 additions and 3 deletions
|
@ -714,6 +714,8 @@ clear: "クリア"
|
||||||
markAllAsRead: "全て既読にする"
|
markAllAsRead: "全て既読にする"
|
||||||
goBack: "戻る"
|
goBack: "戻る"
|
||||||
unlikeConfirm: "いいね解除しますか?"
|
unlikeConfirm: "いいね解除しますか?"
|
||||||
|
fullView: "フルビュー"
|
||||||
|
quitFullView: "フルビュー解除"
|
||||||
|
|
||||||
_email:
|
_email:
|
||||||
_follow:
|
_follow:
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="mk-app" :class="{ wallpaper, isMobile }">
|
<div class="mk-app" :class="{ wallpaper, isMobile }">
|
||||||
<div class="columns">
|
<div class="columns" :class="{ fullView }">
|
||||||
<div class="sidebar" ref="sidebar" v-if="!isMobile">
|
<div class="sidebar" ref="sidebar" v-if="!isMobile">
|
||||||
<XSidebar/>
|
<XSidebar/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -9,7 +9,7 @@
|
||||||
<header v-if="$store.state.titlebar" class="header" @click="onHeaderClick">
|
<header v-if="$store.state.titlebar" class="header" @click="onHeaderClick">
|
||||||
<XHeader :info="pageInfo"/>
|
<XHeader :info="pageInfo"/>
|
||||||
</header>
|
</header>
|
||||||
<div class="content _flat_">
|
<div class="content" :class="{ _flat_: !fullView }">
|
||||||
<router-view v-slot="{ Component }">
|
<router-view v-slot="{ Component }">
|
||||||
<transition :name="$store.state.animation ? 'page' : ''" mode="out-in" @enter="onTransition">
|
<transition :name="$store.state.animation ? 'page' : ''" mode="out-in" @enter="onTransition">
|
||||||
<keep-alive :include="['timeline']">
|
<keep-alive :include="['timeline']">
|
||||||
|
@ -53,7 +53,7 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||||
import { faLayerGroup, faBars, faHome, faCircle, faWindowMaximize, faColumns, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
|
import { faLayerGroup, faBars, faHome, faCircle, faWindowMaximize, faExpand, faPencilAlt, faCompress } from '@fortawesome/free-solid-svg-icons';
|
||||||
import { faBell } from '@fortawesome/free-regular-svg-icons';
|
import { faBell } from '@fortawesome/free-regular-svg-icons';
|
||||||
import { instanceName } from '@client/config';
|
import { instanceName } from '@client/config';
|
||||||
import { StickySidebar } from '@client/scripts/sticky-sidebar';
|
import { StickySidebar } from '@client/scripts/sticky-sidebar';
|
||||||
|
@ -84,6 +84,7 @@ export default defineComponent({
|
||||||
isMobile: window.innerWidth <= MOBILE_THRESHOLD,
|
isMobile: window.innerWidth <= MOBILE_THRESHOLD,
|
||||||
isDesktop: window.innerWidth >= DESKTOP_THRESHOLD,
|
isDesktop: window.innerWidth >= DESKTOP_THRESHOLD,
|
||||||
widgetsShowing: false,
|
widgetsShowing: false,
|
||||||
|
fullView: false,
|
||||||
wallpaper: localStorage.getItem('wallpaper') != null,
|
wallpaper: localStorage.getItem('wallpaper') != null,
|
||||||
faLayerGroup, faBars, faBell, faHome, faCircle, faPencilAlt,
|
faLayerGroup, faBars, faBell, faHome, faCircle, faPencilAlt,
|
||||||
};
|
};
|
||||||
|
@ -173,6 +174,12 @@ export default defineComponent({
|
||||||
os.contextMenu([{
|
os.contextMenu([{
|
||||||
type: 'label',
|
type: 'label',
|
||||||
text: path,
|
text: path,
|
||||||
|
}, {
|
||||||
|
icon: this.fullView ? faCompress : faExpand,
|
||||||
|
text: this.fullView ? this.$ts.quitFullView : this.$ts.fullView,
|
||||||
|
action: () => {
|
||||||
|
this.fullView = !this.fullView;
|
||||||
|
}
|
||||||
}, {
|
}, {
|
||||||
icon: faWindowMaximize,
|
icon: faWindowMaximize,
|
||||||
text: this.$ts.openInWindow,
|
text: this.$ts.openInWindow,
|
||||||
|
@ -248,6 +255,25 @@ export default defineComponent({
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
margin: 32px 0;
|
margin: 32px 0;
|
||||||
|
|
||||||
|
&.fullView {
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
> .sidebar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .widgets {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .main {
|
||||||
|
margin: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
> .main {
|
> .main {
|
||||||
width: 750px;
|
width: 750px;
|
||||||
margin: 0 16px 0 0;
|
margin: 0 16px 0 0;
|
||||||
|
|
Loading…
Reference in a new issue