merged gold, green and greenVSgold tabs and changed switcher to horizontal
This commit is contained in:
parent
37f5a48719
commit
3538c4c835
|
|
@ -3,9 +3,7 @@
|
|||
<ul uk-tab class="uk-tab-large">
|
||||
<li><a href="#">PID</a></li>
|
||||
<li><a href="#">Licence</a></li>
|
||||
<li><a href="#">Gold</a></li>
|
||||
<li><a href="#">Green</a></li>
|
||||
<li><a href="#">Green vs. Gold</a></li>
|
||||
<li><a href="#">Gold/Green</a></li>
|
||||
<li class="uk-visible@m"><a href="#">More Details</a></li>
|
||||
</ul>
|
||||
|
||||
|
|
@ -243,8 +241,6 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="greenIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
|
|
@ -321,8 +317,6 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="greenVsGoldIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
|
|
|
|||
|
|
@ -1,163 +1,6 @@
|
|||
<div>
|
||||
|
||||
<div>
|
||||
<div class="uk-grid">
|
||||
<div class="uk-width-auto@m">
|
||||
<ul class="uk-tab-left uk-tab-large" uk-tab="connect: #component-tab-left; animation: uk-animation-fade">
|
||||
<li><a href="#">PID</a></li>
|
||||
<li><a href="#">Licence</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-width-expand@m">
|
||||
<ul id="component-tab-left" class="uk-switcher">
|
||||
<li>
|
||||
<div class="pidIndicator">
|
||||
<!-- <div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">-->
|
||||
<div class="uk-grid uk-child-width-1-1">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="datasetsWithPIDTimeline" width="100%" height="550" [src]="datasetsWithPIDTimeline"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-grid-margin">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
<select class="md-input" #selectPIDGroupBy (change)="getDatasetsWithPIDGroupByMobile(selectPIDGroupBy.value)" style="width: 230px; display: inline-block">
|
||||
<option value="datasource">datasource</option>
|
||||
<option value="organization">organization</option>
|
||||
<option value="funder">funder</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<iframe *ngIf="datasetsWithPIDGroupByView==='datasource' && datasetsWithPIDByDatasourceChartURLMobile"
|
||||
width="100%" height="550" [src]="datasetsWithPIDByDatasourceChartURLMobile"></iframe>
|
||||
<iframe *ngIf="datasetsWithPIDGroupByView==='organization' && datasetsWithPIDByOrganizationChartURLMobile"
|
||||
width="100%" height="550" [src]="datasetsWithPIDByOrganizationChartURLMobile"></iframe>
|
||||
<app-treemap-highchart *ngIf="datasetsWithPIDGroupByView==='funder' && datasetsWithPIDByFunderData"
|
||||
[chartTitle]="'OA Datasets with PID by funder'"
|
||||
[chartData]="datasetsWithPIDByFunderData" [color]="datasetColor"></app-treemap-highchart>
|
||||
|
||||
</div>
|
||||
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
<li class="uk-active"><a (click)="getDatasetsWithPIDGroupBy('datasource')">Datasource</a></li>
|
||||
<li><a (click)="getDatasetsWithPIDGroupBy('organization')">Organization</a></li>
|
||||
<li><a (click)="getDatasetsWithPIDGroupBy('funder')">Funder</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="switcher-content-a-fade-publications" class="uk-switcher uk-margin">
|
||||
<li aria-hidden="false" style="animation-duration: 200ms;" class="uk-active">
|
||||
<iframe *ngIf="datasetsWithPIDByDatasourceChartURL"
|
||||
width="100%" height="350" [src]="datasetsWithPIDByDatasourceChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<iframe *ngIf="datasetsWithPIDByOrganizationChartURL"
|
||||
width="100%" height="350" [src]="datasetsWithPIDByOrganizationChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<app-treemap-highchart *ngIf="datasetsWithPIDByFunderData"
|
||||
[chartTitle]="'OA Datasets with PID by funder'"
|
||||
[chartData]="datasetsWithPIDByFunderData" [color]="datasetColor"></app-treemap-highchart>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="licenceIndicator">
|
||||
<!-- <div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">-->
|
||||
<div class="uk-grid uk-child-width-1-1">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="datasetsWithLicenceTimeline" width="100%" height="550" [src]="datasetsWithLicenceTimeline"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-grid-margin">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
<select class="md-input" #selectLicenceGroupBy (change)="getDatasetsWithLicenceGroupByMobile(selectLicenceGroupBy.value)" style="width: 230px; display: inline-block">
|
||||
<option value="datasource">datasource</option>
|
||||
<option value="organization">organization</option>
|
||||
<option value="funder">funder</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<iframe *ngIf="datasetsWithLicenceGroupByView==='datasource' && datasetsWithLicenceByDatasourceChartURLMobile"
|
||||
width="100%" height="550" [src]="datasetsWithLicenceByDatasourceChartURLMobile"></iframe>
|
||||
<iframe *ngIf="datasetsWithLicenceGroupByView==='organization' && datasetsWithLicenceByOrganizationChartURLMobile"
|
||||
width="100%" height="550" [src]="datasetsWithLicenceByOrganizationChartURLMobile"></iframe>
|
||||
<app-treemap-highchart *ngIf="datasetsWithLicenceGroupByView==='funder' && datasetsWithLicenceByFunderData"
|
||||
[chartTitle]="'OA Datasets with licence by funder'"
|
||||
[chartData]="datasetsWithLicenceByFunderData" [color]="datasetColor"></app-treemap-highchart>
|
||||
|
||||
</div>
|
||||
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
<li class="uk-active"><a (click)="getDatasetsWithLicenceGroupBy('datasource')">Datasource</a></li>
|
||||
<li><a (click)="getDatasetsWithLicenceGroupBy('organization')">Organization</a></li>
|
||||
<li><a (click)="getDatasetsWithLicenceGroupBy('funder')">Funder</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="switcher-content-a-fade-publications" class="uk-switcher uk-margin">
|
||||
<li aria-hidden="false" style="animation-duration: 200ms;" class="uk-active">
|
||||
<iframe *ngIf="datasetsWithLicenceByDatasourceChartURL"
|
||||
width="100%" height="350" [src]="datasetsWithLicenceByDatasourceChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<iframe *ngIf="datasetsWithLicenceByOrganizationChartURL"
|
||||
width="100%" height="350" [src]="datasetsWithLicenceByOrganizationChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<app-treemap-highchart *ngIf="datasetsWithLicenceByFunderData"
|
||||
[chartTitle]="'OA Datasets with licence by funder'"
|
||||
[chartData]="datasetsWithLicenceByFunderData" [color]="datasetColor"></app-treemap-highchart>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--<ul uk-tab class="uk-tab-large">
|
||||
<ul uk-tab class="uk-tab-large">
|
||||
<li><a href="#">PID</a></li>
|
||||
<li><a href="#">Licence</a></li>
|
||||
</ul>
|
||||
|
|
@ -179,7 +22,7 @@
|
|||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!–MOBILE & PAD PORTRAIT–>
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
|
|
@ -200,7 +43,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<!–LAPTOP & PAD LANDSCAPE–>
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
|
|
@ -249,7 +92,7 @@
|
|||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!–MOBILE & PAD PORTRAIT–>
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
|
|
@ -270,7 +113,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<!–LAPTOP & PAD LANDSCAPE–>
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
|
|
@ -303,7 +146,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>-->
|
||||
</ul>
|
||||
|
||||
<!-- <div class="pidIndicator">
|
||||
<h3 class="uk-margin-remove">PID</h3>
|
||||
|
|
|
|||
|
|
@ -1,324 +1,9 @@
|
|||
<div>
|
||||
|
||||
<div>
|
||||
<div class="uk-grid">
|
||||
<div class="uk-width-auto@m">
|
||||
<ul class="uk-tab-left uk-tab-large" uk-tab="connect: #component-tab-left; animation: uk-animation-fade">
|
||||
<li><a href="#">PID</a></li>
|
||||
<li><a href="#">Licence</a></li>
|
||||
<li><a href="#">Gold</a></li>
|
||||
<li><a href="#">Green</a></li>
|
||||
<li><a href="#">Green vs. Gold</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-width-expand@m">
|
||||
<ul id="component-tab-left" class="uk-switcher">
|
||||
<li>
|
||||
<div class="pidIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="publicationsWithPIDTimeline" width="100%" height="550" [src]="publicationsWithPIDTimeline"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
<select class="md-input" #selectPIDGroupBy (change)="getPublicationsWithPIDGroupByMobile(selectPIDGroupBy.value)" style="width: 230px; display: inline-block">
|
||||
<option value="datasource">datasource</option>
|
||||
<option value="organization">organization</option>
|
||||
<option value="funder">funder</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<iframe *ngIf="publicationsWithPIDGroupByView==='datasource' && publicationsWithPIDByDatasourceChartURLMobile"
|
||||
width="100%" height="550" [src]="publicationsWithPIDByDatasourceChartURLMobile"></iframe>
|
||||
<iframe *ngIf="publicationsWithPIDGroupByView==='organization' && publicationsWithPIDByOrganizationChartURLMobile"
|
||||
width="100%" height="550" [src]="publicationsWithPIDByOrganizationChartURLMobile"></iframe>
|
||||
<app-treemap-highchart *ngIf="publicationsWithPIDGroupByView==='funder' && publicationsWithPIDByFunderData"
|
||||
[chartTitle]="'OA Publications with PID by funder'"
|
||||
[chartData]="publicationsWithPIDByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
|
||||
</div>
|
||||
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
<li class="uk-active"><a (click)="getPublicationsWithPIDGroupBy('datasource')">Datasource</a></li>
|
||||
<li><a (click)="getPublicationsWithPIDGroupBy('organization')">Organization</a></li>
|
||||
<li><a (click)="getPublicationsWithPIDGroupBy('funder')">Funder</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="switcher-content-a-fade-publications" class="uk-switcher uk-margin">
|
||||
<li aria-hidden="false" style="animation-duration: 200ms;" class="uk-active">
|
||||
<iframe *ngIf="publicationsWithPIDByDatasourceChartURL"
|
||||
width="100%" height="350" [src]="publicationsWithPIDByDatasourceChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<iframe *ngIf="publicationsWithPIDByOrganizationChartURL"
|
||||
width="100%" height="350" [src]="publicationsWithPIDByOrganizationChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<app-treemap-highchart *ngIf="publicationsWithPIDByFunderData"
|
||||
[chartTitle]="'OA Publications with PID by funder'"
|
||||
[chartData]="publicationsWithPIDByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="licenceIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="publicationsWithLicenceTimeline" width="100%" height="550" [src]="publicationsWithLicenceTimeline"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
<select class="md-input" #selectLicenceGroupBy (change)="getPublicationsWithLicenceGroupByMobile(selectLicenceGroupBy.value)" style="width: 230px; display: inline-block">
|
||||
<option value="datasource">datasource</option>
|
||||
<option value="organization">organization</option>
|
||||
<option value="funder">funder</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<iframe *ngIf="publicationsWithLicenceGroupByView==='datasource' && publicationsWithLicenceByDatasourceChartURLMobile"
|
||||
width="100%" height="550" [src]="publicationsWithLicenceByDatasourceChartURLMobile"></iframe>
|
||||
<iframe *ngIf="publicationsWithLicenceGroupByView==='organization' && publicationsWithLicenceByOrganizationChartURLMobile"
|
||||
width="100%" height="550" [src]="publicationsWithLicenceByOrganizationChartURLMobile"></iframe>
|
||||
<app-treemap-highchart *ngIf="publicationsWithLicenceGroupByView==='funder' && publicationsWithLicenceByFunderData"
|
||||
[chartTitle]="'OA Publications with licence by funder'"
|
||||
[chartData]="publicationsWithLicenceByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
|
||||
</div>
|
||||
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
<li class="uk-active"><a (click)="getPublicationsWithLicenceGroupBy('datasource')">Datasource</a></li>
|
||||
<li><a (click)="getPublicationsWithLicenceGroupBy('organization')">Organization</a></li>
|
||||
<li><a (click)="getPublicationsWithLicenceGroupBy('funder')">Funder</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="switcher-content-a-fade-publications" class="uk-switcher uk-margin">
|
||||
<li aria-hidden="false" style="animation-duration: 200ms;" class="uk-active">
|
||||
<iframe *ngIf="publicationsWithLicenceByDatasourceChartURL"
|
||||
width="100%" height="350" [src]="publicationsWithLicenceByDatasourceChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<iframe *ngIf="publicationsWithLicenceByOrganizationChartURL"
|
||||
width="100%" height="350" [src]="publicationsWithLicenceByOrganizationChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<app-treemap-highchart *ngIf="publicationsWithLicenceByFunderData"
|
||||
[chartTitle]="'OA Publications with licence by funder'"
|
||||
[chartData]="publicationsWithLicenceByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="goldIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="goldPublicationsTimeline" width="100%" height="550" [src]="goldPublicationsTimeline"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
<select class="md-input" #selectGoldGroupBy (change)="getGoldPublicationsGroupByMobile(selectGoldGroupBy.value)" style="width: 230px; display: inline-block">
|
||||
<option value="datasource">datasource</option>
|
||||
<option value="organization">organization</option>
|
||||
<option value="funder">funder</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<iframe *ngIf="goldPublicationsGroupByView==='datasource' && goldPublicationsByDatasourceChartURLMobile"
|
||||
width="100%" height="550" [src]="goldPublicationsByDatasourceChartURLMobile"></iframe>
|
||||
<iframe *ngIf="goldPublicationsGroupByView==='organization' && goldPublicationsByOrganizationChartURLMobile"
|
||||
width="100%" height="550" [src]="goldPublicationsByOrganizationChartURLMobile"></iframe>
|
||||
<app-treemap-highchart *ngIf="goldPublicationsGroupByView==='funder' && goldPublicationsByFunderData"
|
||||
[chartTitle]="'Gold OA publications by funder'"
|
||||
[chartData]="goldPublicationsByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
|
||||
</div>
|
||||
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
<li class="uk-active"><a (click)="getGoldPublicationsGroupBy('datasource')">Datasource</a></li>
|
||||
<li><a (click)="getGoldPublicationsGroupBy('organization')">Organization</a></li>
|
||||
<li><a (click)="getGoldPublicationsGroupBy('funder')">Funder</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="switcher-content-a-fade-publications" class="uk-switcher uk-margin">
|
||||
<li aria-hidden="false" style="animation-duration: 200ms;" class="uk-active">
|
||||
<iframe *ngIf="goldPublicationsByDatasourceChartURL"
|
||||
width="100%" height="350" [src]="goldPublicationsByDatasourceChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<iframe *ngIf="goldPublicationsByOrganizationChartURL"
|
||||
width="100%" height="350" [src]="goldPublicationsByOrganizationChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<app-treemap-highchart *ngIf="goldPublicationsByFunderData"
|
||||
[chartTitle]="'Gold OA publications by funder'"
|
||||
[chartData]="goldPublicationsByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="greenIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="greenPublicationsTimeline" width="100%" height="550" [src]="greenPublicationsTimeline"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
<select class="md-input" #selectGreenGroupBy (change)="getGreenPublicationsGroupByMobile(selectGreenGroupBy.value)" style="width: 230px; display: inline-block">
|
||||
<option value="datasource">datasource</option>
|
||||
<option value="organization">organization</option>
|
||||
<option value="funder">funder</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<iframe *ngIf="greenPublicationsGroupByView==='datasource' && greenPublicationsByDatasourceChartURLMobile"
|
||||
width="100%" height="550" [src]="greenPublicationsByDatasourceChartURLMobile"></iframe>
|
||||
<iframe *ngIf="greenPublicationsGroupByView==='organization' && greenPublicationsByOrganizationChartURLMobile"
|
||||
width="100%" height="550" [src]="greenPublicationsByOrganizationChartURLMobile"></iframe>
|
||||
<app-treemap-highchart *ngIf="greenPublicationsGroupByView==='funder' && greenPublicationsByFunderData"
|
||||
[chartTitle]="'Green OA publications by funder'"
|
||||
[chartData]="greenPublicationsByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
|
||||
</div>
|
||||
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
<li class="uk-active"><a (click)="getGreenPublicationsGroupBy('datasource')">Datasource</a></li>
|
||||
<li><a (click)="getGreenPublicationsGroupBy('organization')">Organization</a></li>
|
||||
<li><a (click)="getGreenPublicationsGroupBy('funder')">Funder</a></li>
|
||||
</ul>
|
||||
|
||||
<ul id="switcher-content-a-fade-publications" class="uk-switcher uk-margin">
|
||||
<li aria-hidden="false" style="animation-duration: 200ms;" class="uk-active">
|
||||
<iframe *ngIf="greenPublicationsByDatasourceChartURL"
|
||||
width="100%" height="350" [src]="greenPublicationsByDatasourceChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<iframe *ngIf="greenPublicationsByOrganizationChartURL"
|
||||
width="100%" height="350" [src]="greenPublicationsByOrganizationChartURL"></iframe>
|
||||
</li>
|
||||
<li aria-hidden="true" style="animation-duration: 200ms;" class="">
|
||||
<app-treemap-highchart *ngIf="greenPublicationsByFunderData"
|
||||
[chartTitle]="'Green OA publications by funder'"
|
||||
[chartData]="greenPublicationsByFunderData" [color]="publicationColor"></app-treemap-highchart>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="greenVsGoldIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
<div class="">
|
||||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
<iframe *ngIf="greenVsGoldPublicationsChartURL" width="100%" height="550" [src]="greenVsGoldPublicationsChartURL"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--<ul uk-tab class="uk-tab-large">
|
||||
<ul uk-tab class="uk-tab-large">
|
||||
<li><a href="#">PID</a></li>
|
||||
<li><a href="#">Licence</a></li>
|
||||
<li><a href="#">Gold</a></li>
|
||||
<li><a href="#">Green</a></li>
|
||||
<li><a href="#">Green vs. Gold</a></li>
|
||||
<li><a href="#">Gold/Green</a></li>
|
||||
</ul>
|
||||
|
||||
<ul class="uk-switcher uk-margin">
|
||||
|
|
@ -338,7 +23,7 @@
|
|||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!–MOBILE & PAD PORTRAIT–>
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
|
|
@ -359,7 +44,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<!–LAPTOP & PAD LANDSCAPE–>
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
|
|
@ -408,7 +93,7 @@
|
|||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!–MOBILE & PAD PORTRAIT–>
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
|
|
@ -429,7 +114,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<!–LAPTOP & PAD LANDSCAPE–>
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
|
|
@ -478,7 +163,7 @@
|
|||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!–MOBILE & PAD PORTRAIT–>
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
|
|
@ -499,7 +184,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<!–LAPTOP & PAD LANDSCAPE–>
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
|
|
@ -531,8 +216,6 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="greenIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
|
|
@ -548,7 +231,7 @@
|
|||
<div class="md-card chartCard">
|
||||
<div class="md-card-content">
|
||||
|
||||
<!–MOBILE & PAD PORTRAIT–>
|
||||
<!--MOBILE & PAD PORTRAIT-->
|
||||
<div class="uk-hidden@m">
|
||||
<div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
|
||||
<label class="uk-margin-right">Show by: </label>
|
||||
|
|
@ -569,7 +252,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<!–LAPTOP & PAD LANDSCAPE–>
|
||||
<!--LAPTOP & PAD LANDSCAPE-->
|
||||
<div class="uk-visible@m">
|
||||
<ul class="uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
|
||||
data-uk-switcher="{connect:'#switcher-content-a-fade-publications', animation: 'fade'}">
|
||||
|
|
@ -601,8 +284,6 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="greenVsGoldIndicator">
|
||||
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
|
||||
|
||||
|
|
@ -617,7 +298,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>-->
|
||||
</ul>
|
||||
|
||||
<!-- <!–PID–>
|
||||
<div class="pidIndicator">
|
||||
|
|
|
|||
Loading…
Reference in New Issue