Skip to content
Snippets Groups Projects
Commit a9d52807 authored by Benjamin Ledel's avatar Benjamin Ledel
Browse files

* adjust dropdown menu

parent 6ca8f9f6
Branches
Tags
No related merge requests found
......@@ -79,37 +79,56 @@
<button nz-button *ngIf="!loggedIn" (click)="handleSSOClick()">Single Sign-On (SSO)</button>
<div *ngIf="loggedIn" class="login-info">
<a nz-dropdown [nzDropdownMenu]="menu" nzTrigger="click">{{ loggedIn.email }}</a>
<a nz-dropdown [nzDropdownMenu]="menu" class="user-email">
{{ loggedIn.email }}
<i nz-icon nzType="down" nzTheme="outline"></i>
</a>
<nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu>
<li nz-menu-item routerLink="/profil">
<fa-icon [icon]="faUser"></fa-icon>
<span i18n="Profile | Header profile dropdown entry @@profileProfileDropDown"
>Profile</span>
<span class="menu-item">
<fa-icon [icon]="faUser" class="menu-icon"></fa-icon>
<span class="menu-text"
i18n="Profile | Header profile dropdown entry @@profileProfileDropDown">
Profile
</span>
</span>
</li>
<li nz-menu-item routerLink="/data-disclosure" *ngIf="environment.pageVisibility.data_disclosure && !loggedIn?.isProvider">
<fa-icon [icon]="faDownload"></fa-icon>
<span
i18n="
Data disclosure | Header profile dropdown entry
@@dataDisclosureProfileDropDown"
>Data disclosure</span>
<li nz-menu-item
routerLink="/data-disclosure"
*ngIf="environment.pageVisibility.data_disclosure && !loggedIn?.isProvider">
<span class="menu-item">
<fa-icon [icon]="faDownload" class="menu-icon"></fa-icon>
<span class="menu-text"
i18n="Data disclosure | Header profile dropdown entry @@dataDisclosureProfileDropDown">
Data disclosure
</span>
</span>
</li>
<li nz-menu-item routerLink="/data-removal" *ngIf="!loggedIn?.isProvider">
<fa-icon [icon]="faTrash"></fa-icon>
<span
i18n="Data removal | Header profile dropdown entry @@dataRemovalProfileDropDown"
>Data removal</span>
<span class="menu-item">
<fa-icon [icon]="faTrash" class="menu-icon"></fa-icon>
<span class="menu-text"
i18n="Data removal | Header profile dropdown entry @@dataRemovalProfileDropDown">
Data removal
</span>
</span>
</li>
<li nz-menu-item (click)="logout()">
<fa-icon [icon]="faSignOutAlt"></fa-icon>
<span i18n="Logout | Header profile dropdown entry @@logoutProfileDropDown"
>Logout</span>
<span class="menu-item">
<fa-icon [icon]="faSignOutAlt" class="menu-icon"></fa-icon>
<span class="menu-text"
i18n="Logout | Header profile dropdown entry @@logoutProfileDropDown">
Logout
</span>
</span>
</li>
</ul>
</nz-dropdown-menu>
</div>
</div>
</div>
</nz-header>
......@@ -20,3 +20,20 @@ nz-header {
background: #FFF;
display: flex;
}
.menu-item {
display: flex;
align-items: center;
padding: 8px 12px;
gap: 12px; // Adds space between icon and text
}
.menu-icon {
font-size: 18px;
color: #595959;
min-width: 22px; // Ensures consistent spacing
}
.menu-text {
font-size: 14px;
font-weight: 500;
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment