Mercurial > gemma

changeset 2705:eb3d7a429eb0

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: styling: fix z-index issues
author Markus Kottlaender <markus@intevation.de>
date Mon, 18 Mar 2019 16:05:26 +0100
parents 84145179ec72
children a4962c302af0
files client/src/components/App.vue
diffstat 1 files changed, 22 insertions(+), 20 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/App.vue	Mon Mar 18 15:56:54 2019 +0100
+++ b/client/src/components/App.vue	Mon Mar 18 16:05:26 2019 +0100
@@ -1,7 +1,7 @@
 <template>
   <div id="app" class="main">
     <div v-if="isAuthenticated" class="d-flex flex-column userinterface">
-      <div class="d-flex p-2">
+      <div class="boxes d-flex p-2">
         <div class="mr-auto d-flex">
           <Sidebar :routeName="routeName" />
           <div :class="searchContainer">
@@ -32,26 +32,28 @@
   </div>
 </template>
 
-<style lang="scss" scoped>
-.userinterface {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 4;
-  pointer-events: none;
-}
+<style lang="sass" scoped>
+#app
+  height: 100%
+  width: 100%
+  font-family: "Avenir", Helvetica, Arial, sans-serif
+  -webkit-font-smoothing: antialiased
+  -moz-osx-font-smoothing: grayscale
+  text-align: center
+  color: #2c3e50
 
-#app {
-  height: 100%;
-  width: 100%;
-  font-family: "Avenir", Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
+  .userinterface
+    position: absolute
+    top: 0
+    left: 0
+    right: 0
+    bottom: 0
+    z-index: 4
+    pointer-events: none
+
+    .boxes
+      position: relative
+      z-index: 10
 </style>
 
 <script>