changeset 1210:f14293893430

fix: zoombuttons z-index zoombuttons do not overlap bottleneck list anymore
author Markus Kottlaender <markus@intevation.de>
date Mon, 19 Nov 2018 13:38:43 +0100
parents 4f666dbb9abd
children 55eae66af749
files client/src/App.vue
diffstat 1 files changed, 15 insertions(+), 21 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/App.vue	Mon Nov 19 13:29:57 2018 +0100
+++ b/client/src/App.vue	Mon Nov 19 13:38:43 2018 +0100
@@ -1,25 +1,23 @@
 <template>
     <div id="app" class="main">
         <div v-if="isAuthenticated" class="d-flex flex-column userinterface">
-            <div class="topcontainer">
-                <div class="topbar d-flex">
-                    <div class="mr-auto d-flex">
-                        <Sidebar :routeName="routeName"></Sidebar>
-                        <div class="d-flex flex-column" style="max-width: 600px;">
-                            <Search v-if="routeName == 'mainview'"></Search>
-                            <Bottlenecks v-if="routeName == 'mainview'"></Bottlenecks>
-                            <Imports v-if="routeName == 'mainview'"></Imports>
-			    <Staging v-if="routeName == 'mainview'"></Staging>
-                        </div>
+            <div class="topbar d-flex">
+                <div class="mr-auto d-flex">
+                    <Sidebar :routeName="routeName"></Sidebar>
+                    <div class="d-flex flex-column" style="max-width: 600px;">
+                        <Search v-if="routeName == 'mainview'"></Search>
+                        <Bottlenecks v-if="routeName == 'mainview'"></Bottlenecks>
+                        <Imports v-if="routeName == 'mainview'"></Imports>
+                        <Staging v-if="routeName == 'mainview'"></Staging>
                     </div>
-                    <div class="ml-auto d-flex">
-                        <Layers v-if="routeName == 'mainview'"></Layers>
-                        <Identify v-if="routeName == 'mainview'"></Identify>
-                    </div>
+                </div>
+                <div class="ml-auto d-flex">
+                    <Layers v-if="routeName == 'mainview'"></Layers>
+                    <Identify v-if="routeName == 'mainview'"></Identify>
                 </div>
             </div>
             <div class="flex-fill"></div>
-            <div class="bottomcontainer d-flex flex-row align-items-end">
+            <div class="d-flex flex-row align-items-end">
                 <Morphtool v-if="routeName == 'mainview'"></Morphtool>
                 <Pdftool v-if="routeName == 'mainview'"></Pdftool>
                 <Drawtool v-if="routeName == 'mainview'"></Drawtool>
@@ -33,12 +31,6 @@
 </template>
 
 <style lang="sass" scoped>
-.topcontainer
-  height: 10vh
-
-.bottomcontainer
-  height: 10vh
-
 .userinterface
   position: absolute
   top: 0
@@ -52,6 +44,8 @@
   padding-top: $offset
   margin-left: $offset
   margin-right: $offset
+  position: relative
+  z-index: 2
 
 #app
   height: 100vh