Merge pull request #159 from gctools-outilsgc/fix-child-route-translate

adjust input hint button
gctools-outilsgc · Sep 1, 2023 · 3327529 · 3327529
2 parents 4381667 + c1b276d
commit 3327529
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 16 deletions.
diff --git a/src/app/core/helpers/typescript-loader.ts b/src/app/core/helpers/typescript-loader.ts
@@ -16,6 +16,11 @@ export class TypescriptLoader implements TranslateLoader {
       map(response => {
         let obj = response.substring(response.indexOf('{'), response.lastIndexOf('}') + 1);
         const translations = eval(JSON.parse(obj));
+
+        for (const [key, value] of Object.entries(translations.routes)) {
+          translations.routes[key] = encodeURIComponent(`${value}`);
+        }
+
         return translations.default || translations;
       })
     );

diff --git a/src/app/shared/components/input/input.component.html b/src/app/shared/components/input/input.component.html
@@ -1,23 +1,17 @@
 <div class="gcc-input-wrapper">
-
-    <mat-label *ngIf="label">
+    <mat-label *ngIf="label" [ngClass]="disabled ? 'disabled' : ''">
         {{ label }} 
-        <div *ngIf="required" class="required-star">
-            *
-        </div>
+        <div *ngIf="required" class="required-star">*</div>
+        <i *ngIf="hint" 
+           tabindex="0"
+           [ngClass]="{'fa-circle-xmark' : showHint, 'fa-circle-question' : !showHint}" class="fa-regular"
+           [matTooltip]="showHint ? (translations.input.hint.hide.text | translate) : translations.input.hint.show.text | translate"
+           [attr.aria-label]="showHint ? (translations.input.hint.hide.aria | translate) : translations.input.hint.show.aria | translate"
+           [matTooltipPosition]="tooltipDirection.Right"
+           (click)="toggleShowHint()">
+        </i>
     </mat-label>
 
-    <app-button *ngIf="hint"
-                [matButtonType]="materialButtonType.Icon"
-                [tooltip]="showHint ? (translations.input.hint.hide.text | translate) : translations.input.hint.show.text | translate"
-                [ariaLabel]="showHint ? (translations.input.hint.hide.aria | translate) : translations.input.hint.show.aria | translate"
-                [tooltipDirection]="tooltipDirection.Right"
-                [disabled]="disabled"
-                (click)="toggleShowHint()"
-                class="hint-button">
-        <i [ngClass]="showHint ? 'fa-circle-xmark' : 'fa-circle-question'" class="fa-regular"></i>
-    </app-button>
-
     <mat-form-field>
         <input matInput 
                [id]="inputId"

diff --git a/src/app/shared/components/input/input.component.scss b/src/app/shared/components/input/input.component.scss
@@ -14,6 +14,18 @@ mat-label {
         display: inline-block;
         color: $error-red;
     }
+
+    i {
+        margin-left: 5px;
+        cursor: pointer;
+        color: $primary-1;
+    }
+}
+
+mat-label.disabled {
+    .required-star, i {
+        color: $neutral-300 !important;
+    }
 }
 
 mat-form-field {