Project

General

Profile

1
<div class="greySection">
2

    
3
  <section class="uk-padding-small" id="sect-continent-page">
4
    <div class="uk-container uk-container-expand uk-margin-medium-top">
5

    
6
      <!--LAPTOP & PAD LANDSCAPE-->
7
      <div class="uk-visible@m">
8
        <ul class="uk-breadcrumb">
9
          <li><a routerLink="/home">Home</a></li>
10
          <li><span>{{continentName | titlecase}}</span></li>
11
        </ul>
12

    
13

    
14
        <div *ngIf="continentName" class="">
15
          <img src="../../../assets/img/flags/{{continentName}}-flag.jpg" class="flag-image" width="132" height="132">
16
          <div class="uk-inline uk-margin-left">
17
            <h1>{{continentName | titlecase}}</h1>
18
            <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
19
          </div>
20
        </div>
21
      </div>
22

    
23
      <!--MOBILE & PAD PORTRAIT-->
24
      <div class="uk-hidden@m uk-text-center">
25
        <div *ngIf="continentName" class="">
26
          <img src="../../../assets/img/flags/{{continentName}}-flag.jpg" class="flag-image uk-display-block uk-margin-auto-left uk-margin-auto-right" width="103" height="103">
27
          <div class="uk-margin-top">
28
            <h1 class="uk-margin-small-bottom">{{continentName | titlecase}}</h1>
29
            <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
30
          </div>
31
        </div>
32
      </div>
33

    
34
    </div>
35
  </section>
36

    
37

    
38

    
39
  <section class="uk-padding-small uk-margin-top">
40
    <div class="uk-container uk-container-center uk-margin-medium-top">
41

    
42
      <!--LAPTOP & PAD LANDSCAPE-->
43
      <div class="uk-visible@m">
44
        <div *ngIf="!europeOverviewData" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-5x loader" aria-hidden="true"></i></div>
45
        <div *ngIf="europeOverviewData" class="uk-grid uk-child-width-1-4 entitiesContainer">
46

    
47
          <!--PUBLICATIONS-->
48
          <ng-container *ngIf="europeOverviewData.publications?.percentage">
49
            <div class="publicationsColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.publications.percentage)">
50
              <div class="entityColumnContent">
51
                <span><img src="../../../assets/img/icons/publications-icon-white.svg" [width]="getPublicationsIconWidth(europeOverviewData.publications.percentage)"></span>
52
                <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.publications.percentage)"
53
                      [ngStyle]="{'margin-top' :europeOverviewData.publications.percentage * 45 /100 + 'px'}">
54
              {{europeOverviewData.publications.percentage | number :'1.0-1'}}%
55
            </span>
56
                <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.publications.percentage)"
57
                      [ngStyle]="{'margin-top' :europeOverviewData.publications.percentage * 30 /100 + 'px'}">Publications</span>
58
              </div>
59
            </div>
60
          </ng-container>
61
          <ng-container *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.percentage">
62
            <div class="publicationsColumn uk-padding" style="height: 0%">
63

    
64
            </div>
65
          </ng-container>
66

    
67
          <!--DATASETS-->
68
          <ng-container *ngIf="europeOverviewData.datasets?.percentage">
69
            <div class="datasetsColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.datasets.percentage)">
70
              <div class="entityColumnContent">
71
                <span><img src="../../../assets/img/icons/datasets-icon-white.svg" [width]="getDatasetsIconWidth(europeOverviewData.datasets.percentage)"></span>
72
                <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.datasets.percentage)"
73
                      [ngStyle]="{'margin-top' :europeOverviewData.datasets.percentage * 45 /100 + 'px'}">
74
              {{europeOverviewData.datasets.percentage | number :'1.0-1'}}%
75
            </span>
76
                <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.datasets.percentage)"
77
                      [ngStyle]="{'margin-top' :europeOverviewData.datasets.percentage * 30 /100 + 'px'}">Datasets</span>
78
              </div>
