Fix styling for new title bar

This commit is contained in:
piotrpekala7 2021-04-08 10:41:03 +02:00
parent 330d004e3b
commit 0e71897317
2 changed files with 9 additions and 4 deletions

View File

@ -11,10 +11,11 @@
<!-- Project Titlebar --> <!-- Project Titlebar -->
<div id="project-titlebar" [ngClass]="{lightTheme: isLightThemeEnabled}"> <div id="project-titlebar" [ngClass]="{lightTheme: isLightThemeEnabled}">
<button matTooltip="Open menu" matTooltipClass="custom-tooltip" mat-icon-button class="gns3-button menu-button" [matMenuTriggerFor]="mainMenu"> <button matTooltip="Open menu" matTooltipClass="custom-tooltip" mat-icon-button class="gns3-button menu-button" [matMenuTriggerFor]="mainMenu">
<mat-icon svgIcon="gns3"></mat-icon> <mat-icon *ngIf="!isLightThemeEnabled" svgIcon="gns3"></mat-icon>
<mat-icon *ngIf="isLightThemeEnabled" svgIcon="gns3black"></mat-icon>
</button> </button>
<div class="project-titlebar-controls"> <div class="project-titlebar-controls">
<div *ngIf="!readonly" class="menu-button-group primary-controls"> <div *ngIf="!readonly" [ngClass]="{lightTheme: isLightThemeEnabled}" class="menu-button-group primary-controls">
<app-template [server]="server" [project]="project" (onNodeCreation)="onNodeCreation($event)"> <app-template [server]="server" [project]="project" (onNodeCreation)="onNodeCreation($event)">
</app-template> </app-template>
<button matTooltip="Add a link" matTooltipClass="custom-tooltip" class="menu-button" mat-icon-button [ngClass]="{selected: tools.draw_link}" [color]="tools.draw_link ? 'primary' : 'basic'" (click)="toggleDrawLineMode()"> <button matTooltip="Add a link" matTooltipClass="custom-tooltip" class="menu-button" mat-icon-button [ngClass]="{selected: tools.draw_link}" [color]="tools.draw_link ? 'primary' : 'basic'" (click)="toggleDrawLineMode()">

View File

@ -45,6 +45,10 @@ g.node:hover {
border-right: 1px solid rgba(255,255,255,0.3); border-right: 1px solid rgba(255,255,255,0.3);
padding-right: 15px; padding-right: 15px;
margin-right: 15px; margin-right: 15px;
&.lightTheme {
border-right: 1px solid black;
}
} }
.menu-button-group { .menu-button-group {
@ -83,10 +87,10 @@ g.node:hover {
} }
&.lightTheme { &.lightTheme {
background-color: #20313b !important; background-color: white !important;
mat-icon { mat-icon {
color: #fff !important; color: black !important;
} }
.selected mat-icon { .selected mat-icon {