Mercurial > gemma
changeset 1605:ef5cc5f1c757
refac: extracted spacer component
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Mon, 17 Dec 2018 15:45:39 +0100 |
parents | 32a34151d9d7 |
children | a4d8f284db93 |
files | client/src/components/Logs.vue |
diffstat | 1 files changed, 5 insertions(+), 23 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/Logs.vue Mon Dec 17 15:22:22 2018 +0100 +++ b/client/src/components/Logs.vue Mon Dec 17 15:45:39 2018 +0100 @@ -1,7 +1,7 @@ <template> <div class="main d-flex flex-column"> <div class="d-flex flex-row"> - <div :class="spacer"></div> + <Spacer></Spacer> <div class="card logs shadow-xs mt-3 mr-3"> <h6 class="mb-0 py-2 px-3 border-bottom d-flex text-info align-items-center" @@ -91,19 +91,6 @@ transition: $transition-fast; } -.spacer { - height: 90vh; -} - -.spacer-collapsed { - min-width: $icon-width + $offset; - transition: $transition-fast; -} - -.spacer-expanded { - min-width: $sidebar-width + $offset; -} - .statusline { position: absolute; right: 0; @@ -133,6 +120,7 @@ import { mapState } from "vuex"; import { HTTP } from "../lib/http.js"; import "../../node_modules/highlight.js/styles/paraiso-dark.css"; +import Spacer from "./Spacer"; import Vue from "vue"; import VueHighlightJS from "vue-highlightjs"; Vue.use(VueHighlightJS); @@ -142,6 +130,9 @@ export default { name: "logs", + components: { + Spacer + }, mounted() { this.fetch("system/log/apache2/access.log", ACCESSLOG); }, @@ -183,15 +174,6 @@ active: this.currentLog == ERRORLOG, "nav-link": true }; - }, - spacer() { - return [ - "spacer ml-3", - { - "spacer-expanded": this.showSidebar, - "spacer-collapsed": !this.showSidebar - } - ]; } } };