Mercurial > gemma
changeset 1403:f7139b814a6c
improved bottleneck box height
reacts to showSplitscreen
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Wed, 28 Nov 2018 16:20:35 +0100 |
parents | acb71a982837 |
children | d4939311a99a |
files | client/src/components/map/contextbox/Bottlenecks.vue client/src/components/map/contextbox/Contextbox.vue |
diffstat | 2 files changed, 12 insertions(+), 5 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/map/contextbox/Bottlenecks.vue Wed Nov 28 16:17:17 2018 +0100 +++ b/client/src/components/map/contextbox/Bottlenecks.vue Wed Nov 28 16:20:35 2018 +0100 @@ -20,7 +20,11 @@ </div> <div class="col-2"></div> </div> - <div class="bottleneck-list small text-left" v-if="filteredAndSortedBottlenecks().length"> + <div + class="bottleneck-list small text-left" + :style="'max-height: ' + (showSplitscreen ? 18 : 35) + 'rem'" + v-if="filteredAndSortedBottlenecks().length" + > <div v-for="bottleneck in filteredAndSortedBottlenecks()" :key="bottleneck.properties.name" @@ -40,7 +44,7 @@ <div class="col-2 text-right"> <button type="button" - class="btn btn-sm btn-outline-secondary" + class="btn btn-sm btn-info" @click="toggleBottleneck(bottleneck.properties.name)" > <font-awesome-icon icon="angle-down"></font-awesome-icon> @@ -90,7 +94,11 @@ }; }, computed: { - ...mapState("application", ["searchQuery", "showSearchbarLastState"]), + ...mapState("application", [ + "searchQuery", + "showSearchbarLastState", + "showSplitscreen" + ]), ...mapState("bottlenecks", ["bottlenecks"]), sortIcon() { return this.sortDirection === "ASC" @@ -205,7 +213,6 @@ <style lang="sass" scoped> .bottleneck-list overflow-y: auto - max-height: 500px .surveys max-height: 0
--- a/client/src/components/map/contextbox/Contextbox.vue Wed Nov 28 16:17:17 2018 +0100 +++ b/client/src/components/map/contextbox/Contextbox.vue Wed Nov 28 16:20:35 2018 +0100 @@ -79,7 +79,7 @@ .contextboxextended max-width: 600px - max-height: 600px + max-height: 640px .close-contextbox position: absolute