Project

General

Profile

1
<!--LAPTOP & PAD LANDSCAPE-->
2
<div class="uk-visible@m">
3
  <!--MAP AND OVERVIEW NUMBERS SECTION-->
4
  <section class="section greySection" id="sect-overview">
5
    <div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-margin-bottom" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
6

    
7
      <div class="uk-grid uk-grid-small uk-margin-bottom uk-grid-match" uk-height-viewport="offset-bottom: 25">
8

    
9
        <div class="uk-width-3-4">
10

    
11
          <!--Map Container-->
12
          <app-europe-map-overview (emitSelectedCountry)="countrySelected($event)"></app-europe-map-overview>
13
          <!--<app-map-overview *ngIf="overviewData?.countries" (emitSelectedCountry)="selectedCountry($event)"></app-map-overview>-->
14
          <div class="uk-flex uk-flex-right ">
15
            <span class="lastUpdateInfo">Data Last Updated: </span>
16
            <span *ngIf="lastUpdateDate" class="lastUpdateInfo">{{lastUpdateDate}}</span>
17
          </div>
18
          <div class="uk-flex uk-flex-right uk-margin-remove uk-text-italic">All publication indicators in the OS Observatory refer to peer-reviewed publications, unless explicitly stated otherwise.</div>
19

    
20

    
21
        </div>
22

    
23
        <div class="uk-width-1-4">
24
          <div class="md-card infoBox">
25
            <ng-container *ngIf="!selectedCountry">
26
              <div class="md-card-toolbar">
27
                <h3 class="uk-text-center uk-margin-small-top">OPEN SCIENCE OBSERVATORY</h3>
28
              </div>
29
              <div *ngIf="!selectedCountry" class="md-card-content">
30
                <div>An OpenAIRE service to:</div>
31
                <ul>
32
                  <li>
33
                    Better understand the European open research landscape
34
                  </li>
35
                  <li>
36
                    Track trends for open access to publications, data, software
37
                  </li>
38
                  <li>
39
                    Reveal hidden potential on existing resources
40
                  </li>
41
                  <li>
42
                    View open collaboration patterns
43
                  </li>
44
                </ul>
45
                <div class="uk-text-center uk-margin-medium-top uk-margin-medium-bottom">
46
                  <button [routerLink]="['/methodology']" class="md-btn md-btn-primary">Learn More</button>
47
                </div>
48

    
49
              </div>
50
              <div></div>
51
            </ng-container>
52

    
53
            <ng-container *ngIf="selectedCountry">
54
              <div class="md-card-toolbar">
55
                <h3 class="uk-text-center uk-margin-small-top">
56
                  <a class="backToOriginalInfoBox uk-float-left" (click)="deselectCountry()"><i class="fas fa-angle-left"></i></a>
57
                  <img src="../../../assets/img/flags/{{selectedCountry.code | lowercase}}-flag-round.png" class="small-flag-image uk-margin-small-right" width="24" style="margin-top: -3px">
58
                  <span>{{selectedCountry.name | uppercase}}</span>
59
                </h3>
60
              </div>
61
              <div *ngIf="!selectedCountryData" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-5x loader" aria-hidden="true"></i></div>
62
              <!--<div *ngIf="!selectedCountryData" class="loading-big">-->
63
              <!--<div uk-spinner="ratio: 2" class="uk-overlay uk-position-center uk-dark" style="margin: auto"></div>-->
64
              <!--&lt;!&ndash;<div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">&ndash;&gt;-->
65
              <!--&lt;!&ndash;{{ loadingMessage }}&ndash;&gt;-->
66
              <!--&lt;!&ndash;</div>&ndash;&gt;-->
67
              <!--<div class="transparentFilm"></div>-->
68
              <!--</div>-->
69
              <div *ngIf="selectedCountryData" class="md-card-content">
70
                <div class="numbers">
71
                  <div class="uk-margin-small-top">
72

    
73
                    <div class="indicator">
74
                      <span class="number publications" *ngIf="selectedCountryData.publicationsAffiliated!=null">{{selectedCountryData.publicationsAffiliated | number}}</span>
75
                      <span class="number publications" *ngIf="selectedCountryData.publicationsAffiliated===null">--</span>
76
                      <span><i>Open Access publications</i> affiliated to an organization in the country</span>