79
            </div>
80
          </ng-container>
81
          <ng-container *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.percentage">
82
            <div class="datasetsColumn" style="height: 0%">
83

    
84
            </div>
85
          </ng-container>
86

    
87
          <!--SOFTWARE-->
88
          <ng-container *ngIf="europeOverviewData.software?.percentage">
89
            <div class="softwareColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.software.percentage)">
90
              <div class="entityColumnContent">
91
                <span><img src="../../../assets/img/icons/software-icon-white.svg" [width]="getSoftwareIconWidth(europeOverviewData.software.percentage)"></span>
92
                <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.software.percentage)"
93
                      [ngStyle]="{'margin-top' :europeOverviewData.software.percentage * 45 /100 + 'px'}">
94
              {{europeOverviewData.software.percentage | number :'1.0-1'}}%
95
            </span>
96
                <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.software.percentage)"
97
                      [ngStyle]="{'margin-top' :europeOverviewData.software.percentage * 30 /100 + 'px'}">Software</span>
98
              </div>
99
            </div>
100
          </ng-container>
101
          <ng-container *ngIf="!europeOverviewData.software || !europeOverviewData.software.percentage">
102
            <div class="softwareColumn" style="height: 0%">
103

    
104
            </div>
105
          </ng-container>
106

    
107
          <!--OTHER-->
108
          <ng-container *ngIf="europeOverviewData.other?.percentage">
109
            <div class="otherColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.other.percentage)">
110
              <div class="entityColumnContent">
111
                <span><img src="../../../assets/img/icons/other-icon-white.svg" [width]="getOtherIconWidth(europeOverviewData.other.percentage)"></span>
112
                <span class="number" [style.font-size.px]="getNumberFontSize(europeOverviewData.other.percentage)"
113
                      [ngStyle]="{'margin-top' :europeOverviewData.other.percentage * 45 /100 + 'px'}">
114
              {{europeOverviewData.other.percentage | number :'1.0-1'}}%
115
            </span>
116
                <span class="number" [style.font-size.px]="getEntityNameFontSize(europeOverviewData.other.percentage)"
117
                      [ngStyle]="{'margin-top' :europeOverviewData.other.percentage * 30 /100 + 'px'}">Other</span>
118
              </div>
119
            </div>
120
          </ng-container>
121
          <ng-container *ngIf="!europeOverviewData.other || !europeOverviewData.other.percentage">
122
            <div class="otherColumn" style="height: 0%">
123

    
124
            </div>
125
          </ng-container>
126

    
127
        </div>
128

    
129
        <hr class="entitiesDivider">
130

    
131
        <div class="uk-grid uk-child-width-1-4 uk-margin-large-top">
132

    
133
          <div class="entityLegendContent">
134
            <div class="publicationsDot uk-inline"></div>
135
            <div class="uk-inline uk-margin-left">
136
              <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
137
            </div>
138
          </div>
139
          <div class="entityLegendContent">
140
            <div class="datasetsDot"></div>
141
            <div class="uk-inline uk-margin-left">
142
              <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
143
            </div>
144
          </div>
145
          <div class="entityLegendContent">
146
            <div class="softwareDot"></div>
147
            <div class="uk-inline uk-margin-left">
148
              <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
149
            </div>
150
          </div>
151
          <div class="entityLegendContent">
152
            <div class="otherDot"></div>
153
            <div class="uk-inline uk-margin-left">
154
              <span>Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>
155
            </div>
156
          </div>
157

    
158
        </div>
159
      </div>
160

    
161
      <!--MOBILE & PAD PORTRAIT-->
162
      <div class="uk-hidden@m uk-text-center">
163
        <div *ngIf="!europeOverviewData" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-5x loader" aria-hidden="true"></i></div>
164

    
165
        <div *ngIf="europeOverviewData" class="uk-grid uk-child-width-1-4 entitiesContainer">
166

    
167
          <!--PUBLICATIONS-->
168
          <ng-container *ngIf="europeOverviewData.publications?.percentage">
