MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

styling fixes on language and tenant menu

This commit is contained in:
Sofia Papacharalampous 2024-04-05 11:33:49 +03:00
parent f0ec8b5fae
commit 023c0dd7b6
2 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
dmp-frontend/src/app/ui/navbar/navbar.component.html
View File

@ -28,7 +28,7 @@
<mat-icon class="mr-2">language</mat-icon><span class="text-uppercase">{{selectedLanguage}}</span> <mat-icon class="mr-2">language</mat-icon><span class="text-uppercase">{{selectedLanguage}}</span>
<mat-icon>arrow_drop_down</mat-icon> <mat-icon>arrow_drop_down</mat-icon>
</button> </button>
<mat-menu #languageMenu="matMenu" class="lang-parent"> <mat-menu #languageMenu="matMenu" class="nav-mat-menu">
<app-language (languageChange)="getLanguage($event)" class="d-lg-block d-none"></app-language> <app-language (languageChange)="getLanguage($event)" class="d-lg-block d-none"></app-language>
</mat-menu> </mat-menu>
</div> </div>
@ -37,12 +37,12 @@
<mat-icon class="m-0 material-symbols-outlined">tenancy</mat-icon> <mat-icon class="m-0 material-symbols-outlined">tenancy</mat-icon>
<mat-icon class="m-0">arrow_drop_down</mat-icon> <mat-icon class="m-0">arrow_drop_down</mat-icon>
</button> </button>
<mat-menu #tenantMenu="matMenu" class="lang-parent"> <mat-menu #tenantMenu="matMenu" class="nav-mat-menu">
<app-tenant-switch class="d-lg-block d-none"></app-tenant-switch> <app-tenant-switch class="d-lg-block d-none"></app-tenant-switch>
</mat-menu> </mat-menu>
</div> </div>
<div class="col-auto" *ngIf="isAuthenticated() && authentication.hasPermission(authentication.permissionEnum.ViewMineInAppNotificationPage)"> <div class="col-auto" *ngIf="isAuthenticated() && authentication.hasPermission(authentication.permissionEnum.ViewMineInAppNotificationPage)">
<mat-menu #languageMenu="matMenu" class="lang-parent"> <mat-menu #languageMenu="matMenu" class="nav-mat-menu">
<app-language (languageChange)="getLanguage($event)"></app-language> <app-language (languageChange)="getLanguage($event)"></app-language>
</mat-menu> </mat-menu>
<button class="col-auto" mat-icon-button matTooltip="{{'NAV-BAR.INAPP-NOTIFICATIONS' | translate}}" (click)="toggleInAppNotifications()"> <button class="col-auto" mat-icon-button matTooltip="{{'NAV-BAR.INAPP-NOTIFICATIONS' | translate}}" (click)="toggleInAppNotifications()">
@ -87,7 +87,7 @@
<mat-icon class="mr-2">language</mat-icon><span class="text-uppercase">{{selectedLanguage}}</span> <mat-icon class="mr-2">language</mat-icon><span class="text-uppercase">{{selectedLanguage}}</span>
<mat-icon>arrow_drop_down</mat-icon> <mat-icon>arrow_drop_down</mat-icon>
</button> </button>
<mat-menu #languageMenu="matMenu" class="lang-parent"> <mat-menu #languageMenu="matMenu" class="nav-mat-menu">
<app-language (languageChange)="getLanguage($event)"></app-language> <app-language (languageChange)="getLanguage($event)"></app-language>
</mat-menu> </mat-menu>
<ng-container *ngIf="isAuthenticated()"> <ng-container *ngIf="isAuthenticated()">
@ -95,7 +95,7 @@
<mat-icon class="m-0 material-symbols-outlined">tenancy</mat-icon> <mat-icon class="m-0 material-symbols-outlined">tenancy</mat-icon>
<mat-icon class="m-0">arrow_drop_down</mat-icon> <mat-icon class="m-0">arrow_drop_down</mat-icon>
</button> </button>
<mat-menu #tenantMenu="matMenu" class="lang-parent"> <mat-menu #tenantMenu="matMenu" class="nav-mat-menu">
<app-tenant-switch></app-tenant-switch> <app-tenant-switch></app-tenant-switch>
</mat-menu> </mat-menu>
</ng-container> </ng-container>

10
dmp-frontend/src/app/ui/navbar/navbar.component.scss
View File

@ -93,7 +93,7 @@ $mat-card-header-size: 40px !default;
transform: rotate(45deg) translate(-4px, -4px); transform: rotate(45deg) translate(-4px, -4px);
} }
::ng-deep.lang-parent { ::ng-deep.nav-mat-menu {
width: fit-content !important; width: fit-content !important;
min-width: auto !important; min-width: auto !important;
} }
@ -150,4 +150,10 @@ $mat-card-header-size: 40px !default;
padding-top: 1em !important; padding-top: 1em !important;
padding-bottom: 1em !important; padding-bottom: 1em !important;
height: auto !important; height: auto !important;
} }
::ng-deep .nav-mat-menu {
.mat-mdc-menu-content {
padding: 0 !important;
}
}