Project

General

Profile

1
<div *ngIf="indicator && indicator=='gold-green'" class="goldGreenIndicator">
2

    
3
  <div class="uk-grid uk-grid-margin">
4
    <div class="uk-width-3-4@l uk-width-1-1@m uk-width-1-1@s">
5
      <div class="md-card chartCard">
6
        <div class="md-card-content">
7
          <iframe *ngIf="publicationsWithGoldGreenTimeline" width="100%" height="550" [src]="publicationsWithGoldGreenTimeline"></iframe>
8
        </div>
9
      </div>
10
    </div>
11
  </div>
12

    
13
  <div class="uk-grid uk-grid-margin">
14
    <div class="uk-width-3-4@l uk-width-1-1@m uk-width-1-1@s">
15
      <div class="md-card chartCard">
16
        <div class="md-card-content">
17

    
18
          <!--MOBILE & PAD PORTRAIT-->
19
          <div class="uk-hidden@m">
20
            <div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
21
              <label class="uk-margin-right">Show by: </label>
22
              <select class="md-input" #selectGoldGreenGroupBy (change)="getPublicationsWithGoldGreenGroupByMobile(selectGoldGreenGroupBy.value)" style="display: inline-block">
23
                <option value="country">country</option>
24
                <option value="datasource">datasource</option>
25
                <option value="organization">organization</option>
26
                <option value="funder">funder</option>
27
              </select>
28
            </div>
29

    
30
            <iframe *ngIf="publicationsWithGoldGreenGroupByView==='country' && publicationsWithGoldGreenByCountryChartURLMobile"
31
                    width="100%" height="550" [src]="publicationsWithGoldGreenByCountryChartURLMobile"></iframe>
32
            <iframe *ngIf="publicationsWithGoldGreenGroupByView==='datasource' && publicationsWithGoldGreenByDatasourceChartURL"
33
                    width="100%" height="550" [src]="publicationsWithGoldGreenByDatasourceChartURL"></iframe>
34
            <iframe *ngIf="publicationsWithGoldGreenGroupByView==='organization' && publicationsWithGoldGreenByOrganizationChartURL"
35
                    width="100%" height="550" [src]="publicationsWithGoldGreenByOrganizationChartURL"></iframe>
36
            <iframe *ngIf="publicationsWithGoldGreenGroupByView==='funder' && publicationsWithGoldGreenByFunderChartURL"
37
                    width="100%" height="550" [src]="publicationsWithGoldGreenByFunderChartURL"></iframe>
38

    
39

    
40
          </div>
41

    
42
          <!--LAPTOP & PAD LANDSCAPE-->
43
          <div class="uk-visible@m">
44
            <ul class="group-by-cdof uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
45
                data-uk-switcher="{connect:'#switcher-content-a-fade-publications-gold-green', animation: 'fade'}">
46
              <li class="uk-active"><a (click)="getPublicationsWithGoldGreenGroupBy('country')">Country</a></li>
47
              <li><a (click)="getPublicationsWithGoldGreenGroupBy('datasource')">Datasource</a></li>
48
              <li><a (click)="getPublicationsWithGoldGreenGroupBy('organization')">Organization</a></li>
49
              <li><a (click)="getPublicationsWithGoldGreenGroupBy('funder')">Funder</a></li>
50
            </ul>
51

    
52
            <ul id="switcher-content-a-fade-publications-gold-green" class="uk-switcher uk-margin">
53
              <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
54
                <iframe *ngIf="publicationsWithGoldGreenByCountryChartURL"
55
                        width="100%" height="650" [src]="publicationsWithGoldGreenByCountryChartURL"></iframe>
56
              </li>
57
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
58
                <iframe *ngIf="publicationsWithGoldGreenByDatasourceChartURL"
59
                        width="100%" height="650" [src]="publicationsWithGoldGreenByDatasourceChartURL"></iframe>
60
              </li>
61
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
62
                <iframe *ngIf="publicationsWithGoldGreenByOrganizationChartURL"
63
                        width="100%" height="650" [src]="publicationsWithGoldGreenByOrganizationChartURL"></iframe>
64
              </li>
65
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
66
                <iframe *ngIf="publicationsWithGoldGreenByFunderChartURL"
