1070 hidden field indicator (#747)

* Adding https-icon to svg-library * Adding indicator to private fields
ushahidi · Jan 24, 2024 · 76061e3 · 76061e3
1 parent 27b19fd
commit 76061e3
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 0 deletions.
diff --git a/apps/web-mzima-client/src/app/core/enums/icons.ts b/apps/web-mzima-client/src/app/core/enums/icons.ts
@@ -74,4 +74,5 @@ export enum Icons {
   infoCircle = 'info-circle',
   thumbUp = 'thumb-up',
   ellipses = 'ellipses',
+  https = 'https',
 }
diff --git a/apps/web-mzima-client/src/app/post/post-edit/post-edit.component.html b/apps/web-mzima-client/src/app/post/post-edit/post-edit.component.html
@@ -70,6 +70,13 @@ <h2 class="task-label">{{ task.translations[activeLanguage]?.label || task.label
             *ngFor="let field of task.fields | sortByField : 'priority' : 'asc'; let i = index"
           >
             <mat-label>
+              <mat-icon
+                aria-label="Field responses will be private"
+                *ngIf="field.response_private"
+                icon
+                svgIcon="https"
+                class="field__icon"
+              ></mat-icon>
               {{ field?.translations[activeLanguage]?.label || field?.label }}
               <span class="color-accent" *ngIf="field?.required">*</span>
             </mat-label>

diff --git a/apps/web-mzima-client/src/app/post/post-edit/post-edit.component.scss b/apps/web-mzima-client/src/app/post/post-edit/post-edit.component.scss
@@ -61,6 +61,10 @@
     display: block;
     margin-bottom: 8px;
   }
+  .field__icon {
+    vertical-align: middle;
+    display: inline;
+  }
 }
 
 .tags {

diff --git a/apps/web-mzima-client/src/assets/icons/https.svg b/apps/web-mzima-client/src/assets/icons/https.svg