77
                    </div>
78

    
79
                    <div class="indicator uk-margin-small-top">
80
                      <span class="number publications" *ngIf="selectedCountryData.publicationsDeposited!=null">{{selectedCountryData.publicationsDeposited | number}}</span>
81
                      <span class="number publications" *ngIf="selectedCountryData.publicationsDeposited===null">--</span>
82
                      <span><i>Open Access publications</i> in the country's institutional repositories</span>
83
                    </div>
84

    
85
                    <hr class="greyBoldDivider uk-margin-top uk-margin-bottom">
86

    
87
                    <div class="indicator">
88
                      <span class="number datasets" *ngIf="selectedCountryData.datasetsAffiliated!=null">{{selectedCountryData.datasetsAffiliated | number}}</span>
89
                      <span class="number datasets" *ngIf="selectedCountryData.datasetsAffiliated===null">--</span>
90
                      <span><i>Open Access datasets</i> affiliated to an organization in the country</span>
91
                    </div>
92

    
93
                    <div class="indicator uk-margin-small-top">
94
                      <span class="number datasets" *ngIf="selectedCountryData.datasetsDeposited!=null">{{selectedCountryData.datasetsDeposited | number}}</span>
95
                      <span class="number datasets" *ngIf="selectedCountryData.datasetsDeposited===null">--</span>
96
                      <span><i>Open Access datasets</i> in the country's repositories</span>
97
                    </div>
98

    
99
                    <hr class="greyBoldDivider uk-margin-top uk-margin-bottom">
100

    
101
                    <div class="indicator">
102
                      <span class="number repositories" *ngIf="selectedCountryData.repositories!=null">{{selectedCountryData.repositories | number}}</span>
103
                      <span class="number repositories" *ngIf="selectedCountryData.repositories===null">--</span>
104
                      <span><i>repositories</i> in openDOAR & re3data</span>
105
                    </div>
106

    
107
                    <hr class="greyBoldDivider uk-margin-top uk-margin-bottom">
108

    
109
                    <div class="indicator">
110
                      <span class="number journals" *ngIf="selectedCountryData.journals!=null">{{selectedCountryData.journals | number}}</span>
111
                      <span class="number journals" *ngIf="selectedCountryData.journals===null">--</span>
112
                      <span><i>journals</i> in DOAJ</span>
113
                    </div>
114

    
115
                    <!--<hr class="greyBoldDivider uk-margin-top uk-margin-bottom">-->
116

    
117
                    <!--<div class="indicator">-->
118
                      <!--<span class="number policies" *ngIf="selectedCountryData.policies!=null">{{selectedCountryData.policies | number}}</span>-->
119
                      <!--<span class="number policies" *ngIf="selectedCountryData.policies===null">&#45;&#45;</span>-->
120
                      <!--<span>organisations with <i>OA policies</i></span>-->
121
                    <!--</div>-->
122

    
123
                  </div>
124

    
125
                </div>
126

    
127
                <div class="uk-text-center uk-margin-medium-top">
128
                  <!--<button [routerLink]="['/country/' + selectedCountry.code]" class="md-btn md-btn-primary">View Details</button>-->
129
                  <button [routerLink]="['/country' , selectedCountry.code]" class="md-btn md-btn-primary">View Details</button>
130
                </div>
131

    
132
              </div>
133
              <div></div>
134
            </ng-container>
135
          </div>
136
        </div>
137

    
138

    
139
        <!--<div class="uk-width-large-3-5 uk-container-center uk-text-center">-->
140
        <!--<h2 class="heading_b">-->
141
        <!--Our Team-->
142
        <!--<span class="sub-heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span>-->
143
        <!--</h2>-->
144
        <!--</div>-->
145
      </div>
146

    
147
    </div>
148

    
149
    <!--<div class="uk-container uk-container-expand">-->
150
      <!--<h5>* All publication indicators in the OS Observatory refer to <i>peer-reviewed</i> publications, unless explicitly stated otherwise.</h5>-->
151
    <!--</div>-->
152

    
153
    <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}">
154

    
155
      <div class="">
156
        <!--Overview cards-->
157
        <div *ngIf="europeOverviewData" class="uk-width-1-1 indicatorCards">
158
          <div class="uk-grid uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m uk-child-width-1-4@l uk-margin-top uk-grid-match" data-uk-grid-margin="">
