# HG changeset patch
# User Markus Kottlaender <markus@intevation.de>
# Date 1560352249 -7200
# Node ID 9e91b416d5bb59a7c07217b65cddf241577af7c1
# Parent  f9032442620a8c1c50b80705d589a293fbb43e81
client: cross profile: display arrow in diagram

consciously diceded to not draw it in the svg so it will not be exported to pdf since there it does not make sense without the map

diff -r f9032442620a -r 9e91b416d5bb client/src/components/fairway/Fairwayprofile.vue
--- a/client/src/components/fairway/Fairwayprofile.vue	Wed Jun 12 16:37:57 2019 +0200
+++ b/client/src/components/fairway/Fairwayprofile.vue	Wed Jun 12 17:10:49 2019 +0200
@@ -94,8 +94,9 @@
       </DiagramLegend>
       <div
         ref="diagramContainer"
-        class="d-flex flex-fill justify-content-center align-items-center diagram-container"
+        class="d-flex flex-fill justify-content-center align-items-center diagram-container position-relative"
       >
+        <div class="direction-indicator"></div>
         <div v-if="!fairwayData">
           <translate>No data available.</translate>
         </div>
@@ -104,6 +105,30 @@
   </div>
 </template>
 
+<style lang="sass" scoped>
+.direction-indicator
+  width: 70px
+  height: 0
+  border-top: dashed 2px #333
+  position: absolute
+  bottom: 20px
+  left: 115px
+  margin-left: -35px
+  &::after
+    content: ""
+    width: 0
+    height: 0
+    border-width: 10px
+    border-top-width: 5px
+    border-bottom-width: 5px
+    border-style: solid
+    border-color: transparent
+    border-left-color: #333
+    position: absolute
+    right: -20px
+    top: -6px
+</style>
+
 <script>
 /* This is Free Software under GNU Affero General Public License v >= 3.0
  * without warranty, see README.md and license for details.