67
                        width="100%" height="650" [src]="publicationsWithGoldGreenByFunderChartURL" [height]="650"></iframe>
68
              </li>
69
            </ul>
70
          </div>
71

    
72
        </div>
73
      </div>
74
    </div>
75
  </div>
76

    
77
</div>
78

    
79
<div *ngIf="indicator && indicator=='abstract'" class="abstractIndicator">
80

    
81
  <div class="uk-grid uk-grid-margin">
82
    <div class="uk-width-3-4@l uk-width-1-1@m uk-width-1-1@s">
83
      <div class="md-card chartCard">
84
        <div class="md-card-content">
85
          <iframe *ngIf="publicationsWithAbstractTimeline" width="100%" height="550" [src]="publicationsWithAbstractTimeline"></iframe>
86
        </div>
87
      </div>
88
    </div>
89
  </div>
90

    
91
  <div class="uk-grid uk-grid-margin">
92
    <div class="uk-width-3-4@l uk-width-1-1@m uk-width-1-1@s">
93
      <div class="md-card chartCard">
94
        <div class="md-card-content">
95

    
96
          <!--MOBILE & PAD PORTRAIT-->
97
          <div class="uk-hidden@m">
98
            <div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
99
              <label class="uk-margin-right">Show by: </label>
100
              <select class="md-input" #selectAbstractGroupBy (change)="getPublicationsWithAbstractGroupByMobile(selectAbstractGroupBy.value)" style="display: inline-block">
101
                <option value="country">country</option>
102
                <option value="datasource">datasource</option>
103
                <option value="organization">organization</option>
104
                <option value="funder">funder</option>
105
              </select>
106
            </div>
107

    
108
            <iframe *ngIf="publicationsWithAbstractGroupByView==='country' && publicationsWithAbstractByCountryChartURLMobile"
109
                    width="100%" height="550" [src]="publicationsWithAbstractByCountryChartURLMobile"></iframe>
110
            <iframe *ngIf="publicationsWithAbstractGroupByView==='datasource' && publicationsWithAbstractByDatasourceChartURL"
111
                    width="100%" height="550" [src]="publicationsWithAbstractByDatasourceChartURL"></iframe>
112
            <iframe *ngIf="publicationsWithAbstractGroupByView==='organization' && publicationsWithAbstractByOrganizationChartURL"
113
                    width="100%" height="550" [src]="publicationsWithAbstractByOrganizationChartURL"></iframe>
114
            <app-treemap-highchart *ngIf="publicationsWithAbstractGroupByView==='funder' && publicationsWithAbstractByFunderData"
115
                                   [chartTitle]="'Open Access publications with abstract'" [chartSubtitle]="'by funder (top funders)'"
116
                                   [chartData]="publicationsWithAbstractByFunderData" [color]="publicationColor"></app-treemap-highchart>
117

    
118
          </div>
119

    
120
          <!--LAPTOP & PAD LANDSCAPE-->
121
          <div class="uk-visible@m">
122
            <ul class="group-by-cdof uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
123
                data-uk-switcher="{connect:'#switcher-content-a-fade-publications-abstract', animation: 'fade'}">
124
              <li class="uk-active"><a (click)="getPublicationsWithAbstractGroupBy('country')">Country</a></li>
125
              <li><a (click)="getPublicationsWithAbstractGroupBy('datasource')">Datasource</a></li>
126
              <li><a (click)="getPublicationsWithAbstractGroupBy('organization')">Organization</a></li>
127
              <li><a (click)="getPublicationsWithAbstractGroupBy('funder')">Funder</a></li>
128
            </ul>
129

    
130
            <ul id="switcher-content-a-fade-publications-abstract" class="uk-switcher uk-margin">
131
              <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
132
                <iframe *ngIf="publicationsWithAbstractByCountryChartURL"
133
                        width="100%" height="650" [src]="publicationsWithAbstractByCountryChartURL"></iframe>
134
              </li>
135
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
136
                <iframe *ngIf="publicationsWithAbstractByDatasourceChartURL"
137
                        width="100%" height="650" [src]="publicationsWithAbstractByDatasourceChartURL"></iframe>
138
              </li>
139
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
140
                <iframe *ngIf="publicationsWithAbstractByOrganizationChartURL"