169
            <div class="publicationsColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.publications.percentage)">
170
              <div class="entityColumnContent">
171
                <span><img src="../../../assets/img/icons/publications-icon-white.svg" [width]="getPublicationsIconWidth(europeOverviewData.publications.percentage)"></span>
172
              </div>
173
            </div>
174
          </ng-container>
175
          <ng-container *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.percentage">
176
            <div class="publicationsColumn uk-padding" style="height: 0%">
177

    
178
            </div>
179
          </ng-container>
180

    
181
          <!--DATASETS-->
182
          <ng-container *ngIf="europeOverviewData.datasets?.percentage">
183
            <div class="datasetsColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.datasets.percentage)">
184
              <div class="entityColumnContent">
185
                <span><img src="../../../assets/img/icons/datasets-icon-white.svg" [width]="getDatasetsIconWidth(europeOverviewData.datasets.percentage)"></span>
186
              </div>
187
            </div>
188
          </ng-container>
189
          <ng-container *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.percentage">
190
            <div class="datasetsColumn" style="height: 0%">
191

    
192
            </div>
193
          </ng-container>
194

    
195
          <!--SOFTWARE-->
196
          <ng-container *ngIf="europeOverviewData.software?.percentage">
197
            <div class="softwareColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.software.percentage)">
198
              <div class="entityColumnContent">
199
                <span><img src="../../../assets/img/icons/software-icon-white.svg" [width]="getSoftwareIconWidth(europeOverviewData.software.percentage)"></span>
200
              </div>
201
            </div>
202
          </ng-container>
203
          <ng-container *ngIf="!europeOverviewData.software || !europeOverviewData.software.percentage">
204
            <div class="softwareColumn" style="height: 0%">
205

    
206
            </div>
207
          </ng-container>
208

    
209
          <!--OTHER-->
210
          <ng-container *ngIf="europeOverviewData.other?.percentage">
211
            <div class="otherColumn uk-padding" [style.height.%]="getHeight(europeOverviewData.other.percentage)">
212
              <div class="entityColumnContent">
213
                <span><img src="../../../assets/img/icons/other-icon-white.svg" [width]="getOtherIconWidth(europeOverviewData.other.percentage)"></span>
214
              </div>
215
            </div>
216
          </ng-container>
217
          <ng-container *ngIf="!europeOverviewData.other || !europeOverviewData.other.percentage">
218
            <div class="otherColumn" style="height: 0%">
219

    
220
            </div>
221
          </ng-container>
222

    
223
        </div>
224
        <hr class="entitiesDivider">
225

    
226
        <div *ngIf="europeOverviewData" class="uk-grid uk-child-width-1-1 continentPageEntitiesOverview">
227

    
228
          <!--PUBLICATIONS-->
229
          <div *ngIf="europeOverviewData.publications?.percentage" style="z-index: 4;">
230
            <div class="md-card">
231
              <div class="md-card-content">
232
                <div class="uk-flex uk-flex-space-between">
233
                  <div class="">
234
                    <img src="../../../assets/img/icons/publications-icon.svg" width="21">
235
                    <span class="publications entityName uk-margin-left">Publications</span>
236
                  </div>
237
                  <div class="number big">
238
                    {{europeOverviewData.publications.percentage | number : '1.0-1'}}%
239
                  </div>
240
                </div>
241
              </div>
242
            </div>
243
          </div>
244

    
245

    
246
          <!--DATASETS-->
247
          <div *ngIf="europeOverviewData.datasets?.percentage" style="z-index: 3;">
248
            <div class="md-card">
249
              <div class="md-card-content">
250
                <div class="uk-flex uk-flex-space-between">
251
                  <div class="">
252
                    <img src="../../../assets/img/icons/datasets-icon.svg" width="17">
253
                    <span class="datasets entityName uk-margin-left">Datasets</span>
254
                  </div>
255
                  <div class="number big">
