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

Scale header if sticky in monitor page

This commit is contained in:
Konstantinos Triantafyllou 2022-03-17 00:13:52 +02:00
parent 06d032e45c
commit 2188f7da81
3 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/app/monitor/monitor.component.css
View File

@ -2,6 +2,27 @@
min-height: 270px;
}
.stakeholder-info {
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
margin-bottom: 0;
transform-origin: 0 0;
-webkit-transition: -webkit-transform .3s ease-out;
-moz-transition: -moz-transform .3s ease-out;
-o-transition: -o-transform .3s ease-out;
transition: transform .3s ease-out;
}
.uk-active.stakeholder-info {
-moz-transform: scale(0.7);
-webkit-transform: scale(0.7);
-o-transform: scale(0.7);
transform: scale(0.7);
margin-bottom: -40px;
}
.uk-card.semiFiltered, .uk-card.semiFiltered > * > .highcharts-series-group {
opacity: 0.5;
}

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

@ -39,12 +39,11 @@
</ng-template>
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div *ngIf="activeTopic && activeTopic.categories.length > 0" header>
<div class="uk-grid uk-flex-middle uk-margin-top" [class.uk-margin-medium-top]="!stickyPageHeader" uk-grid>
<img [class.uk-hidden]="!stickyPageHeader" [src]="stakeholder | logoUrl" class="uk-width-xsmall">
<img [class.uk-hidden]="stickyPageHeader" [src]="stakeholder | logoUrl" class="uk-width-small">
<div class="uk-flex uk-flex-middle uk-margin-top stakeholder-info" [class.uk-active]="stickyPageHeader">
<img [src]="stakeholder | logoUrl" class="uk-width-small uk-margin-right">
<div class="uk-width-expand">
<div class="uk-margin-remove uk-text-primary-gradient uk-text-bold" [class.uk-text-large]="!stickyPageHeader">Dashboard</div>
<h1 class="uk-h4 uk-margin-remove" [class.uk-h6]="stickyPageHeader">{{stakeholder.name}}</h1>
<div class="uk-margin-remove uk-text-primary-gradient uk-text-bold uk-h6">Dashboard</div>
<h1 class="uk-h4 uk-margin-remove">{{stakeholder.name}}</h1>
</div>
</div>
<div *ngIf="stakeholder && status === errorCodes.DONE && activeTopic" class="uk-margin">

2
src/app/openaireLibrary

@ -1 +1 @@
Subproject commit 1a2925a890260948369f22dd7e5cb899b5727816
Subproject commit e103ced738865ae94b6448985248c4541d7f4a9d