141
                        width="100%" height="650" [src]="publicationsWithAbstractByOrganizationChartURL"></iframe>
142
              </li>
143
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
144
                <app-treemap-highchart *ngIf="publicationsWithAbstractByFunderData"
145
                                       [chartTitle]="'Open Access publications with abstract'" [chartSubtitle]="'by funder (top funders)'"
146
                                       [chartData]="publicationsWithAbstractByFunderData" [color]="publicationColor" [height]="650"></app-treemap-highchart>
147
              </li>
148
            </ul>
149
          </div>
150

    
151
        </div>
152
      </div>
153
    </div>
154
  </div>
155

    
156
</div>
157

    
158
<div *ngIf="indicator && indicator=='licence'" class="licenceIndicator">
159
  <div class="uk-grid uk-grid-match uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">
160

    
161
    <div class="uk-grid-margin">
162
      <div class="md-card chartCard">
163
        <div class="md-card-content">
164
          <iframe *ngIf="publicationsWithLicenceTimeline" width="100%" height="550" [src]="publicationsWithLicenceTimeline"></iframe>
165
        </div>
166
      </div>
167
    </div>
168

    
169
    <div class="uk-grid-margin">
170
      <div class="md-card chartCard">
171
        <div class="md-card-content">
172
          <iframe *ngIf="publicationsWithCCLicenceTimeline" width="100%" height="550" [src]="publicationsWithCCLicenceTimeline"></iframe>
173
        </div>
174
      </div>
175
    </div>
176

    
177
    <div class="uk-grid-margin">
178
      <div class="md-card chartCard">
179
        <div class="md-card-content">
180

    
181
          <!--MOBILE & PAD PORTRAIT-->
182
          <div class="uk-hidden@m">
183
            <div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
184
              <label class="uk-margin-right">Show by: </label>
185
              <select class="md-input" #selectLicenceGroupBy (change)="getPublicationsWithLicenceGroupByMobile(selectLicenceGroupBy.value)" style="display: inline-block">
186
                <option value="country">country</option>
187
                <option value="datasource">datasource</option>
188
                <option value="organization">organization</option>
189
                <option value="funder">funder</option>
190
              </select>
191
            </div>
192

    
193
            <iframe *ngIf="publicationsWithLicenceGroupByView==='country' && publicationsWithLicenceByCountryChartURLMobile"
194
                    width="100%" height="550" [src]="publicationsWithLicenceByCountryChartURLMobile"></iframe>
195
            <iframe *ngIf="publicationsWithLicenceGroupByView==='datasource' && publicationsWithLicenceByDatasourceChartURL"
196
                    width="100%" height="550" [src]="publicationsWithLicenceByDatasourceChartURL"></iframe>
197
            <iframe *ngIf="publicationsWithLicenceGroupByView==='organization' && publicationsWithLicenceByOrganizationChartURL"
198
                    width="100%" height="550" [src]="publicationsWithLicenceByOrganizationChartURL"></iframe>
199
            <app-treemap-highchart *ngIf="publicationsWithLicenceGroupByView==='funder' && publicationsWithLicenceByFunderData"
200
                                   [chartTitle]="'Open Access publications with licence'" [chartSubtitle]="'by funder (top funders)'"
201
                                   [chartData]="publicationsWithLicenceByFunderData" [color]="publicationColor"></app-treemap-highchart>
202

    
203
          </div>
204

    
205
          <!--LAPTOP & PAD LANDSCAPE-->
206
          <div class="uk-visible@m">
207
            <ul class="group-by-cdof uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
208
                data-uk-switcher="{connect:'#switcher-content-a-fade-publications-licence', animation: 'fade'}">
209
              <li class="uk-active"><a (click)="getPublicationsWithLicenceGroupBy('country')">Country</a></li>
210
              <li><a (click)="getPublicationsWithLicenceGroupBy('datasource')">Datasource</a></li>
211
              <li><a (click)="getPublicationsWithLicenceGroupBy('organization')">Organization</a></li>
212
              <li><a (click)="getPublicationsWithLicenceGroupBy('funder')">Funder</a></li>
213
            </ul>
214

    
215
            <ul id="switcher-content-a-fade-publications-licence" class="uk-switcher uk-margin">
216
              <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