159
            <div class="uk-row-first">
160
              <div class="md-card">
161
                <div class="md-card-content">
162
                  <div class="uk-margin-top">
163
                    <div class="uk-float-right uk-margin-small-right">
164
                      <img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">
165
                    </div>
166
                    <h3 class="uk-margin-remove">
167
                      <span *ngIf="europeOverviewData.publications?.oa" class="number">{{europeOverviewData.publications.oa | number}}</span>
168
                      <span *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.oa" class="number">--</span>
169
                    </h3>
170
                  </div>
171
                  <div class="uk-margin-top">
172
                    <!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>-->
173
                    <span class=""><i>Open Access publications</i></span>
174
                  </div>
175
                  <div *ngIf="europeOverviewData.publications?.percentage" class="uk-margin-top">
176
                    <span class="number">{{europeOverviewData.publications.percentage | number :'1.0-1'}}%</span> share open access
177
                    <div class="progress uk-margin-small-top">
178
                      <div [ngStyle]="{'width': europeOverviewData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
179
                    </div>
180
                  </div>
181
                </div>
182
              </div>
183
            </div>
184
            <div class="">
185
              <div class="md-card">
186
                <div class="md-card-content">
187
                  <div class="uk-margin-top">
188
                    <div class="uk-float-right uk-margin-small-right">
189
                      <img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">
190
                    </div>
191
                    <h3 class="uk-margin-remove">
192
                      <span *ngIf="europeOverviewData.datasets?.oa" class="number">{{europeOverviewData.datasets.oa | number}}</span>
193
                      <span *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.oa" class="number">--</span>
194
                    </h3>
195
                  </div>
196
                  <div class="uk-margin-top">
197
                    <!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>-->
198
                    <span class=""><i>Open Access datasets</i></span>
199
                  </div>
200
                  <div *ngIf="europeOverviewData.datasets?.percentage" class="uk-margin-top">
201
                    <span class="number">{{europeOverviewData.datasets.percentage | number :'1.0-1'}}%</span> share open access
202
                    <div class="progress uk-margin-small-top">
203
                      <div [ngStyle]="{'width': europeOverviewData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
204
                    </div>
205
                  </div>
206
                </div>
207
              </div>
208
            </div>
209
            <div class="">
210
              <div class="md-card">
211
                <div class="md-card-content">
212
                  <div class="uk-margin-top">
213
                    <div class="uk-float-right uk-margin-small-right">
214
                      <img src="../../../assets/img/icons/repositories-icon.svg" width="43" height="40">
215
                    </div>
216
                    <h3 class="uk-margin-remove">
217
                      <span *ngIf="europeOverviewData.repositories?.total" class="number">{{europeOverviewData.repositories.total | number}}</span>
218
                      <span *ngIf="!europeOverviewData.repositories || !europeOverviewData.repositories.total" class="number">--</span>
219
                    </h3>
220
                  </div>
221
                  <div class="uk-margin-top">
222
                    <span class=""><i>repositories</i> in OpenDOAR and re3data</span>
223
                  </div>
224
                  <div *ngIf="europeOverviewData.repositories?.percentage" class="uk-margin-top">
225
                    <span class="number">{{europeOverviewData.repositories.percentage | number : '1.0-1'}}%</span> validated
226
                    <div class="progress uk-margin-small-top">
227
                      <div [ngStyle]="{'width': europeOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div>
228
                    </div>
229
                  </div>
230
                </div>
231
              </div>
232
            </div>
233
            <div class="">
234
              <div class="md-card">
235
                <div class="md-card-content">
236
                  <div class="uk-margin-top">
237
                    <div class="uk-float-right uk-margin-small-right">
238
                      <img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40">
239
                    </div>
240
                    <h3 class="uk-margin-remove">
241
                      <span *ngIf="europeOverviewData.journals?.total" class="number">{{europeOverviewData.journals.total | number}}</span>
242
                      <span *ngIf="!europeOverviewData.journals || !europeOverviewData.journals.total" class="number">--</span>
243
                    </h3>
244
                  </div>
245
                  <div class="uk-margin-top">
246
                    <span class=""><i>Open Access journals</i> in DOAJ</span>
247
                  </div>
248
                  <div *ngIf="europeOverviewData.journals?.percentage" class="uk-margin-top">
