# HG changeset patch
# User Markus Kottlaender <markus@intevation.de>
# Date 1553768764 -3600
# Node ID 451d73940c8161adbdaf85dcffccb39992aa38e9
# Parent  37c2a73ed001bffbec98fd1dc516edc5973733d5
client: diagrams: more compact legend style, removed unnecessary legend items

diff -r 37c2a73ed001 -r 451d73940c81 client/src/components/DiagramLegend.vue
--- a/client/src/components/DiagramLegend.vue	Thu Mar 28 11:16:32 2019 +0100
+++ b/client/src/components/DiagramLegend.vue	Thu Mar 28 11:26:04 2019 +0100
@@ -17,7 +17,8 @@
 <style lang="sass" scoped>
 #diagram-legend
   position: relative
-  width: 200px
+  width: 180px
+  font-size: 0.8rem
   .toggle
     margin-left: 0
     position: absolute
@@ -36,8 +37,8 @@
     span
       vertical-align: middle
       display: inline-block
-      width: 15px
-      height: 15px
+      width: 12px
+      height: 12px
       border-radius: 50%
 </style>
 
diff -r 37c2a73ed001 -r 451d73940c81 client/src/components/gauge/HydrologicalConditions.vue
--- a/client/src/components/gauge/HydrologicalConditions.vue	Thu Mar 28 11:16:32 2019 +0100
+++ b/client/src/components/gauge/HydrologicalConditions.vue	Thu Mar 28 11:26:04 2019 +0100
@@ -14,14 +14,9 @@
       <div class="legend">
         <span style="background-color: purple"></span> Q75%
       </div>
-      <div class="legend"><span style="background-color: red"></span> HDC</div>
-      <div class="legend">
-        <span style="background-color: green"></span> LDC
-      </div>
-      <div class="legend"><span style="background-color: grey"></span> MW</div>
       <div class="legend">
         <span style="background-color: lightsteelblue"></span>
-        Amplitude
+        Long-term Amplitude
       </div>
     </DiagramLegend>
     <div
diff -r 37c2a73ed001 -r 451d73940c81 client/src/components/gauge/Waterlevel.vue
--- a/client/src/components/gauge/Waterlevel.vue	Thu Mar 28 11:16:32 2019 +0100
+++ b/client/src/components/gauge/Waterlevel.vue	Thu Mar 28 11:26:04 2019 +0100
@@ -6,7 +6,7 @@
       </div>
       <div class="legend">
         <span
-          style="width: 5px; height: 5px; background-color: rgba(70, 130, 180, 0.6); border: solid 5px rgba(70, 130, 180, 0.2); background-clip: padding-box; box-sizing: content-box;"
+          style="width: 4px; height: 4px; background-color: rgba(70, 130, 180, 0.6); border: solid 4px rgba(70, 130, 180, 0.2); background-clip: padding-box; box-sizing: content-box;"
         ></span>
         Prediction
       </div>
@@ -14,11 +14,6 @@
         <span style="background-color: rgba(0, 255, 0, 0.1)"></span> Navigable
         Range
       </div>
-      <div class="legend"><span style="background-color: red"></span> HDC</div>
-      <div class="legend">
-        <span style="background-color: green"></span> LDC
-      </div>
-      <div class="legend"><span style="background-color: grey"></span> MW</div>
     </DiagramLegend>
     <div
       class="d-flex flex-fill justify-content-center align-items-center diagram-container"