217
                <iframe *ngIf="publicationsWithLicenceByCountryChartURL"
218
                        width="100%" height="650" [src]="publicationsWithLicenceByCountryChartURL"></iframe>
219
              </li>
220
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
221
                <iframe *ngIf="publicationsWithLicenceByDatasourceChartURL"
222
                        width="100%" height="650" [src]="publicationsWithLicenceByDatasourceChartURL"></iframe>
223
              </li>
224
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
225
                <iframe *ngIf="publicationsWithLicenceByOrganizationChartURL"
226
                        width="100%" height="650" [src]="publicationsWithLicenceByOrganizationChartURL"></iframe>
227
              </li>
228
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
229
                <app-treemap-highchart *ngIf="publicationsWithLicenceByFunderData"
230
                                       [chartTitle]="'Open Access publications with licence'" [chartSubtitle]="'by funder (top funders)'"
231
                                       [chartData]="publicationsWithLicenceByFunderData" [color]="publicationColor" [height]="650"></app-treemap-highchart>
232
              </li>
233
            </ul>
234
          </div>
235

    
236
        </div>
237
      </div>
238
    </div>
239

    
240
    <div class="uk-grid-margin">
241
      <div class="md-card chartCard">
242
        <div class="md-card-content">
243

    
244
          <!--MOBILE & PAD PORTRAIT-->
245
          <div class="uk-hidden@m">
246
            <div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
247
              <label class="uk-margin-right">Show by: </label>
248
              <select class="md-input" #selectCCLicenceGroupBy (change)="getPublicationsWithCCLicenceGroupByMobile(selectCCLicenceGroupBy.value)" style="display: inline-block">
249
                <option value="country">country</option>
250
                <option value="datasource">datasource</option>
251
                <option value="organization">organization</option>
252
                <option value="funder">funder</option>
253
              </select>
254
            </div>
255

    
256
            <iframe *ngIf="publicationsWithCCLicenceGroupByView==='country' && publicationsWithCCLicenceByCountryChartURLMobile"
257
                    width="100%" height="550" [src]="publicationsWithCCLicenceByCountryChartURLMobile"></iframe>
258
            <iframe *ngIf="publicationsWithCCLicenceGroupByView==='datasource' && publicationsWithCCLicenceByDatasourceChartURL"
259
                    width="100%" height="550" [src]="publicationsWithCCLicenceByDatasourceChartURL"></iframe>
260
            <iframe *ngIf="publicationsWithCCLicenceGroupByView==='organization' && publicationsWithCCLicenceByOrganizationChartURL"
261
                    width="100%" height="550" [src]="publicationsWithCCLicenceByOrganizationChartURL"></iframe>
262
            <app-treemap-highchart *ngIf="publicationsWithCCLicenceGroupByView==='funder' && publicationsWithCCLicenceByFunderData"
263
                                   [chartTitle]="'Open Access publications with CC licence'" [chartSubtitle]="'by funder (top funders)'"
264
                                   [chartData]="publicationsWithCCLicenceByFunderData" [color]="publicationColor"></app-treemap-highchart>
265

    
266
          </div>
267

    
268
          <!--LAPTOP & PAD LANDSCAPE-->
269
          <div class="uk-visible@m">
270
            <ul class="group-by-cdof uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
271
                data-uk-switcher="{connect:'#switcher-content-a-fade-publications-cc-licence', animation: 'fade'}">
272
              <li class="uk-active"><a (click)="getPublicationsWithCCLicenceGroupBy('country')">Country</a></li>
273
              <li><a (click)="getPublicationsWithCCLicenceGroupBy('datasource')">Datasource</a></li>
274
              <li><a (click)="getPublicationsWithCCLicenceGroupBy('organization')">Organization</a></li>
275
              <li><a (click)="getPublicationsWithCCLicenceGroupBy('funder')">Funder</a></li>
276
            </ul>
277

    
278
            <ul id="switcher-content-a-fade-publications-cc-licence" class="uk-switcher uk-margin">
279
              <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
280
                <iframe *ngIf="publicationsWithCCLicenceByCountryChartURL"
281
                        width="100%" height="650" [src]="publicationsWithCCLicenceByCountryChartURL"></iframe>
282
              </li>
283
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
284
                <iframe *ngIf="publicationsWithCCLicenceByDatasourceChartURL"