249
                    <span class="number">{{europeOverviewData.journals.percentage | number : '1.0-1'}}%</span> validated
250
                    <div class="progress uk-margin-small-top">
251
                      <div [ngStyle]="{'width': europeOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>
252
                    </div>
253
                  </div>
254
                </div>
255
              </div>
256
            </div>
257
            <!--<div class="">-->
258
              <!--<div class="md-card">-->
259
                <!--<div class="md-card-content">-->
260
                  <!--<div class="uk-margin-top">-->
261
                    <!--<div class="uk-float-right uk-margin-small-right">-->
262
                      <!--<img src="../../../assets/img/icons/policies-icon.svg" width="36" height="40">-->
263
                    <!--</div>-->
264
                    <!--<h3 class="uk-margin-remove">-->
265
                      <!--<span *ngIf="europeOverviewData.policies?.oa" class="number">{{europeOverviewData.policies.oa | number}}</span>-->
266
                      <!--<span *ngIf="!europeOverviewData.policies || !europeOverviewData.policies.oa" class="number">&#45;&#45;</span>-->
267
                    <!--</h3>-->
268
                  <!--</div>-->
269
                  <!--<div class="uk-margin-top">-->
270
                    <!--&lt;!&ndash;<span class="uk-text-muted uk-text-small">Number of OA publications</span>&ndash;&gt;-->
271
                    <!--<span class="">organizations with <i>OA policies</i></span>-->
272
                  <!--</div>-->
273
                  <!--&lt;!&ndash;<div *ngIf="overviewData.overview.policies?.percentage" class="uk-margin-top">&ndash;&gt;-->
274
                  <!--&lt;!&ndash;<span class="number">{{overviewData.overview.policies.percentage | number}}%</span> are OA&ndash;&gt;-->
275
                  <!--&lt;!&ndash;</div>&ndash;&gt;-->
276
                <!--</div>-->
277
              <!--</div>-->
278
            <!--</div>-->
279
          </div>
280
        </div>
281
      </div>
282

    
283
    </div>
284
  </section>
285

    
286

    
287
  <!--OA IN EUROPE SECTION-->
288
  <section class="section greySection" id="sect-tabs">
289
    <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}">
290

    
291
      <h3>Open Access (OA) in Europe</h3>
292

    
293
      <div class="dataContainer">
294
        <div class="uk-margin tabContent">
295
          <app-data-view></app-data-view>
296
          <!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>-->
297
        </div>
298
      </div>
299

    
300
    </div>
301
  </section>
302
</div>
303

    
304

    
305
<!--MOBILE & PAD PORTRAIT-->
306
<div class="uk-hidden@m">
307

    
308
  <section class="section">
309
    <div class="uk-container uk-container-expand uk-container-center ">
310

    
311
      <!--<div class="uk-margin-top">-->
312
        <!--<form class="uk-search uk-search-default searchForCountry">-->
313
          <!--<span uk-search-icon></span>-->
314
          <!--<input class="uk-search-input" type="search" placeholder="Search for a country...">-->
315
        <!--</form>-->
316
      <!--</div>-->
317

    
318
      <div class="uk-margin-top">
319

    
320
        <div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry">
321
          <span id="search-icon" uk-search-icon></span>
322
          <ng-autocomplete
323
            [data]="countriesCollection"
324
            [searchKeyword]="keyword"
325
            [placeholder]="'Search for a country...'"
326
            (selected)='selectCountryFromAutocompleteEvent($event)'
327
            (inputChanged)='onChangeSearch($event)'
328
            (inputFocused)='onFocused($event)'
329
            historyIdentifier="countriesCollection"
330
            [itemTemplate]="itemTemplate"
331
            [notFoundTemplate]="notFoundTemplate">
332
          </ng-autocomplete>
333

    
334
          <ng-template #itemTemplate let-item>
335
            <a [innerHTML]="item.name"></a>
336
          </ng-template>
337

    
338
          <ng-template #notFoundTemplate let-notFound>
339
            <div [innerHTML]="notFound"></div>
340
          </ng-template>
341
        </div>
342

    
343

    
344

    
345
        <!--<div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry" data-uk-autocomplete="{source:'https://getuikit.com/v2/tests/components/_autocomplete.json'}">-->