256
                    {{europeOverviewData.datasets.percentage | number : '1.0-1'}}%
257
                  </div>
258
                </div>
259
              </div>
260
            </div>
261
          </div>
262

    
263

    
264
          <!--SOFTWARE-->
265
          <div *ngIf="europeOverviewData.software?.percentage" style="z-index: 2;">
266
            <div class="md-card">
267
              <div class="md-card-content">
268
                <div class="uk-flex uk-flex-space-between">
269
                  <div class="">
270
                    <img src="../../../assets/img/icons/software-icon.svg" width="19">
271
                    <span class="software entityName uk-margin-left">Software</span>
272
                  </div>
273
                  <div class="number big">
274
                    {{europeOverviewData.software.percentage | number : '1.0-1'}}%
275
                  </div>
276
                </div>
277
              </div>
278
            </div>
279
          </div>
280

    
281

    
282
          <!--OTHER-->
283
          <div *ngIf="europeOverviewData.other?.percentage" style="z-index: 1;">
284
            <div class="md-card">
285
              <div class="md-card-content">
286
                <div class="uk-flex uk-flex-space-between">
287
                  <div class="">
288
                    <img src="../../../assets/img/icons/other-icon.svg" width="20">
289
                    <span class="other entityName uk-margin-left">Other</span>
290
                  </div>
291
                  <div class="number big">
292
                    {{europeOverviewData.other.percentage | number : '1.0-1'}}%
293
                  </div>
294
                </div>
295
              </div>
296
            </div>
297
          </div>
298

    
299

    
300
        </div>
301
      </div>
302

    
303

    
304
    </div>
305
  </section>
306

    
307
  <!--TABS SECTION-->
308
  <section class="section uk-margin-large-top" id="sect-tabs">
309
    <div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
310

    
311
      <div class="">
312

    
313
        <!--LAPTOP & PAD LANDSCAPE-->
314
        <ul class="uk-visible@m uk-tab uk-tab-large uk-flex-center" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
315
          <li class="uk-active" aria-expanded="true"><a (click)="changeTopView('overview')">Overview</a></li>
316
          <li aria-expanded="false"><a (click)="changeTopView('openScience')">Open Science</a></li>
317
          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
318
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
319
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
320
          <!--<li class="uk-tab-responsive uk-active uk-hidden" aria-haspopup="true" aria-expanded="false"><a>Developers</a><div class="uk-dropdown uk-dropdown-small" aria-hidden="true"><ul class="uk-nav uk-nav-dropdown"></ul><div></div></div></li>-->
321
        </ul>
322

    
323
        <!--MOBILE & PAD PORTRAIT-->
324
        <ul class="uk-hidden@m uk-tab" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
325
          <li class="uk-active" aria-expanded="true"><a (click)="changeTopView('overview')">Overview</a></li>
326
          <li aria-expanded="false"><a (click)="changeTopView('openScience')">Open Science</a></li>
327
          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
328
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
329
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
330
          <!--<li class="uk-tab-responsive uk-active uk-hidden" aria-haspopup="true" aria-expanded="false"><a>Developers</a><div class="uk-dropdown uk-dropdown-small" aria-hidden="true"><ul class="uk-nav uk-nav-dropdown"></ul><div></div></div></li>-->
331
        </ul>
332

    
333
        <ul id="team_tabbed" class="uk-switcher dataContainer">
334

    
335
          <!--OVERVIEW tab-->
336
          <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
337
            <div class="uk-margin tabContent">
338

    
339
              <!--<div class="uk-grid uk-child-width-1-4 uk-grid-match">-->
340

    
341
                <!--<div>-->
342
                  <!--<div class="md-card">-->
343
                    <!--<div class="md-card-content">-->
344

    
345
                      <!--<svg viewBox="0 0 36 36" class="circular-chart publications">-->
346
                        <!--<path class="circle-bg" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>-->
347
                        <!--<path class="circle" stroke-dasharray="30, 100" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>-->
