ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2025-01-20 11:38:59 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Merge pull request #692 from GNS3/remove-extended-ng-classes

Browse Source 
Getters in code instead of extended ngClass in HTML files
This commit is contained in:
piotrpekala7 2020-02-25 15:05:07 +01:00 committed by GitHub
commit 135f37fa92
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/components/project-map/project-map-menu/project-map-menu.component.html
View File

@ -3,7 +3,7 @@
mat-icon-button
class="menu-button"
(click)="addDrawing('text')">
<mat-icon [ngClass]="{unmarkedLight: !drawTools.isTextChosen && isLightThemeEnabled, marked: drawTools.isTextChosen}">create</mat-icon>
<mat-icon [ngClass]="getCssClassForIcon('text')">create</mat-icon>
</button>
<input
type="file"
@ -23,14 +23,14 @@
mat-icon-button
class="menu-button"
(click)="addDrawing('rectangle')">
<mat-icon [ngClass]="{unmarkedLight: !drawTools.isRectangleChosen && isLightThemeEnabled, marked: drawTools.isRectangleChosen}">crop_3_2</mat-icon>
<mat-icon [ngClass]="getCssClassForIcon('rectangle')">crop_3_2</mat-icon>
</button>
<button
matTooltip="Draw an ellipse"
mat-icon-button
class="menu-button"
(click)="addDrawing('ellipse')">
<mat-icon [ngClass]="{unmarkedLight: !drawTools.isEllipseChosen && isLightThemeEnabled, marked: drawTools.isEllipseChosen}">panorama_fish_eye</mat-icon>
<mat-icon [ngClass]="getCssClassForIcon('ellipse')">panorama_fish_eye</mat-icon>
</button>
<button *ngIf="!isLightThemeEnabled"
matTooltip="Draw a line"

18
src/app/components/project-map/project-map-menu/project-map-menu.component.ts
View File

@ -47,6 +47,24 @@ export class ProjectMapMenuComponent implements OnInit, OnDestroy {
this.themeService.getActualTheme() === 'light' ? this.isLightThemeEnabled = true : this.isLightThemeEnabled = false;
}
getCssClassForIcon(type: string) {
if (type === 'text') {
return {
'unmarkedLight': !this.drawTools.isTextChosen && this.isLightThemeEnabled,
'marked': this.drawTools.isTextChosen
};
} else if (type === 'rectangle') {
return {
'unmarkedLight': !this.drawTools.isRectangleChosen && this.isLightThemeEnabled,
'marked': this.drawTools.isRectangleChosen
};
}
return {
'unmarkedLight': !this.drawTools.isEllipseChosen && this.isLightThemeEnabled,
'marked': this.drawTools.isEllipseChosen
};
}
public takeScreenshot() {
const dialogRef = this.dialog.open(ScreenshotDialogComponent, {
width: '400px',