285
                        width="100%" height="650" [src]="publicationsWithCCLicenceByDatasourceChartURL"></iframe>
286
              </li>
287
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
288
                <iframe *ngIf="publicationsWithCCLicenceByOrganizationChartURL"
289
                        width="100%" height="650" [src]="publicationsWithCCLicenceByOrganizationChartURL"></iframe>
290
              </li>
291
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
292
                <app-treemap-highchart *ngIf="publicationsWithCCLicenceByFunderData"
293
                                       [chartTitle]="'Open Access publications with CC licence'" [chartSubtitle]="'by funder (top funders)'"
294
                                       [chartData]="publicationsWithCCLicenceByFunderData" [color]="publicationColor" [height]="650"></app-treemap-highchart>
295
              </li>
296
            </ul>
297
          </div>
298

    
299
        </div>
300
      </div>
301
    </div>
302

    
303
  </div>
304
</div>
305

    
306
<div *ngIf="indicator && indicator=='pid'" class="pidIndicator">
307

    
308
  <div class="uk-grid uk-grid-margin">
309
    <div class="uk-width-3-4@l uk-width-1-1@m uk-width-1-1@s">
310
      <div class="md-card chartCard">
311
        <div class="md-card-content">
312
          <iframe *ngIf="publicationsWithPIDTimeline" width="100%" height="550" [src]="publicationsWithPIDTimeline"></iframe>
313
        </div>
314
      </div>
315
    </div>
316
  </div>
317

    
318
  <div class="uk-grid uk-grid-margin">
319
    <div class="uk-width-3-4@l uk-width-1-1@m uk-width-1-1@s">
320
      <div class="md-card chartCard">
321
        <div class="md-card-content">
322

    
323
          <!--MOBILE & PAD PORTRAIT-->
324
          <div class="uk-hidden@m">
325
            <div class="uk-flex uk-flex-right uk-flex-middle uk-margin-bottom">
326
              <label class="uk-margin-right">Show by: </label>
327
              <select class="md-input" #selectPIDGroupBy (change)="getPublicationsWithPIDGroupByMobile(selectPIDGroupBy.value)" style="display: inline-block">
328
                <option value="country">country</option>
329
                <option value="datasource">datasource</option>
330
                <option value="organization">organization</option>
331
                <option value="funder">funder</option>
332
              </select>
333
            </div>
334

    
335
            <iframe *ngIf="publicationsWithPIDGroupByView==='country' && publicationsWithPIDByCountryChartURLMobile"
336
                    width="100%" height="550" [src]="publicationsWithPIDByCountryChartURLMobile"></iframe>
337
            <iframe *ngIf="publicationsWithPIDGroupByView==='datasource' && publicationsWithPIDByDatasourceChartURL"
338
                    width="100%" height="550" [src]="publicationsWithPIDByDatasourceChartURL"></iframe>
339
            <iframe *ngIf="publicationsWithPIDGroupByView==='organization' && publicationsWithPIDByOrganizationChartURL"
340
                    width="100%" height="550" [src]="publicationsWithPIDByOrganizationChartURL"></iframe>
341
            <app-treemap-highchart *ngIf="publicationsWithPIDGroupByView==='funder' && publicationsWithPIDByFunderData"
342
                                   [chartTitle]="'Open Access publications with PID'" [chartSubtitle]="'by funder (top funders)'"
343
                                   [chartData]="publicationsWithPIDByFunderData" [color]="publicationColor"></app-treemap-highchart>
344

    
345
          </div>
346

    
347
          <!--LAPTOP & PAD LANDSCAPE-->
348
          <div class="uk-visible@m">
349
            <ul class="group-by-cdof uk-subnav uk-subnav-pill uk-flex uk-flex-right uk-flex-middle uk-margin-bottom" uk-margin
350
                data-uk-switcher="{connect:'#switcher-content-a-fade-publications-pid', animation: 'fade'}">
351
              <li class="uk-active"><a (click)="getPublicationsWithPIDGroupBy('country')">Country</a></li>
352
              <li><a (click)="getPublicationsWithPIDGroupBy('datasource')">Datasource</a></li>
353
              <li><a (click)="getPublicationsWithPIDGroupBy('organization')">Organization</a></li>