348
                        <!--<text x="18" y="20.35" class="percentage">30%</text>-->
349
                      <!--</svg>-->
350
                      <!--<div class="uk-margin-small-top uk-text-center">OA publications</div>-->
351
                    <!--</div>-->
352
                  <!--</div>-->
353
                <!--</div>-->
354

    
355
                <!--<div>-->
356
                  <!--<div class="md-card">-->
357
                    <!--<div class="md-card-content">-->
358
                      <!--30% open access-->
359
                    <!--</div>-->
360
                  <!--</div>-->
361
                <!--</div>-->
362

    
363
                <!--<div>-->
364
                  <!--<div class="md-card">-->
365
                    <!--<div class="md-card-content">-->
366
                      <!--18.165 closed access-->
367
                    <!--</div>-->
368
                  <!--</div>-->
369
                <!--</div>-->
370

    
371
                <!--<div>-->
372
                  <!--<div class="md-card">-->
373
                    <!--<div class="md-card-content">-->
374
                      <!--22.888-->
375
                    <!--</div>-->
376
                  <!--</div>-->
377
                <!--</div>-->
378

    
379
              <!--</div>-->
380

    
381
              <div class="uk-grid uk-child-width-1-1">
382

    
383
                <div>
384
                  <div class="md-card chartCard">
385
                    <div class="md-card-content">
386
                      <iframe width="100%" height="550" [src]="publicationsByTypeChartURL"></iframe>
387
                    </div>
388
                  </div>
389
                </div>
390

    
391
              </div>
392

    
393
              <div class="uk-grid uk-child-width-1-3@m uk-child-width-1-3@l uk-child-width-1-1@s">
394

    
395
                <div class="uk-grid-margin">
396
                  <div class="md-card chartCard">
397
                    <div class="md-card-content">
398
                      <iframe width="100%" height="550" [src]="publicationsByCountryChartURL"></iframe>
399
                    </div>
400
                  </div>
401
                </div>
402

    
403
                <div class="uk-grid-margin">
404
                  <div class="md-card chartCard">
405
                    <div class="md-card-content">
406
                      <iframe width="100%" height="550" [src]="publicationsByDatasourceChartURL"></iframe>
407
                    </div>
408
                  </div>
409
                </div>
410

    
411
                <div class="uk-grid-margin">
412
                  <div class="md-card chartCard">
413
                    <div class="md-card-content">
414
                      <iframe width="100%" height="550" [src]="publicationsByOrganizationChartURL"></iframe>
415
                    </div>
416
                  </div>
417
                </div>
418

    
419
                <div class="uk-grid-margin">
420
                  <div class="md-card chartCard">
421
                    <div class="md-card-content">
422
                      <iframe width="100%" height="550" [src]="datasetsByCountryChartURL"></iframe>
423
                    </div>
424
                  </div>
425
                </div>
426

    
427
                <div class="uk-grid-margin">
428
                  <div class="md-card chartCard">
429
                    <div class="md-card-content">
430
                      <iframe width="100%" height="550" [src]="datasetsByDatasourceChartURL"></iframe>
431
                    </div>
432
                  </div>
433
                </div>
434

    
435
                <div class="uk-grid-margin">
436
                  <div class="md-card chartCard">
437
                    <div class="md-card-content">
438
                      <iframe width="100%" height="550" [src]="datasetsByOrganizationChartURL"></iframe>
439
                    </div>
440
                  </div>
441
                </div>
442

    
443
                <div class="uk-grid-margin">
444
                  <div class="md-card chartCard">
445
                    <div class="md-card-content">
446
                      <iframe width="100%" height="550" [src]="softwareByCountryChartURL"></iframe>
447
                    </div>
448
                  </div>
449
                </div>
450

    
451
                <div class="uk-grid-margin">
452
                  <div class="md-card chartCard">
453
                    <div class="md-card-content">
454
                      <iframe width="100%" height="550" [src]="softwareByDatasourceChartURL"></iframe>
455
                    </div>
456
                  </div>
