Bugfix/fix alignment in menu of impersonation mode (#2284)

* Fix alignment

* Update changelog

CHANGELOG.md

@@ -22,6 +22,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Fixed the alignment in the header navigation
+- Fixed the alignment in the menu of the impersonation mode
 
 ## 1.304.0 - 2023-08-27
 

apps/client/src/app/components/header/header.component.html

@@ -129,33 +129,37 @@
         <mat-menu #accountMenu="matMenu" xPosition="before">
           <ng-container *ngIf="user?.access?.length > 0">
             <button mat-menu-item (click)="impersonateAccount(null)">
-              <ion-icon
+              <span class="align-items-center d-flex">
-                *ngIf="user?.access?.length > 0"
+                <ion-icon
-                class="mr-2"
+                  *ngIf="user?.access?.length > 0"
-                [name]="
+                  class="mr-2"
-                  impersonationId
+                  [name]="
-                    ? 'radio-button-off-outline'
+                    impersonationId
-                    : 'radio-button-on-outline'
+                      ? 'radio-button-off-outline'
-                "
+                      : 'radio-button-on-outline'
-              ></ion-icon>
+                  "
-              <span i18n>Me</span>
+                ></ion-icon>
+                <span i18n>Me</span>
+              </span>
             </button>
             <button
               *ngFor="let accessItem of user?.access"
               mat-menu-item
               (click)="impersonateAccount(accessItem.id)"
             >
-              <ion-icon
+              <span class="align-items-center d-flex">
-                class="mr-2"
+                <ion-icon
-                name="square-outline"
+                  class="mr-2"
-                [name]="
+                  name="square-outline"
-                  accessItem.id === impersonationId
+                  [name]="
-                    ? 'radio-button-on-outline'
+                    accessItem.id === impersonationId
-                    : 'radio-button-off-outline'
+                      ? 'radio-button-on-outline'
-                "
+                      : 'radio-button-off-outline'
-              ></ion-icon>
+                  "
-              <span *ngIf="accessItem.alias">{{ accessItem.alias }}</span>
+                ></ion-icon>
-              <span *ngIf="!accessItem.alias" i18n>User</span>
+                <span *ngIf="accessItem.alias">{{ accessItem.alias }}</span>
+                <span *ngIf="!accessItem.alias" i18n>User</span>
+              </span>
             </button>
             <hr class="m-0" />
           </ng-container>