Merge pull request #52 from KB-iGOT/survey-popup-icon-issye

update for survey popup ourside click
KB-iGOT · Oct 7, 2024 · 4912af0 · 4912af0
2 parents cc7ab3e + 92e50cd
commit 4912af0
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 3 deletions.
diff --git a/...t/ws/app/src/lib/routes/home/components/app-survey/survey-form/survey-form.component.html b/...t/ws/app/src/lib/routes/home/components/app-survey/survey-form/survey-form.component.html
@@ -1,4 +1,4 @@
-<div class="main-survey flex items-center justify-center" *ngIf="isSurveyPopup">
+<div class="main-survey flex items-center justify-center" *ngIf="isSurveyPopup" (click)="clickedOut($event)">
   <div class="surver-inner">
     <a mat-icon-button class="close-button flex" (click)="closeCard()">
       <mat-icon>close</mat-icon>

diff --git a/...t/ws/app/src/lib/routes/home/components/app-survey/survey-form/survey-form.component.scss b/...t/ws/app/src/lib/routes/home/components/app-survey/survey-form/survey-form.component.scss
@@ -15,9 +15,10 @@
 
 .survey-img-link {
     cursor: pointer;
-    width: 80%;
+    width: 100%;
     margin: auto;
     background-color: transparent !important;
+    justify-content: center;
 }
 .close-button {
     cursor: pointer;
@@ -70,7 +71,7 @@
   }
   .surver-inner {
     padding:0;
-    width: 100%;
+    width: 80%;
     overflow: hidden;
   }
 
@@ -84,5 +85,11 @@
     height: auto;
   }
 
+.surver-inner mat-icon {
+  background-color: white;
+  padding: 5px;
+  border-radius: 50%;
+}
+
 
 
diff --git a/...ect/ws/app/src/lib/routes/home/components/app-survey/survey-form/survey-form.component.ts b/...ect/ws/app/src/lib/routes/home/components/app-survey/survey-form/survey-form.component.ts
@@ -50,4 +50,14 @@ export class SurveyFormComponent implements OnInit {
       this.localStorageFlag = false
     }
   }
+
+  clickedOut(event: any) {
+    if (event.target.className.includes("main-survey")) {
+      this.isSurveyPopup = false
+      if (this.localStorageFlag) {
+        localStorage.setItem('surveyPopup', 'false')
+        this.localStorageFlag = false
+      }
+    }
+  }
 }