Mercurial > gemma

comparison client/src/importqueue/Importqueue.vue @ 1217:ba8cd80d68b6

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
made more use of bootstrap classes instead of custom css
author Markus Kottlaender <markus@intevation.de>
date Mon, 19 Nov 2018 15:20:22 +0100
parents b23622905a3f
children
comparison
equal deleted inserted replaced
1216:1c7806728172 1217:ba8cd80d68b6
1 <template> 1 <template>
2 <div class="d-flex flex-row"> 2 <div class="d-flex flex-row">
3 <div :class="spacerStyle"></div> 3 <div :class="spacerStyle"></div>
4 <div class="importqueue"> 4 <div class="mt-3 mx-auto">
5 <div class="card importqueuecard"> 5 <div class="card importqueuecard">
6 <div class="card-header shadow-sm text-white bg-info mb-3">Importqueue</div> 6 <div class="card-header shadow-sm text-white bg-info mb-3">Importqueue</div>
7 <div class="card-body importcardbody"> 7 <div class="card-body importcardbody">
8 <div class="card-body importcardbody"> 8 <div class="card-body importcardbody">
9 <div class="searchandfilter d-flex flex-row"> 9 <div class="searchandfilter d-flex flex-row">
82 }, 82 },
83 computed: { 83 computed: {
84 ...mapState("imports", ["imports"]), 84 ...mapState("imports", ["imports"]),
85 ...mapState("application", ["showSidebar"]), 85 ...mapState("application", ["showSidebar"]),
86 spacerStyle() { 86 spacerStyle() {
87 return { 87 return [
88 spacer: true, 88 "spacer ml-3",
89 "spacer-expanded": this.showSidebar, 89 {
90 "spacer-collapsed": !this.showSidebar 90 "spacer-expanded": this.showSidebar,
91 }; 91 "spacer-collapsed": !this.showSidebar
92 }
93 ];
92 }, 94 },
93 successfulStyle() { 95 successfulStyle() {
94 return { 96 return {
95 btn: true, 97 btn: true,
96 "btn-light": !this.successful, 98 "btn-light": !this.successful,
124 }; 126 };
125 </script> 127 </script>
126 128
127 <style lang="sass" scoped> 129 <style lang="sass" scoped>
128 .spacer 130 .spacer
129 margin-left: $offset
130 height: 100vh 131 height: 100vh
131 132
132 .spacer-collapsed 133 .spacer-collapsed
133 min-width: $icon-width + $offset 134 min-width: $icon-width + $offset
134 transition: $transition-fast 135 transition: $transition-fast
135 136
136 .spacer-expanded 137 .spacer-expanded
137 min-width: $sidebar-width + $offset 138 min-width: $sidebar-width + $offset
138
139 .importqueue
140 margin-top: $offset
141 margin-right: auto
142 margin-left: auto
143 139
144 .importqueuecard 140 .importqueuecard
145 width: 80vw 141 width: 80vw
146 min-height: 20rem 142 min-height: 20rem
147 143