openaire-library/sharedComponents/bottom.component.html

283 lines
16 KiB
HTML

<ng-template #grant>
<div class="uk-margin-small-top">
<img style="max-width: 42px;" [src]="assetsPath + 'common/commission.jpg'" alt="flag black white low" width="50px" loading="lazy">
</div>
<div class="uk-margin-left">
<helper *ngIf="divContents && divContents['footer']?.length > 0"
[texts]="divContents['footer']"></helper>
<div *ngIf="properties.footerGrantText">
<span class="uk-text-xsmall" [innerHtml]="properties.footerGrantText"></span>
</div>
</div>
</ng-template>
<ng-container *ngIf="shortView;else longView">
<div [ngClass]="background">
<div *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)"
class="uk-padding-small uk-flex uk-flex-middle uk-flex-between">
<div *ngIf="showCommision" class="uk-width-expand">
<div class="uk-flex uk-flex-middle@m uk-flex-top">
<div>
<img style="max-width: 42px;"
[src]="assetsPath + 'common/commission.jpg'"
alt="flag black white low" width="50px" loading="lazy">
</div>
<div class="uk-margin-left">
<helper *ngIf="divContents && divContents['footer']?.length > 0"
[texts]="divContents['footer']"></helper>
<div class="uk-visible@m">
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;"
[innerHtml]="properties.footerGrantText"></span>
</div>
</div>
<div class="uk-text-center uk-hidden@m">
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;"
[innerHtml]="properties.footerGrantText"></span>
</div>
</div>
</div>
</div>
</div>
<div *ngIf="showOpenaire" class="uk-width-1-2 uk-margin-left">
<!-- <img [src]="assetsPath + 'common/Logo_Horizontal_'+(darkBackground?'white':'dark')+'_small.png'" -->
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
</div>
</div>
</ng-container>
<ng-template #longView>
<div class="uk-visible@m">
<div [ngClass]="background">
<div class="uk-section uk-padding-remove-bottom">
<div class="uk-container" [class.uk-container-expand]="!centered" [class.uk-container-small]="centered">
<div class="uk-grid" [class.uk-flex-center]="centered" uk-grid>
<div *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)"
class="uk-width-1-1" [class.uk-width-1-3@m]="!centered"
[attr.uk-grid]="centered?'':null" [class.uk-grid]="centered">
<div *ngIf="showOpenaire" class="uk-text-center uk-margin-bottom uk-width-1-1"
[class.uk-width-1-4@m]="centered">
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
<div *ngIf="showCommision" class="uk-width-expand">
<div class="uk-flex uk-flex-top uk-flex-center">
<ng-container *ngTemplateOutlet="grant"></ng-container>
</div>
</div>
</div>
<div [class.uk-hidden]="centered" class="uk-grid uk-width-expand" uk-grid>
<div *ngIf="showMenuItems" class="uk-width-expand">
<div class="uk-text-right uk-text-center">
<ul class="uk-nav uk-nav-default" uk-nav>
<ng-container *ngFor="let item of menuItems">
<li *ngIf="isEnabled(item.routeRequired, showPage)">
<a *ngIf="item.route.length > 0" routerLink="{{item.route}}"
[queryParams]=item.params>{{item.title}}</a>
<a *ngIf="item.route.length == 0 && item.url.length > 0" href="{{item.url}}"
target="_blank">{{item.title}}</a>
</li>
</ng-container>
</ul>
</div>
</div>
<ng-container *ngIf="!showMenuItems">
<div class="uk-width-1-3">
<div>
<h6>Dashboards</h6>
<ul class="uk-nav uk-nav-default" uk-nav>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'explore.openaire.eu'"
target="_blank">Explore</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'provide.openaire.eu'"
target="_blank">Provide</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'connect.openaire.eu'"
target="_blank">Connect</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'monitor.openaire.eu'"
target="_blank">Monitor</a></li>
<li><a href="https://graph.openaire.eu/develop/" target="_blank">Develop</a></li>
</ul>
</div>
</div>
<div class="uk-width-1-3">
<div>
<h6>Support</h6>
<ul class="uk-nav uk-nav-default" uk-nav>
<li><a target="_blank" href="https://www.openaire.eu/contact-noads">NOADs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/guides">Guides</a></li>
<li><a target="_blank" href="https://www.openaire.eu/faqs">FAQs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/frontpage/webinars">Webinars</a></li>
<li><a target="_blank" href="https://www.openaire.eu/helpdesk">Ask a question</a></li>
</ul>
</div>
</div>
<div class="uk-width-1-3">
<div class="">
<h6>Updates</h6>
<ul class="uk-nav uk-nav-default" uk-nav>
<li><a target="_blank" href="https://www.openaire.eu/news/">News</a></li>
<li><a target="_blank" href="https://www.openaire.eu/events">Events</a></li>
<li><a target="_blank" href="https://www.openaire.eu/blogs/magazine">Blogs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/newsletters">Newsletter</a></li>
<li><a target="_blank" href="https://www.openaire.eu/public-documents">Documents</a></li>
</ul>
</div>
</div>
</ng-container>
</div>
<div *ngIf="showSocialButtons" class="uk-margin-medium-top uk-margin-medium-bottom uk-width-1-1">
<div class="uk-flex uk-flex-middle uk-flex-wrap" [class.uk-flex-center]="centered">
<div class="uk-grid uk-grid-small uk-width-auto@m uk-child-width-auto" uk-grid>
<div>
<a href="https://www.twitter.com/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon uk-icon-button-small twitter">
<icon name="twitter" [flex]="true" visuallyHidden="twitter"></icon>
</a>
</div>
<div>
<a href="https://www.facebook.com/groups/openaire/" target="_blank"
class="uk-icon-button uk-icon-button-small facebook">
<icon name="facebook" [flex]="true" visuallyHidden="facebook"></icon>
</a>
</div>
<div>
<a href="https://www.linkedin.com/groups/3893548/" target="_blank"
class="uk-icon-button uk-icon-button-small linkedin">
<icon name="linkedin" [flex]="true" visuallyHidden="linkedin"></icon>
</a>
</div>
<div>
<a href="https://www.slideshare.net/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon-button-small slideshare">
<icon name="slideshare" [flex]="true" visuallyHidden="slideshare"></icon>
</a>
</div>
<div>
<a href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw" target="_blank"
class="uk-icon-button uk-icon-button-small youtube">
<icon name="youtube" [flex]="true" visuallyHidden="youtube"></icon>
</a>
</div>
</div>
<div class="uk-margin-large-left uk-width-auto">
<a target="_blank" class="uk-flex uk-flex-middle uk-link-text" href="https://www.openaire.eu/newsletters">
<span class="uk-text-large uk-text-bold">Newsletter</span>
<icon name="newsletter" class="uk-margin-small-left" [flex]="true"></icon>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="uk-section uk-section-xsmall uk-container uk-container-large uk-position-relative">
<div class="uk-grid uk-flex-center uk-text-xsmall uk-text-emphasis" uk-grid>
<div class=" uk-flex uk-flex-top">
<a href="https://creativecommons.org/licenses/by/4.0/" rel="license" class="uk-link-reset">
<icon name="cc" [preserveColor]="true" visuallyHidden="Creative-Commons"></icon>
<icon name="by" [preserveColor]="true" visuallyHidden="Licence" class="uk-margin-xsmall-left"></icon>
</a>
<span class="uk-margin-small-left uk-width-expand">Unless otherwise indicated, all materials created by OpenAIRE are licenced under</span>
<a class="uk-link-text uk-margin-medium-left" href="http://creativecommons.org/licenses/by/4.0/" rel="license"><u>CC ATTRIBUTION 4.0 INTERNATIONALLICENSE</u></a>
</div>
</div>
<div class="uk-position-bottom-right uk-margin-bottom uk-margin-large-right">
<a href="#" class="uk-totop uk-display-block" uk-scroll>
<icon name="expand_less" ratio="1.5" [flex]="true" visuallyHidden="toTop"></icon>
</a>
</div>
</div>
</div>
</div>
<div class="uk-hidden@m">
<div [ngClass]="background">
<div class="uk-section uk-padding-remove-bottom">
<div class="uk-container" [class.uk-container-expand]="!centered" [class.uk-container-small]="centered">
<div class="uk-grid" [class.uk-flex-center]="centered" uk-grid>
<div *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)"
class="uk-width-1-1" [attr.uk-grid]="centered?'':null" [class.uk-grid]="centered">
<div *ngIf="showOpenaire" class="uk-text-center uk-margin-bottom uk-width-1-1">
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
<div *ngIf="showCommision" class="uk-width-expand">
<div class="uk-flex uk-flex-top uk-flex-center">
<ng-container *ngTemplateOutlet="grant"></ng-container>
</div>
</div>
</div>
<div *ngIf="showSocialButtons" class="uk-margin-medium-top uk-margin-medium-bottom uk-width-1-1">
<div class="uk-flex uk-flex-middle uk-flex-center uk-flex-wrap">
<div class="uk-grid uk-grid-small uk-flex-center uk-width-1-1 uk-child-width-auto" uk-grid>
<div>
<a href="https://www.twitter.com/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon uk-icon-button-small twitter">
<icon name="twitter" [flex]="true" visuallyHidden="twitter"></icon>
</a>
</div>
<div>
<a href="https://www.facebook.com/groups/openaire/" target="_blank"
class="uk-icon-button uk-icon-button-small facebook">
<icon name="facebook" [flex]="true" visuallyHidden="facebook"></icon>
</a>
</div>
<div>
<a href="https://www.linkedin.com/groups/3893548/" target="_blank"
class="uk-icon-button uk-icon-button-small linkedin">
<icon name="linkedin" [flex]="true" visuallyHidden="linkedin"></icon>
</a>
</div>
<div>
<a href="https://www.slideshare.net/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon-button-small slideshare">
<icon name="slideshare" [flex]="true" visuallyHidden="slideshare"></icon>
</a>
</div>
<div>
<a href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw" target="_blank"
class="uk-icon-button uk-icon-button-small youtube">
<icon name="youtube" [flex]="true" visuallyHidden="youtube"></icon>
</a>
</div>
</div>
<div class="uk-margin-medium-top uk-width-auto">
<a target="_blank" class="uk-flex uk-flex-middle uk-link-text" href="https://www.openaire.eu/newsletters">
<span class="uk-text-large uk-text-bold">Newsletter</span>
<icon name="newsletter" class="uk-margin-small-left" [flex]="true"></icon>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="uk-section uk-section-xsmall uk-container uk-container-large uk-position-relative">
<div class="uk-grid uk-flex-center uk-text-xsmall uk-text-emphasis" uk-grid>
<div class=" uk-flex uk-flex-top">
<a href="https://creativecommons.org/licenses/by/4.0/" rel="license" class="uk-link-reset">
<icon name="cc" [preserveColor]="true" visuallyHidden="Creative-Commons"></icon>
<icon name="by" [preserveColor]="true" visuallyHidden="Licence" class="uk-margin-xsmall-left"></icon>
</a>
<span class="uk-margin-small-left uk-width-expand">Unless otherwise indicated, all materials created by OpenAIRE are licenced under</span>
</div>
<div class="uk-width-1-1 uk-text-center">
<a class="uk-link-text" href="http://creativecommons.org/licenses/by/4.0/" rel="license"><u>CC ATTRIBUTION 4.0 INTERNATIONALLICENSE</u></a>
</div>
</div>
<div class="uk-margin-top uk-flex uk-flex-center">
<a href="#" class="uk-totop" uk-scroll>
<icon name="expand_less" ratio="1.5" [flex]="true" visuallyHidden="toTop"></icon>
</a>
</div>
</div>
</div>
</div>
</ng-template>