346
          <!--<span uk-search-icon></span>-->
347
          <!--<input class="uk-search-input" type="search" placeholder="Search for a country...">-->
348
          <!--&lt;!&ndash;<input type="text">&ndash;&gt;-->
349
        <!--</div>-->
350

    
351
      </div>
352

    
353

    
354
    </div>
355
  </section>
356

    
357
  <section>
358
    <div class="uk-container uk-container-expand">
359
      <div class="uk-text-italic">All publication indicators in the OS Observatory refer to peer-reviewed publications, unless explicitly stated otherwise.</div>
360
    </div>
361
  </section>
362

    
363
  <section class="section">
364
    <div class="uk-container uk-container-expand uk-container-center ">
365

    
366
      <h3>Open Access (OA) in Europe</h3>
367

    
368
      <div *ngIf="europeOverviewData" class="md-card chartCard overviewMobile">
369
        <div class="md-card-content">
370

    
371

    
372
          <div class="uk-grid uk-margin-top">
373
            <div class="uk-width-1-5">
374
              <img src="../../../assets/img/icons/publications-icon.svg" width="30" height="30">
375
            </div>
376
            <div class="uk-width-2-5">
377
              <div *ngIf="europeOverviewData.publications?.oa" class="number big">{{europeOverviewData.publications.oa | number}}</div>
378
              <div *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.oa" class="number big">--</div>
379
              <div class="uk-margin-small-top">OA PUBLICATIONS</div>
380
            </div>
381
            <div *ngIf="europeOverviewData.publications?.percentage" class="uk-width-2-5">
382
              <div class="progress">
383
                <div [ngStyle]="{'width': europeOverviewData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
384
              </div>
385
              <div class="uk-margin-small-top">
386
                <span class="number">{{europeOverviewData.publications.percentage | number :'1.0-1'}}%</span> OA
387
              </div>
388
            </div>
389
          </div>
390

    
391
          <div class="uk-grid uk-margin-medium-top">
392
            <div class="uk-width-1-5">
393
              <img src="../../../assets/img/icons/datasets-icon.svg" width="30" height="30">
394
            </div>
395
            <div class="uk-width-2-5">
396
              <div *ngIf="europeOverviewData.datasets?.oa" class="number big">{{europeOverviewData.datasets.oa | number}}</div>
397
              <div *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.oa" class="number big">--</div>
398
              <div class="uk-margin-small-top">OA DATASETS</div>
399
            </div>
400
            <div *ngIf="europeOverviewData.datasets?.percentage" class="uk-width-2-5">
401
              <div class="progress">
402
                <div [ngStyle]="{'width': europeOverviewData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
403
              </div>
404
              <div class="uk-margin-small-top">
405
                <span class="number">{{europeOverviewData.datasets.percentage | number :'1.0-1'}}%</span> OA
406
              </div>
407
            </div>
408
          </div>
409

    
410
          <div class="uk-grid uk-margin-medium-top">
411
            <div class="uk-width-1-5">
412
              <img src="../../../assets/img/icons/repositories-icon.svg" width="30" height="30">
413
            </div>
414
            <div class="uk-width-2-5">
415
              <div *ngIf="europeOverviewData.repositories?.total" class="number big">{{europeOverviewData.repositories.total | number}}</div>
416
              <div *ngIf="!europeOverviewData.repositories || !europeOverviewData.repositories.total" class="number big">--</div>
417
              <div class="uk-margin-small-top">REPOSITORIES FROM OPENDOAR & RE3DATA</div>
418
            </div>
419
            <div *ngIf="europeOverviewData.repositories?.percentage" class="uk-width-2-5">
420
              <div class="progress">
421
                <div [ngStyle]="{'width': europeOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div>
422
              </div>
423
              <div class="uk-margin-small-top">
424
                <span class="number">{{europeOverviewData.repositories.percentage | number :'1.0-1'}}%</span> VALIDATED
425
              </div>
426
            </div>
427
          </div>
428

    
429
          <div class="uk-grid uk-margin-medium-top">
430
            <div class="uk-width-1-5">
431
              <img src="../../../assets/img/icons/journals-icon.svg" width="30" height="30">
432
            </div>
433
            <div class="uk-width-2-5">
434
              <div *ngIf="europeOverviewData.journals?.total" class="number big">{{europeOverviewData.journals.total | number}}</div>
