If user is not signed in, don't make room for it.
This commit is contained in:
parent
582010fb7b
commit
38f96db80e
1 changed files with 11 additions and 6 deletions
17
src/App.vue
17
src/App.vue
|
|
@ -1,12 +1,17 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { computed } from "vue";
|
||||||
import { RouterView } from 'vue-router'
|
import { RouterView } from 'vue-router'
|
||||||
import { useUserStore } from "@/stores/userStore";
|
|
||||||
|
|
||||||
import Footer from "@/components/Footer.vue";
|
import Footer from "@/components/Footer.vue";
|
||||||
import Sidebar from "@/components/Sidebar.vue";
|
import Sidebar from "@/components/Sidebar.vue";
|
||||||
import TopBar from "@/components/TopBar.vue";
|
import TopBar from "@/components/TopBar.vue";
|
||||||
|
import { useUserStore } from "@/stores/userStore";
|
||||||
|
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
|
|
||||||
|
const sidebarSize = computed(() => {
|
||||||
|
return userStore.isAnonymous ? '0' : '90px';
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -32,14 +37,14 @@ $sidebar-size: 90px !default;
|
||||||
|
|
||||||
.act-layout {
|
.act-layout {
|
||||||
// To scroll only in the middle, see https://jsfiddle.net/VNVqs/
|
// To scroll only in the middle, see https://jsfiddle.net/VNVqs/
|
||||||
margin-bottom: $sidebar-size; // for scrolling
|
margin-bottom: v-bind(sidebarSize); // for scrolling
|
||||||
margin-top: $header-height; // for scrolling
|
margin-top: $header-height; // for scrolling
|
||||||
.act-footer {
|
.act-footer {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.act-sidebar {
|
.act-sidebar {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
height: $sidebar-size;
|
height: v-bind(sidebarSize);
|
||||||
left: 0;
|
left: 0;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 0;
|
right: 0;
|
||||||
|
|
@ -55,7 +60,7 @@ $sidebar-size: 90px !default;
|
||||||
}
|
}
|
||||||
@media (screen(sm)) {
|
@media (screen(sm)) {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
margin-left: $sidebar-size;
|
margin-left: v-bind(sidebarSize);
|
||||||
.act-footer {
|
.act-footer {
|
||||||
display: block
|
display: block
|
||||||
}
|
}
|
||||||
|
|
@ -63,10 +68,10 @@ $sidebar-size: 90px !default;
|
||||||
left: 0;
|
left: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
width: $sidebar-size;
|
width: v-bind(sidebarSize);
|
||||||
}
|
}
|
||||||
.act-header {
|
.act-header {
|
||||||
left: $sidebar-size;
|
left: v-bind(sidebarSize);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue