MaDgIK
/
monitor-dashboard
13
0
Fork 0
Code Issues Pull Requests Projects Releases 21 Wiki Activity

Change position of note and fix padding in number indicators

This commit is contained in:
Konstantinos Triantafyllou 2022-11-08 15:35:48 +02:00
parent 8e978b0c9f
commit 7e4e6e6d46
1 changed files with 35 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/app/monitor/monitor.component.html
View File

@ -117,31 +117,33 @@
class="uk-text-bold uk-hidden">{{numberResults.get(i + '-' + j) | number}}</span>
<!-- ----------------- -->
<div *ngIf="indicator.description || indicator.additionalDescription"
class="uk-position-bottom uk-text-center uk-margin-small-bottom">
class="uk-position-bottom-right uk-text-center uk-margin-small-bottom uk-margin-small-right">
<a class="uk-display-inline-block uk-button uk-button-text"
(click)="toggleDescriptionOverlay($event, j)">
<span class="uk-flex uk-flex-middle">
<icon name="analytics" type="outlined" [flex]="true"></icon>
<span class="uk-margin-small-left">Note</span>
</span>
<span class="uk-flex uk-flex-middle">
<icon name="analytics" type="outlined" [flex]="true"></icon>
<span class="uk-margin-small-left">Note</span>
</span>
</a>
</div>
<div *ngIf="showDescriptionOverlay[j] && (indicator.description || indicator.additionalDescription)"
class="indicator-description uk-card uk-card-default uk-flex uk-flex-middle uk-flex-center">
<div class="inner uk-padding-small" click-outside-or-esc
<div class="inner" click-outside-or-esc
(clickOutside)="closeDescriptionOverlay($event, j)">
<div class="uk-flex uk-flex-right">
<button class="uk-close uk-icon" (click)="toggleDescriptionOverlay($event, j)">
<icon name="close" ratio="1"></icon>
</button>
</div>
<div class="uk-padding-small uk-padding-remove-horizontal">
<p *ngIf="indicator.description">
{{indicator.description}}
</p>
<p *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</p>
<div class="uk-padding-small">
<div class="uk-flex uk-flex-right">
<button class="uk-close uk-icon" (click)="toggleDescriptionOverlay($event, j)">
<icon name="close" ratio="1"></icon>
</button>
</div>
<div class="uk-padding-small uk-padding-remove-horizontal">
<p *ngIf="indicator.description">
{{indicator.description}}
</p>
<p *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</p>
</div>
</div>
</div>
</div>
@ -203,20 +205,22 @@
</div>
<div *ngIf="showDescriptionOverlay[j] && (indicator.description || indicator.additionalDescription)"
class="indicator-description uk-card uk-card-default uk-flex uk-flex-middle uk-flex-center">
<div class="inner uk-padding-small" click-outside-or-esc
<div class="inner" click-outside-or-esc
(clickOutside)="closeDescriptionOverlay($event, j)">
<div class="uk-flex uk-flex-right">
<button class="uk-close uk-icon" (click)="toggleDescriptionOverlay($event, j)">
<icon name="close" ratio="1"></icon>
</button>
</div>
<div class="uk-padding-small uk-padding-remove-horizontal">
<p *ngIf="indicator.description">
{{indicator.description}}
</p>
<p *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</p>
<div class="uk-padding-small">
<div class="uk-flex uk-flex-right">
<button class="uk-close uk-icon" (click)="toggleDescriptionOverlay($event, j)">
<icon name="close" ratio="1"></icon>
</button>
</div>
<div class="uk-padding-small uk-padding-remove-horizontal">
<p *ngIf="indicator.description">
{{indicator.description}}
</p>
<p *ngIf="indicator.additionalDescription">
{{indicator.additionalDescription}}
</p>
</div>
</div>
</div>
</div>