Arrow fixes

src/ui/quickTour/arrowCmp/arrow.component.ts

@@ -52,7 +52,7 @@ export class ArrowComponent implements OnChanges{
     this.transform = `translate(${this.fromPos[0]}px, ${this.fromPos[1]}px)`
 
     this.headTranslate = `
-      translateX(-2rem)
+      translateX(-1.2rem)
       translate(${this.toPos[0] - this.fromPos[0]}px, ${this.toPos[1] - this.fromPos[1]}px)
       rotate(${rotate})
     `

src/ui/quickTour/arrowCmp/arrow.style.css

@@ -26,9 +26,10 @@ svg path
 
 #arrow_head
 {
-  width: 4rem;
+  width: 2.4rem;
   height: 4rem;
   transform-origin: 50% 0;
+  stroke-width: 3px;
 }
 
 #arrow_head #arrow_head_group

src/ui/quickTour/arrowCmp/arrow.template.html

@@ -2,12 +2,10 @@
 
 <svg id="arrow_head"
   [style.transform]="headTranslate"
-  viewBox="0 -2 55 100"
   fill="none"
   xmlns="http://www.w3.org/2000/svg">
   <g id="arrow_head_group">
-    <path id="arrrow_head_path" d="M.5 31.0882C8.402 15.7941 16.3039.5 24.9706.5S43.0686 15.7941 52.5 31.0882"/>
-  </g>
+    <path id="arrrow_head_path" d="M.5 17.819C5.1556 10.6856 9.8111 3.5523 14 1.319s7.9111.4333 11 4 5.5444 8.0333 8 12.5"/>  </g>
 </svg>
 
 <!-- stem -->
@@ -16,7 +14,7 @@
   <ng-template [ngSwitchCase]="'concave-from-top'">
     <svg id="arrow_stem"
       [style]="stemStyle"
-      viewBox="5 -10 100 100"
+      viewBox="0 0 100 100"
       fill="none"
       preserveAspectRatio="none"
       xmlns="http://www.w3.org/2000/svg">