From 53c3a6b30494f063ca323cb21ffff072c3204db2 Mon Sep 17 00:00:00 2001
From: Valentin Mihai <valentin@devplant.ro>
Date: Mon, 14 Feb 2022 15:55:22 +0200
Subject: [PATCH] added helper element only if elementName property exists,
 updated breadcrumbs container for helpmode

---
 src/assets/styles/common-breadcrumbs.scss | 43 ++++++++++++-----------
 src/lib/help-mode/help-mode.directive.ts  |  4 ++-
 src/lib/help-mode/help-mode.service.ts    |  4 +--
 3 files changed, 28 insertions(+), 23 deletions(-)

diff --git a/src/assets/styles/common-breadcrumbs.scss b/src/assets/styles/common-breadcrumbs.scss
index 54ebbac..8a29b26 100644
--- a/src/assets/styles/common-breadcrumbs.scss
+++ b/src/assets/styles/common-breadcrumbs.scss
@@ -13,29 +13,32 @@
         min-width: 16px;
     }
 }
+.breadcrumbs {
+    display: flex;
+    align-items: center;
+    .breadcrumb {
+        text-decoration: none;
+        color: var(--iqser-accent);
+        font-weight: 600;
+        width: fit-content;
+        white-space: nowrap;
 
-.breadcrumb {
-    text-decoration: none;
-    color: var(--iqser-accent);
-    font-weight: 600;
-    width: fit-content;
-    white-space: nowrap;
+        &.back {
+            display: flex !important;
+            justify-content: center;
+            align-items: center;
 
-    &.back {
-        display: flex !important;
-        justify-content: center;
-        align-items: center;
+            mat-icon {
+                margin-right: 8px;
+            }
+        }
 
-        mat-icon {
-            margin-right: 8px;
+        &:last-child {
+            @include common-mixins.line-clamp(1);
+        }
+
+        &.active {
+            color: var(--iqser-primary);
         }
     }
-
-    &:last-child {
-        @include common-mixins.line-clamp(1);
-    }
-
-    &.active {
-        color: var(--iqser-primary);
-    }
 }
diff --git a/src/lib/help-mode/help-mode.directive.ts b/src/lib/help-mode/help-mode.directive.ts
index 0cf3b60..a446861 100644
--- a/src/lib/help-mode/help-mode.directive.ts
+++ b/src/lib/help-mode/help-mode.directive.ts
@@ -20,7 +20,9 @@ export class HelpModeDirective implements OnInit {
     }
 
     ngOnInit(): void {
-        this._createHelperElement();
+        if (this.elementName) {
+            this._createHelperElement();
+        }
     }
 
     private _createHelperElement() {
diff --git a/src/lib/help-mode/help-mode.service.ts b/src/lib/help-mode/help-mode.service.ts
index 65f6107..6f3c1f6 100644
--- a/src/lib/help-mode/help-mode.service.ts
+++ b/src/lib/help-mode/help-mode.service.ts
@@ -121,8 +121,8 @@ export class HelpModeService {
     private _getElementDimensions(element: HTMLElement) {
         const rect = element.getBoundingClientRect();
         return {
-            y: rect.top + window.pageYOffset,
-            x: rect.left + window.pageXOffset,
+            y: rect.top,
+            x: rect.left,
             height: rect.height,
             width: rect.width,
         };