435
              <div *ngIf="!europeOverviewData.journals || !europeOverviewData.journals.total" class="number big">--</div>
436
              <div class="uk-margin-small-top">JOURNALS FROM DOAJ</div>
437
            </div>
438
            <div *ngIf="europeOverviewData.journals?.percentage" class="uk-width-2-5">
439
              <div class="progress">
440
                <div [ngStyle]="{'width': europeOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>
441
              </div>
442
              <div class="uk-margin-small-top">
443
                <span class="number">{{europeOverviewData.journals.percentage | number : '1.0-1'}}%</span> VALIDATED
444
              </div>
445
            </div>
446
          </div>
447

    
448
          <!--<div class="uk-grid uk-margin-medium-top uk-margin-bottom">-->
449
            <!--<div class="uk-width-1-5">-->
450
              <!--<img src="../../../assets/img/icons/policies-icon.svg" width="30" height="30">-->
451
            <!--</div>-->
452
            <!--<div class="uk-width-2-5">-->
453
              <!--<div *ngIf="europeOverviewData.policies?.oa" class="number big">{{europeOverviewData.policies.oa | number}}</div>-->
454
              <!--<div *ngIf="!europeOverviewData.policies || !europeOverviewData.policies.oa" class="number big">&#45;&#45;</div>-->
455
              <!--<div class="uk-margin-small-top">OA POLICIES</div>-->
456
            <!--</div>-->
457
            <!--<div class="uk-width-2-5">-->
458

    
459
            <!--</div>-->
460
          <!--</div>-->
461

    
462
        </div>
463
      </div>
464

    
465
      <div class="uk-margin-medium-top">
466
        <span class="lastUpdateInfo">Data Last Updated: </span>
467
        <span *ngIf="lastUpdateDate" class="lastUpdateInfo">{{lastUpdateDate}}</span>
468
      </div>
469

    
470
    </div>
471
  </section>
472

    
473
  <section class="section">
474
    <div class="uk-container uk-container-expand uk-container-center ">
475

    
476
      <h3>Leading Open Science</h3>
477

    
478
      <div *ngIf="leadingOpenScienceData" class="uk-grid uk-grid-small uk-grid-match uk-child-width-1-2">
479

    
480
        <div *ngFor="let data of leadingOpenScienceData" class="uk-margin-small-top">
481
          <div class="md-card leadingOpenScienceCard">
482
            <a [routerLink]="['/country', data.code]" class="el-link uk-position-cover uk-margin-remove-adjacent"></a>
483
            <div class="md-card-content">
484
              <div class="">
485
                <!--<div class="uk-flex">-->
486
                <img src="../../../assets/img/flags/{{data.code | lowercase}}-flag.svg" width="15">
487
                <span class="countryName uk-margin-small-left">{{data.name}}</span>
488
              </div>
489
              <div class="uk-margin-top">
490
                <!--<span class="number publications">18,165</span>-->
491
                <div class="number publications" *ngIf="data.publicationsAffiliated!=null">{{data.publicationsAffiliated | number}}</div>
492
                <div class="number publications" *ngIf="data.publicationsAffiliated===null">--</div>
493
                <div class="uk-margin-small-top"><i>OA publications</i> affiliated to an organization in the country</div>
494
              </div>
495
              <div class="uk-margin-top">
496
                <!--<span class="number publications">18,165</span>-->
497
                <div class="number publications" *ngIf="data.publicationsDeposited!=null">{{data.publicationsDeposited | number}}</div>
498
                <div class="number publications" *ngIf="data.publicationsDeposited===null">--</div>
499
                <div class="uk-margin-small-top"><i>OA publications</i> in the country's institutional repositories</div>
500
              </div>
501
            </div>
502
          </div>
503
        </div>
504

    
505
      </div>
506

    
507
    </div>
508
  </section>
509

    
510
  <section class="section">
511
    <div class="uk-container uk-container-expand uk-container-center ">
512
      <div class="goToDetailedViewLink">
513
        <a class="" [routerLink]="['/overview' , 'europe']">Detailed View of OA in Europe<i class="fas fa-arrow-right uk-margin-small-left"></i></a>
514
      </div>
515
    </div>
516
  </section>
517
</div>
518

    
519

    
520

    
(11-11/12)