Mercurial > gemma

diff client/src/application/Topbar.vue @ 638:c2f040dba57f

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
feat: collapsible layer selection The layerselection has now a clickable icon, which allows it to collapse/expand the layerselection.
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 13 Sep 2018 10:09:08 +0200
parents f2097d2aa048
children 83081ba6c9c1
line wrap: on
line diff
--- a/client/src/application/Topbar.vue	Thu Sep 13 09:12:50 2018 +0200
+++ b/client/src/application/Topbar.vue	Thu Sep 13 10:09:08 2018 +0200
@@ -1,7 +1,7 @@
 <template>
     <div class="topbar d-flex flex-row justify-content-between">
-        <div>
-            <i @click="toggleSidebar" class="ui-element menubutton fa fa-bars"></i>
+        <div @click="toggleSidebar">
+            <i class="ui-element menubutton fa fa-bars"></i>
         </div>
         <div v-if="routeName != 'usermanagement'" class="input-group searchcontainer">
             <div class="input-group-prepend shadow">
@@ -22,16 +22,18 @@
 .splitscreen {
   background-color: white;
   padding: $small-offset;
-  margin-right: 0.5rem;
-  margin-left: 1rem;
-  border-radius: 5px;
+  margin-right: $small-offset;
+  margin-left: $offset;
+  border-radius: $border-radius;
+  height: $icon-width;
+  width: $icon-height;
 }
 
 .menubutton {
   background-color: white;
   padding: $small-offset;
-  border-radius: 5px;
-  margin-left: 1rem;
+  border-radius: $border-radius;
+  margin-left: $offset;
   height: $icon-width;
   width: $icon-height;
 }
@@ -51,8 +53,8 @@
 }
 
 .topbar {
-  padding-top: 1rem;
-  margin-right: 1rem;
+  padding-top: $offset;
+  margin-right: $offset;
 }
 
 .logout {