457
                </div>
458

    
459
                <div class="uk-grid-margin">
460
                  <div class="md-card chartCard">
461
                    <div class="md-card-content">
462
                      <iframe width="100%" height="550" [src]="softwareByOrganizationChartURL"></iframe>
463
                    </div>
464
                  </div>
465
                </div>
466

    
467
                <div class="uk-grid-margin">
468
                  <div class="md-card chartCard">
469
                    <div class="md-card-content">
470
                      <iframe width="100%" height="550" [src]="otherByCountryChartURL"></iframe>
471
                    </div>
472
                  </div>
473
                </div>
474

    
475
                <div class="uk-grid-margin">
476
                  <div class="md-card chartCard">
477
                    <div class="md-card-content">
478
                      <iframe width="100%" height="550" [src]="otherByDatasourceChartURL"></iframe>
479
                    </div>
480
                  </div>
481
                </div>
482

    
483
                <div class="uk-grid-margin">
484
                  <div class="md-card chartCard">
485
                    <div class="md-card-content">
486
                      <iframe width="100%" height="550" [src]="otherByOrganizationChartURL"></iframe>
487
                    </div>
488
                  </div>
489
                </div>
490

    
491
              </div>
492

    
493

    
494

    
495

    
496
              <!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>-->
497
            </div>
498
          </li>
499

    
500
          <!--OPEN SCIENCE tab-->
501
          <li aria-hidden="true" style="animation-duration: 200ms;">
502
            <div class="uk-margin tabContent">
503

    
504

    
505
              <ul class="uk-subnav uk-subnav-pill dataView uk-flex uk-flex-center" data-uk-switcher="{connect:'#switcher-content-a-fade', animation: 'fade'}">
506
                <li aria-expanded="true" class="uk-active">
507
                  <a class="publicationsSubnav" (click)="changeView('publications')">
508
                    <img src="../../../assets/img/icons/publications-icon.svg" width="15">
509
                  </a>
510
                </li>
511
                <li aria-expanded="false" class="">
512
                  <a class="datasetsSubnav" (click)="changeView('datasets')">
513
                    <img src="../../../assets/img/icons/datasets-icon.svg" width="15">
514
                  </a>
515
                </li>
516
                <li aria-expanded="false" class="">
517
                  <a class="softwareSubnav" (click)="changeView('software')">
518
                    <img src="../../../assets/img/icons/software-icon.svg" width="15">
519
                  </a>
520
                </li>
521
                <li aria-expanded="false" class="">
522
                  <a class="otherSubnav" (click)="changeView('other')">
523
                    <img src="../../../assets/img/icons/other-icon.svg" width="15">
524
                  </a>
525
                </li>
526
              </ul>
527

    
528
              <hr class="uk-visible@m">
529

    
530
              <ul id="switcher-content-a-fade" class="uk-switcher uk-margin" >
531
                <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
532
                  <div>
533
                    Publications....
534
                  </div>
535
                </li>
536
                <li aria-hidden="true" style="animation-duration: 200ms;" class="">
537
                  <div>
538
                    Datasets...
539
                  </div>
540
                </li>
541
                <li aria-hidden="true" style="animation-duration: 200ms;" class="">
542
                  <div>
543
                    Software...
544
                  </div>
545
                </li>
546
                <li aria-hidden="true" style="animation-duration: 200ms;" class="">
547
                  <div>
548
                    Other...
549
                  </div>
550
                </li>
551
              </ul>
552

    
553

    
554
            </div>
555
          </li>
556

    
557
          <li aria-hidden="true">
558
            <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
559
            </div>
560
          </li>
561

    
562
          <li aria-hidden="true">
563
            <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
564
            </div>
565
          </li>
566

    
567
          <li aria-hidden="true">
568
            <div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">
569
            </div>
570
          </li>
571
        </ul>
572
      </div>
573

    
574
    </div>
575
  </section>
576
</div>
577

    
578

    
579

    
580

    
(1-1/2)