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

[Library |trunk] 

NavigationBar component:
	- fix logo link issue
	- fix burger menu issue
	- mobile version should show logo in the middle



git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@59540 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
argiro.kokogiannaki 2020-10-09 12:49:12 +00:00
parent c3a87883d9
commit 32bfeebaa2
1 changed files with 6 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
sharedComponents/navigationBar.component.html
View File

@ -19,16 +19,16 @@
<a *ngIf="!offCanvasFlip" class="uk-navbar-toggle" href="#tm-mobile" uk-toggle="" style="z-index:1000;"> <a *ngIf="!offCanvasFlip" class="uk-navbar-toggle" href="#tm-mobile" uk-toggle="" style="z-index:1000;">
<div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"></div> <div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"></div>
</a> </a>
<ng-container *ngIf="showLogo && header.position == 'left'"> <!--<ng-container *ngIf="showLogo && header.position == 'left'">
<ng-container *ngTemplateOutlet="header_template; context: {mobile: true}"></ng-container> <ng-container *ngTemplateOutlet="header_template; context: {mobile: true}"></ng-container>
</ng-container> </ng-container>-->
<div *ngIf="enableSearch && isEnabled([searchRoute], showPage)" <div *ngIf="enableSearch && isEnabled([searchRoute], showPage)"
class=" uk-width-large "> class=" uk-width-large ">
<search-bar [searchPlaceHolder]="searchPlaceHolder" <search-bar [searchPlaceHolder]="searchPlaceHolder"
[searchRoute]="searchRoute" [properties]="properties" [communityId]="communityId"></search-bar> [searchRoute]="searchRoute" [properties]="properties" [communityId]="communityId"></search-bar>
</div> </div>
</div> </div>
<div *ngIf="showLogo && header.position == 'center'" class="uk-navbar-center"> <div *ngIf="showLogo" class="uk-navbar-center">
<ng-container *ngTemplateOutlet="header_template; context: {mobile: true}"></ng-container> <ng-container *ngTemplateOutlet="header_template; context: {mobile: true}"></ng-container>
</div> </div>
<div *ngIf="!onlyTop || userMenu" class="uk-navbar-right"> <div *ngIf="!onlyTop || userMenu" class="uk-navbar-right">
@ -36,15 +36,12 @@
<div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"></div> <div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"></div>
</a> </a>
</div> </div>
<!--div class="uk-navbar-right uk-margin-xlarge-top">
<user-mini></user-mini>
</div-->
</nav> </nav>
<!-- uk-offcanvas="flip: true"--> <!-- if we want to revert the menu - put it on the right -->
</div> </div>
<div *ngIf="specialAnnouncementContent" class="uk-hidden@m" [innerHTML]="specialAnnouncementContent"> <div *ngIf="specialAnnouncementContent" class="uk-hidden@m" [innerHTML]="specialAnnouncementContent">
<div id="tm-mobile" [attr.uk-offcanvas]="(offCanvasFlip?'flip:'+offCanvasFlip:'')" mode="slide" overlay="" </div>
<div id="tm-mobile" [attr.uk-offcanvas]="(offCanvasFlip?'flip:'+offCanvasFlip:'')" mode="slide" overlay=""
class="uk-offcanvas uk-hidden@m" class="uk-offcanvas uk-hidden@m"
style="z-index:9999;"> style="z-index:9999;">
<div class="uk-offcanvas-bar"> <div class="uk-offcanvas-bar">
@ -122,7 +119,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div *ngIf="(['explore','connect','monitor','provide','develop']).indexOf(portal)!=-1" <div *ngIf="(['explore','connect','monitor','provide','develop']).indexOf(portal)!=-1"
class="tm-toolbar custom-{{portal}}-toolbar uk-visible@m"> class="tm-toolbar custom-{{portal}}-toolbar uk-visible@m">
<div class="uk-container uk-flex uk-flex-middle uk-container-expand"> <div class="uk-container uk-flex uk-flex-middle uk-container-expand">
@ -261,7 +257,7 @@
</div> </div>
<ng-template #header_template let-mobile="mobile"> <ng-template #header_template let-mobile="mobile">
<a *ngIf="!header.url" routerLinkActive="uk-link" [routerLink]="header.url" <a *ngIf="!header.url" routerLinkActive="uk-link" [routerLink]="header.route"
class="uk-logo uk-navbar-item"> class="uk-logo uk-navbar-item">
<img *ngIf="(mobile && header.logoSmallUrl) || (!mobile && header.logoUrl)" <img *ngIf="(mobile && header.logoSmallUrl) || (!mobile && header.logoUrl)"
[src]="!mobile?header.logoUrl:header.logoSmallUrl" [src]="!mobile?header.logoUrl:header.logoSmallUrl"