Close button for console added

This commit is contained in:
piotrpekala7
2020-03-30 18:40:55 +02:00
parent d16913a678
commit 2d8c5966cd
2 changed files with 26 additions and 17 deletions

View File

@ -21,23 +21,29 @@
(mousedown)="toggleDragging(true)" (mousedown)="toggleDragging(true)"
[ngStyle]="style"> [ngStyle]="style">
<mat-tab-group [selectedIndex]="selected.value" (selectedIndexChange)="selected.setValue($event)"> <div class="consoleHeader">
<mat-tab> <mat-tab-group class="tabs" [selectedIndex]="selected.value" (selectedIndexChange)="selected.setValue($event)">
<ng-template mat-tab-label> <mat-tab>
<div class="col" style="margin-left: 20px;">GNS3 console</div> <ng-template mat-tab-label>
</ng-template> <div class="col" style="margin-left: 20px;">GNS3 console</div>
</mat-tab> </ng-template>
</mat-tab>
<mat-tab *ngFor="let node of nodes; let index = index" [label]="tab"> <mat-tab *ngFor="let node of nodes; let index = index" [label]="tab">
<ng-template mat-tab-label> <ng-template mat-tab-label>
<div class="col" style="margin-left: 20px;">{{node.name}}</div> <div class="col" style="margin-left: 20px;">{{node.name}}</div>
<button style="color:white" mat-icon-button (click)="removeTab(index)"> <button style="color:white" mat-icon-button (click)="removeTab(index)">
<mat-icon>close</mat-icon> <mat-icon>close</mat-icon>
</button> </button>
</ng-template> </ng-template>
</mat-tab> </mat-tab>
</mat-tab-group> </mat-tab-group>
<button style="color:white" mat-icon-button (click)="close()">
<mat-icon>close</mat-icon>
</button>
</div>
<app-log-console [hidden]="!(selected.value===0)" [server]="server" [project]="project"></app-log-console> <app-log-console [hidden]="!(selected.value===0)" [server]="server" [project]="project"></app-log-console>

View File

@ -33,7 +33,6 @@
.consoleHeader { .consoleHeader {
width: 100%; width: 100%;
height: 30px;
font-size: 12px; font-size: 12px;
overflow: hidden; overflow: hidden;
display: flex; display: flex;
@ -41,6 +40,10 @@
justify-content: space-between; justify-content: space-between;
} }
.tabs {
width: 675px;
}
.console { .console {
width: 596px; width: 596px;
height: 120px; height: 120px;