354
              <li><a (click)="getPublicationsWithPIDGroupBy('funder')">Funder</a></li>
355
            </ul>
356

    
357
            <ul id="switcher-content-a-fade-publications-pid" class="uk-switcher uk-margin">
358
              <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
359
                <iframe *ngIf="publicationsWithPIDByCountryChartURL"
360
                        width="100%" height="650" [src]="publicationsWithPIDByCountryChartURL"></iframe>
361
              </li>
362
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
363
                <iframe *ngIf="publicationsWithPIDByDatasourceChartURL"
364
                        width="100%" height="650" [src]="publicationsWithPIDByDatasourceChartURL"></iframe>
365
              </li>
366
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
367
                <iframe *ngIf="publicationsWithPIDByOrganizationChartURL"
368
                        width="100%" height="650" [src]="publicationsWithPIDByOrganizationChartURL"></iframe>
369
              </li>
370
              <li aria-hidden="true" style="animation-duration: 200ms;" class="">
371
                <app-treemap-highchart *ngIf="publicationsWithPIDByFunderData"
372
                                       [chartTitle]="'Open Access publications with PID'" [chartSubtitle]="'by funder (top funders)'"
373
                                       [chartData]="publicationsWithPIDByFunderData" [color]="publicationColor" [height]="650"></app-treemap-highchart>
374
              </li>
375
            </ul>
376
          </div>
377

    
378
        </div>
379
      </div>
380
    </div>
381
  </div>
382

    
383
</div>
384

    
385

    
386

    
387
<div *ngIf="indicator && indicator=='more-details'" class="indicatorsTable uk-visible@m uk-margin-large-top">
388

    
389
  <!--<h3 class="">More details for publications</h3>-->
390

    
391
  <div class="uk-margin-top uk-margin-bottom">
392
    <label class="uk-margin-right">Show: </label>
393
    <select class="md-input" #selectPublicationsContent (change)="getContent('publication', selectPublicationsContent.value)" style="display: inline-block">
394
      <option value="affiliated_peer_reviewed">affiliated</option>
395
      <option value="affiliated">affiliated (incl. non-peer reviewed publications)</option>
396
      <option value="deposited_peer_reviewed">deposited</option>
397
      <option value="deposited">deposited (incl. non-peer reviewed publications)</option>
398
    </select>
399
    <!--<span class="md-input-bar"></span>-->
400
  </div>
401

    
402
  <div class="uk-grid">
403
    <div class="absoluteTable uk-width-3-4@l uk-width-3-4@m">
404
      <div class="md-card chartCard">
405
        <div class="md-card-content">
406

    
407
          <ul class="uk-subnav uk-subnav-pill dataView uk-flex uk-flex-center" data-uk-switcher="{connect:'#pubs-indicators-content-a-fade', animation: 'fade'}">
408
            <li aria-expanded="true" class="uk-active">
409
              <a href="#">
410
                <i class="fas fa-hashtag"></i>
411
              </a>
412
            </li>
413
            <li aria-expanded="false" class="">
414
              <a href="#">
415
                <i class="fas fa-percentage"></i>
416
              </a>
417
            </li>
418
          </ul>
419

    
420
          <ul id="pubs-indicators-content-a-fade" class="uk-switcher uk-margin" >
421
            <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
422
              <div *ngIf="loadingPublicationsAbsoluteTable" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-2x loader" aria-hidden="true"></i></div>
423
              <app-countries-table *ngIf="publicationsAbsoluteTableData" [isPercentage]="false" [countries]="publicationsAbsoluteTableData" [view]="'openScience'" [entity]="'publication'"></app-countries-table>
424
            </li>
425
            <li aria-hidden="true" style="animation-duration: 200ms;" class="">
426
              <div *ngIf="loadingPublicationsPercentageTable" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-2x loader" aria-hidden="true"></i></div>
427
              <app-countries-table *ngIf="publicationsPercentageTableData" [isPercentage]="true" [countries]="publicationsPercentageTableData" [view]="'openScience'" [entity]="'publication'"></app-countries-table>
428
            </li>
429
          </ul>
430

    
431
        </div>
432
      </div>
433

    
434
    </div>
435

    
436
  </div>
437

    
438
</div>
(1-1/6)