MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add scale up animation for logo

This commit is contained in:
Konstantinos Triantafyllou 2022-08-04 16:46:42 +03:00
parent 6a7559a3ad
commit a33226250b
3 changed files with 3 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
sharedComponents/navigation.component.less
View File

@ -1,18 +0,0 @@
@keyframes animation-logo {
0% {
transform: translateY(100%);
opacity: 0;
}
50% {
transform: translateY(30%);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}
.animation-logo {
animation-name: animation-logo;
}

4
sharedComponents/navigationBar.component.html
View File

@ -266,7 +266,7 @@
</div>
<ng-template #header_template let-mobile="mobile">
<a *ngIf="!activeHeader.url" [routerLink]="activeHeader.route" [class.uk-padding-remove]="!isHeaderLeft"
class="uk-logo uk-navbar-item uk-flex uk-flex-middle uk-animation-fast" [class.animation-logo]="replaceHeader" [class.uk-animation-fade]="!replaceHeader">
class="uk-logo uk-navbar-item uk-flex uk-flex-middle uk-animation-scale-up">
<img *ngIf="(mobile && activeHeader.logoSmallUrl) || (!mobile && activeHeader.logoUrl)"
[src]="!mobile?activeHeader.logoUrl:activeHeader.logoSmallUrl"
[alt]="activeHeader.title">
@ -278,7 +278,7 @@
</ng-container>
</a>
<a *ngIf="activeHeader.url" [href]="activeHeader.url" [class.uk-padding-remove]="!isHeaderLeft"
class="uk-logo uk-navbar-item uk-flex uk-flex-middle uk-animation-fast" [class.animation-logo]="replaceHeader" [class.uk-animation-fade]="!replaceHeader">
class="uk-logo uk-navbar-item uk-flex uk-flex-middle uk-animation-scale-up">
<img *ngIf="(mobile && activeHeader.logoSmallUrl) || (!mobile && activeHeader.logoUrl)"
[src]="!mobile?activeHeader.logoUrl:activeHeader.logoSmallUrl"
[alt]="activeHeader.title">

3
sharedComponents/navigationBar.component.ts
View File

@ -27,8 +27,7 @@ export interface Header {
@Component({
selector: 'navbar',
templateUrl: 'navigationBar.component.html',
styleUrls: ['navigation.component.less']
templateUrl: 'navigationBar.component.html'
})
export class NavigationBarComponent implements OnInit, OnDestroy {
@Input() portal: string = 'connect';