Project

General

Profile

« Previous | Next » 

Revision 58904

Working on the new version of the oso - almost done with tha mobile version of the pages

View differences:

country-page.component.html
1
<section class="greySection uk-padding-small" id="sect-country-page">
2
  <div class="uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
3
  <!--<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">-->
1
<div class="greySection">
2
  <section class="uk-padding-small" id="sect-country-page">
3
    <div class="uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">
4
      <!--<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}">-->
4 5

  
5
    <div class="uk-grid uk-grid-small">
6
      <div class="uk-grid uk-grid-match uk-grid-small">
6 7

  
7
      <div class="uk-width-4-5 uk-margin-medium-bottom">
8
        <div class="uk-width-4-5@m uk-width-4-5@l uk-width-1-1@s">
8 9

  
9
        <div class="uk-container uk-container-expand uk-margin-medium-top">
10
          <div class="uk-container uk-container-expand uk-margin-medium-top">
10 11

  
11
          <ul class="uk-breadcrumb">
12
            <li><a [routerLink]="['/home']">Home</a></li>
13
            <li><span>{{countryName}}</span></li>
14
          </ul>
12
            <!--LAPTOP & PAD LANDSCAPE-->
13
            <div class="uk-visible@m">
14
              <ul *ngIf="countryPageOverviewData && countryPageOverviewData.name" class="uk-breadcrumb">
15
                <li><a [routerLink]="['/home']">Home</a></li>
16
                <li><span>{{countryPageOverviewData.name}}</span></li>
17
              </ul>
15 18

  
16 19

  
17
          <div class="countryPageHeader">
18
            <div *ngIf="countryPageOverviewData && countryPageOverviewData.name" class="">
19
              <img src="../../../assets/img/flags/{{countryCode | lowercase}}-flag-round.png" class="flag-image" width="132" height="132">
20
              <div class="uk-inline uk-margin-left">
21
                <h1>{{countryPageOverviewData.name}}</h1>
22
                <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
20
              <div class="countryPageHeader">
21
                <div *ngIf="countryPageOverviewData && countryPageOverviewData.name" class="">
22
                  <img src="../../../assets/img/flags/{{countryCode | lowercase}}-flag-round.png" class="flag-image" width="132" height="132">
23
                  <div class="uk-inline uk-margin-left">
24
                    <h1>{{countryPageOverviewData.name}}</h1>
25
                    <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
26
                  </div>
27
                </div>
28

  
29
                <div class="actionButtonsCountryPage uk-text-right">
30
                  <a class=""><i class="fas fa-code uk-margin-small-right"></i>Embed</a>
31
                  <!--<a class="uk-margin-left"><i class="fas fa-download uk-margin-small-right"></i>Download CSV</a>-->
32
                  <a class="uk-margin-left"><i class="fas fa-file-pdf uk-margin-small-right"></i>Download PDF</a>
33
                </div>
23 34
              </div>
24 35
            </div>
25 36

  
26
            <div class="actionButtonsCountryPage uk-text-right">
27
              <a class=""><i class="fas fa-code uk-margin-small-right"></i>Embed</a>
28
              <!--<a class="uk-margin-left"><i class="fas fa-download uk-margin-small-right"></i>Download CSV</a>-->
29
              <a class="uk-margin-left"><i class="fas fa-file-pdf uk-margin-small-right"></i>Download PDF</a>
37
            <!--MOBILE & PAD PORTRAIT-->
38
            <div class="uk-hidden@m uk-text-center">
39
              <div *ngIf="countryPageOverviewData && countryPageOverviewData.name" class="">
40
                <img src="../../../assets/img/flags/{{countryCode | lowercase}}-flag-round.png" class="flag-image uk-display-block uk-margin-auto-left uk-margin-auto-right" width="103" height="103">
41
                <div class="uk-margin-top">
42
                  <h1 class="uk-margin-small-bottom">{{countryPageOverviewData.name}}</h1>
43
                  <span class="lastUpdateInfo">Info Last Updated: 21 May 2020</span>
44
                </div>
45
              </div>
30 46
            </div>
47

  
48

  
49

  
31 50
          </div>
32 51

  
33
        </div>
34 52

  
53
          <div class="uk-container uk-container-expand uk-margin-large-top">
35 54

  
36
        <div class="uk-container uk-container-expand uk-margin-top">
37
          <!--Overview cards-->
38
          <div class="uk-width-1-1 indicatorCards">
39
            <div class="uk-grid uk-grid-small uk-child-width-1-2@s uk-child-width-1-4@m uk-child-width-1-4@l uk-margin-top uk-grid-match" data-uk-grid-margin="">
40
            <!--<div class="uk-grid uk-grid-small uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-5 uk-margin-top uk-grid-match" data-uk-grid-margin="">-->
55
            <!--Overview cards-->
56
            <!--LAPTOP & PAD LANDSCAPE-->
57
            <div class="uk-visible@m">
58
              <div class="uk-width-1-1 indicatorCards">
59
                <div class="uk-grid uk-grid-small uk-child-width-1-2@s uk-child-width-1-4@m uk-child-width-1-4@l uk-margin-top uk-grid-match" data-uk-grid-margin="">
60
                  <!--<div class="uk-grid uk-grid-small uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-5 uk-margin-top uk-grid-match" data-uk-grid-margin="">-->
41 61

  
42
              <div class="uk-row-first">
43
                <div class="md-card">
44
                  <div class="md-card-content">
62
                  <div class="uk-row-first">
63
                    <div class="md-card">
64
                      <div class="md-card-content">
45 65

  
46
                    <!--top number-->
47
                    <div class="uk-margin-top">
48
                      <!--<div class="uk-float-right uk-margin-small-right">-->
49
                      <!--<img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">-->
50
                      <!--</div>-->
51
                      <h3 class="uk-margin-remove">
52
                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.publicationsAffiliated || !countryPageOverviewData.publicationsAffiliated.oa" class="number">--</span>
53
                        <span *ngIf="countryPageOverviewData?.publicationsAffiliated?.oa" class="number">{{countryPageOverviewData.publicationsAffiliated.oa | number}}</span>
54
                      </h3>
66
                        <!--top number-->
67
                        <div class="uk-margin-top">
68
                          <!--<div class="uk-float-right uk-margin-small-right">-->
69
                          <!--<img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">-->
70
                          <!--</div>-->
71
                          <h3 class="uk-margin-remove">
72
                            <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.publicationsAffiliated || !countryPageOverviewData.publicationsAffiliated.oa" class="number">--</span>
73
                            <span *ngIf="countryPageOverviewData?.publicationsAffiliated?.oa" class="number">{{countryPageOverviewData.publicationsAffiliated.oa | number}}</span>
74
                          </h3>
75
                        </div>
76
                        <div class="uk-margin-top">
77
                          <span class=""><i>OA publications affiliated to an organization in the country</i></span>
78
                        </div>
79
                        <div *ngIf="countryPageOverviewData?.publicationsAffiliated?.percentage" class="uk-margin-top">
80
                          <span class="number">{{countryPageOverviewData.publicationsAffiliated.percentage | number :'1.0-1'}}%</span> OA
81
                          <div class="progress uk-margin-small-top">
82
                            <div [ngStyle]="{'width': countryPageOverviewData.publicationsAffiliated.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
83
                          </div>
84
                        </div>
85

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

  
88
                        <!--bottom number-->
89
                        <div class="uk-margin-top">
90
                          <div class="uk-float-right uk-margin-small-right">
91
                            <img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">
92
                          </div>
93
                          <h3 class="uk-margin-remove">
94
                            <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.publicationsDeposited || !countryPageOverviewData.publicationsDeposited.oa" class="number">--</span>
95
                            <span *ngIf="countryPageOverviewData?.publicationsDeposited?.oa" class="number">{{countryPageOverviewData.publicationsDeposited.oa | number}}</span>
96
                          </h3>
97
                        </div>
98
                        <div class="uk-margin-top">
99
                          <span class=""><i>OA publications from institutional repositories</i></span>
100
                        </div>
101
                        <div *ngIf="countryPageOverviewData?.publicationsDeposited?.percentage" class="uk-margin-top">
102
                          <span class="number">{{countryPageOverviewData.publicationsDeposited.percentage | number :'1.0-1'}}%</span> OA
103
                          <div class="progress uk-margin-small-top">
104
                            <div [ngStyle]="{'width': countryPageOverviewData.publicationsDeposited.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
105
                          </div>
106
                        </div>
107

  
108
                      </div>
55 109
                    </div>
56
                    <div class="uk-margin-top">
57
                      <span class=""><i>OA publications affiliated to an organization in the country</i></span>
58
                    </div>
59
                    <div *ngIf="countryPageOverviewData?.publicationsAffiliated?.percentage" class="uk-margin-top">
60
                      <span class="number">{{countryPageOverviewData.publicationsAffiliated.percentage | number :'1.0-1'}}%</span> OA
61
                      <div class="progress uk-margin-small-top">
62
                        <div [ngStyle]="{'width': countryPageOverviewData.publicationsAffiliated.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
110
                  </div>
111

  
112
                  <div class="">
113
                    <div class="md-card">
114
                      <div class="md-card-content">
115

  
116
                        <!--top number-->
117
                        <div class="uk-margin-top">
118
                          <!--<div class="uk-float-right uk-margin-small-right">-->
119
                          <!--<img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">-->
120
                          <!--</div>-->
121
                          <h3 class="uk-margin-remove">
122
                            <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.datasetsAffiliated || !countryPageOverviewData.datasetsAffiliated.oa" class="number">--</span>
123
                            <span *ngIf="countryPageOverviewData?.datasetsAffiliated?.oa" class="number">{{countryPageOverviewData.datasetsAffiliated.oa | number}}</span>
124
                          </h3>
125
                        </div>
126
                        <div class="uk-margin-top">
127
                          <span class=""><i>OA datasets affiliated to an organization in the country</i></span>
128
                        </div>
129
                        <div *ngIf="countryPageOverviewData?.datasetsAffiliated?.percentage" class="uk-margin-top">
130
                          <span class="number">{{countryPageOverviewData.datasetsAffiliated.percentage | number :'1.0-1'}}%</span> OA
131
                          <div class="progress uk-margin-small-top">
132
                            <div [ngStyle]="{'width': countryPageOverviewData.datasetsAffiliated.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
133
                          </div>
134
                        </div>
135

  
136
                        <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
137

  
138
                        <!--bottom number-->
139
                        <div class="uk-margin-top">
140
                          <div class="uk-float-right uk-margin-small-right">
141
                            <img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">
142
                          </div>
143
                          <h3 class="uk-margin-remove">
144
                            <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.datasetsDeposited || !countryPageOverviewData.datasetsDeposited.oa" class="number">--</span>
145
                            <span *ngIf="countryPageOverviewData?.datasetsDeposited?.oa" class="number">{{countryPageOverviewData.datasetsDeposited.oa | number}}</span>
146
                          </h3>
147
                        </div>
148
                        <div class="uk-margin-top">
149
                          <span class=""><i>OA datasets from institutional repositories</i></span>
150
                        </div>
151
                        <div *ngIf="countryPageOverviewData?.datasetsDeposited?.percentage" class="uk-margin-top">
152
                          <span class="number">{{countryPageOverviewData.datasetsDeposited.percentage | number :'1.0-1'}}%</span> OA
153
                          <div class="progress uk-margin-small-top">
154
                            <div [ngStyle]="{'width': countryPageOverviewData.datasetsDeposited.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
155
                          </div>
156
                        </div>
63 157
                      </div>
64 158
                    </div>
159
                  </div>
65 160

  
66
                    <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
161
                  <div class="">
67 162

  
68
                    <!--bottom number-->
69
                    <div class="uk-margin-top">
70
                      <div class="uk-float-right uk-margin-small-right">
71
                        <img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40">
163
                    <div class="md-card">
164
                      <div class="md-card-content">
165
                        <div class="uk-margin-top">
166
                          <div class="uk-float-right uk-margin-small-right">
167
                            <img src="../../../assets/img/icons/repositories-icon.svg" width="43" height="40">
168
                          </div>
169
                          <h3 class="uk-margin-remove">
170
                            <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.repositories || !countryPageOverviewData.repositories.oa" class="number">--</span>
171
                            <span *ngIf="countryPageOverviewData?.repositories?.oa" class="number">{{countryPageOverviewData.repositories.oa | number}}</span>
172
                          </h3>
173
                        </div>
174
                        <div class="uk-margin-top">
175
                          <span class=""><i>repositories</i> from openDOAR & re3data</span>
176
                        </div>
177
                        <div *ngIf="countryPageOverviewData?.repositories?.percentage" class="uk-margin-top">
178
                          <span class="number">{{countryPageOverviewData.repositories.percentage | number :'1.0-1'}}%</span> Validated
179
                          <div class="progress uk-margin-small-top">
180
                            <div [ngStyle]="{'width': countryPageOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div>
181
                          </div>
182
                        </div>
72 183
                      </div>
73
                      <h3 class="uk-margin-remove">
74
                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.publicationsDeposited || !countryPageOverviewData.publicationsDeposited.oa" class="number">--</span>
75
                        <span *ngIf="countryPageOverviewData?.publicationsDeposited?.oa" class="number">{{countryPageOverviewData.publicationsDeposited.oa | number}}</span>
76
                      </h3>
77 184
                    </div>
78
                    <div class="uk-margin-top">
79
                      <span class=""><i>OA publications from institutional repositories</i></span>
185

  
186
                    <div class="md-card">
187
                      <div class="md-card-content">
188
                        <div class="uk-margin-top">
189
                          <div class="uk-float-right uk-margin-small-right">
190
                            <img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40">
191
                          </div>
192
                          <h3 class="uk-margin-remove">
193
                            <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.journals || !countryPageOverviewData.journals.oa" class="number">--</span>
194
                            <span *ngIf="countryPageOverviewData?.journals?.oa" class="number">{{countryPageOverviewData.journals.oa | number}}</span>
195
                            <!--<span *ngIf="overviewData.overview.journals?.oa" class="number">{{overviewData.overview.journals.oa | number}}</span>-->
196
                            <!--<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">--</span>-->
197
                          </h3>
198
                        </div>
199
                        <div class="uk-margin-top">
200
                          <span class=""><i>OA journals</i> from DOAJ</span>
201
                        </div>
202
                        <div *ngIf="countryPageOverviewData?.journals?.percentage" class="uk-margin-top">
203
                          <span class="number">{{countryPageOverviewData.journals.percentage | number :'1.0-1'}}%</span> Validated
204
                          <div class="progress uk-margin-small-top">
205
                            <div [ngStyle]="{'width': countryPageOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>
206
                          </div>
207
                        </div>
208
                      </div>
80 209
                    </div>
81
                    <div *ngIf="countryPageOverviewData?.publicationsDeposited?.percentage" class="uk-margin-top">
82
                      <span class="number">{{countryPageOverviewData.publicationsDeposited.percentage | number :'1.0-1'}}%</span> OA
83
                      <div class="progress uk-margin-small-top">
84
                        <div [ngStyle]="{'width': countryPageOverviewData.publicationsDeposited.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
210

  
211
                  </div>
212

  
213
                  <!--<div class="">-->
214
                  <!--<div class="md-card">-->
215
                  <!--<div class="md-card-content">-->
216
                  <!--<div class="uk-margin-top">-->
217
                  <!--<div class="uk-float-right uk-margin-small-right">-->
218
                  <!--<img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40">-->
219
                  <!--</div>-->
220
                  <!--<h3 class="uk-margin-remove">-->
221
                  <!--<span *ngIf="!countryData || !countryData.journals || !countryData.journals.oa" class="number">&#45;&#45;</span>-->
222
                  <!--<span *ngIf="countryData?.journals?.oa" class="number">{{countryData.journals.oa | number}}</span>-->
223
                  <!--&lt;!&ndash;<span *ngIf="overviewData.overview.journals?.oa" class="number">{{overviewData.overview.journals.oa | number}}</span>&ndash;&gt;-->
224
                  <!--&lt;!&ndash;<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">&#45;&#45;</span>&ndash;&gt;-->
225
                  <!--</h3>-->
226
                  <!--</div>-->
227
                  <!--<div class="uk-margin-top">-->
228
                  <!--<span class=""><i>OA journals</i></span>-->
229
                  <!--</div>-->
230
                  <!--<div *ngIf="countryData.journals?.percentage" class="uk-margin-top">-->
231
                  <!--<span class="number">{{countryData.journals.percentage | number :'1.0-1'}}%</span> Certified-->
232
                  <!--<div class="progress uk-margin-small-top">-->
233
                  <!--<div [ngStyle]="{'width': countryData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>-->
234
                  <!--</div>-->
235
                  <!--</div>-->
236
                  <!--</div>-->
237
                  <!--</div>-->
238
                  <!--</div>-->
239

  
240
                  <div class="">
241

  
242
                    <div class="md-card" style="height: 47%">
243
                      <div class="md-card-content">
244
                        <div class="uk-margin-top">
245
                          <div class="uk-float-right uk-margin-small-right">
246
                            <img src="../../../assets/img/icons/policies-icon.svg" width="36" height="40">
247
                          </div>
248
                          <h3 class="uk-margin-remove">
249
                            <span class="number">--</span>
250
                            <!--<span *ngIf="overviewData.overview.policies?.oa" class="number">{{overviewData.overview.policies.oa | number}}</span>-->
251
                            <!--<span *ngIf="!overviewData.overview.policies || !overviewData.overview.policies.oa" class="number">--</span>-->
252
                          </h3>
253
                        </div>
254
                        <div class="uk-margin-top">
255
                          <span class="">organizations with <i>OA policies</i></span>
256
                        </div>
85 257
                      </div>
86 258
                    </div>
87 259

  
260
                    <div></div>
88 261
                  </div>
89 262
                </div>
90 263
              </div>
264
            </div>
91 265

  
92
              <div class="">
93
                <div class="md-card">
94
                  <div class="md-card-content">
266
            <!--MOBILE & PAD PORTRAIT-->
267
            <div class="uk-hidden@m uk-text-center uk-margin-medium-top">
268
              <div *ngIf="countryPageOverviewData" class="md-card chartCard overviewMobile">
269
                <div class="md-card-content">
95 270

  
96
                    <!--top number-->
97
                    <div class="uk-margin-top">
98
                      <!--<div class="uk-float-right uk-margin-small-right">-->
99
                      <!--<img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">-->
100
                      <!--</div>-->
101
                      <h3 class="uk-margin-remove">
102
                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.datasetsAffiliated || !countryPageOverviewData.datasetsAffiliated.oa" class="number">--</span>
103
                        <span *ngIf="countryPageOverviewData?.datasetsAffiliated?.oa" class="number">{{countryPageOverviewData.datasetsAffiliated.oa | number}}</span>
104
                      </h3>
271

  
272
                  <div class="uk-grid uk-margin-top">
273
                    <div class="uk-width-1-5">
274
                      <img src="../../../assets/img/icons/publications-icon.svg" width="30" height="30">
105 275
                    </div>
106
                    <div class="uk-margin-top">
107
                      <span class=""><i>OA datasets affiliated to an organization in the country</i></span>
276
                    <div class="uk-width-2-5">
277
                      <div *ngIf="countryPageOverviewData.publicationsAffiliated?.oa" class="number big">{{countryPageOverviewData.publicationsAffiliated.oa | number}}</div>
278
                      <div *ngIf="!countryPageOverviewData.publicationsAffiliated || !countryPageOverviewData.publicationsAffiliated.oa" class="number big">--</div>
279
                      <div class="uk-margin-small-top">OA PUBLICATIONS AFFILIATED TO AN ORGANIZATION IN THE COUNTRY</div>
108 280
                    </div>
109
                    <div *ngIf="countryPageOverviewData?.datasetsAffiliated?.percentage" class="uk-margin-top">
110
                      <span class="number">{{countryPageOverviewData.datasetsAffiliated.percentage | number :'1.0-1'}}%</span> OA
111
                      <div class="progress uk-margin-small-top">
112
                        <div [ngStyle]="{'width': countryPageOverviewData.datasetsAffiliated.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
281
                    <div *ngIf="countryPageOverviewData.publicationsAffiliated?.percentage" class="uk-width-2-5">
282
                      <div class="progress">
283
                        <div [ngStyle]="{'width': countryPageOverviewData.publicationsAffiliated.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
113 284
                      </div>
285
                      <div class="uk-margin-small-top">
286
                        <span class="number">{{countryPageOverviewData.publicationsAffiliated.percentage | number :'1.0-1'}}%</span> OA
287
                      </div>
114 288
                    </div>
289
                  </div>
290
                  <div class="uk-grid uk-margin-top">
291
                    <div class="uk-width-1-5">
292
                    </div>
293
                    <div class="uk-width-2-5">
294
                      <div *ngIf="countryPageOverviewData.publicationsDeposited?.oa" class="number big">{{countryPageOverviewData.publicationsDeposited.oa | number}}</div>
295
                      <div *ngIf="!countryPageOverviewData.publicationsDeposited || !countryPageOverviewData.publicationsDeposited.oa" class="number big">--</div>
296
                      <div class="uk-margin-small-top">OA PUBLICATIONS FROM INSTITUTIONAL REPOSITORIES</div>
297
                    </div>
298
                    <div *ngIf="countryPageOverviewData.publicationsDeposited?.percentage" class="uk-width-2-5">
299
                      <div class="progress">
300
                        <div [ngStyle]="{'width': countryPageOverviewData.publicationsDeposited.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div>
301
                      </div>
302
                      <div class="uk-margin-small-top">
303
                        <span class="number">{{countryPageOverviewData.publicationsDeposited.percentage | number :'1.0-1'}}%</span> OA
304
                      </div>
305
                    </div>
306
                  </div>
115 307

  
116
                    <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
117

  
118
                    <!--bottom number-->
119
                    <div class="uk-margin-top">
120
                      <div class="uk-float-right uk-margin-small-right">
121
                        <img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40">
308
                  <div class="uk-grid uk-margin-medium-top">
309
                    <div class="uk-width-1-5">
310
                      <img src="../../../assets/img/icons/datasets-icon.svg" width="30" height="30">
311
                    </div>
312
                    <div class="uk-width-2-5">
313
                      <div *ngIf="countryPageOverviewData.datasetsAffiliated?.oa" class="number big">{{countryPageOverviewData.datasetsAffiliated.oa | number}}</div>
314
                      <div *ngIf="!countryPageOverviewData.datasetsAffiliated || !countryPageOverviewData.datasetsAffiliated.oa" class="number big">--</div>
315
                      <div class="uk-margin-small-top">OA DATASETS AFFILIATED TO AN ORGANIZATION IN THE COUNTRY</div>
316
                    </div>
317
                    <div *ngIf="countryPageOverviewData.datasetsAffiliated?.percentage" class="uk-width-2-5">
318
                      <div class="progress">
319
                        <div [ngStyle]="{'width': countryPageOverviewData.datasetsAffiliated.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
122 320
                      </div>
123
                      <h3 class="uk-margin-remove">
124
                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.datasetsDeposited || !countryPageOverviewData.datasetsDeposited.oa" class="number">--</span>
125
                        <span *ngIf="countryPageOverviewData?.datasetsDeposited?.oa" class="number">{{countryPageOverviewData.datasetsDeposited.oa | number}}</span>
126
                      </h3>
321
                      <div class="uk-margin-small-top">
322
                        <span class="number">{{countryPageOverviewData.datasetsAffiliated.percentage | number :'1.0-1'}}%</span> OA
323
                      </div>
127 324
                    </div>
128
                    <div class="uk-margin-top">
129
                      <span class=""><i>OA datasets from institutional repositories</i></span>
325
                  </div>
326
                  <div class="uk-grid uk-margin-medium-top">
327
                    <div class="uk-width-1-5">
130 328
                    </div>
131
                    <div *ngIf="countryPageOverviewData?.datasetsDeposited?.percentage" class="uk-margin-top">
132
                      <span class="number">{{countryPageOverviewData.datasetsDeposited.percentage | number :'1.0-1'}}%</span> OA
133
                      <div class="progress uk-margin-small-top">
329
                    <div class="uk-width-2-5">
330
                      <div *ngIf="countryPageOverviewData.datasetsDeposited?.oa" class="number big">{{countryPageOverviewData.datasetsDeposited.oa | number}}</div>
331
                      <div *ngIf="!countryPageOverviewData.datasetsDeposited || !countryPageOverviewData.datasetsDeposited.oa" class="number big">--</div>
332
                      <div class="uk-margin-small-top">OA DATASETS FROM INSTITUTIONAL REPOSITORIES</div>
333
                    </div>
334
                    <div *ngIf="countryPageOverviewData.datasetsDeposited?.percentage" class="uk-width-2-5">
335
                      <div class="progress">
134 336
                        <div [ngStyle]="{'width': countryPageOverviewData.datasetsDeposited.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div>
135 337
                      </div>
338
                      <div class="uk-margin-small-top">
339
                        <span class="number">{{countryPageOverviewData.datasetsDeposited.percentage | number :'1.0-1'}}%</span> OA
340
                      </div>
136 341
                    </div>
137 342
                  </div>
138
                </div>
139
              </div>
140 343

  
141
              <div class="">
142

  
143
                <div class="md-card">
144
                  <div class="md-card-content">
145
                    <div class="uk-margin-top">
146
                      <div class="uk-float-right uk-margin-small-right">
147
                        <img src="../../../assets/img/icons/repositories-icon.svg" width="43" height="40">
148
                      </div>
149
                      <h3 class="uk-margin-remove">
150
                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.repositories || !countryPageOverviewData.repositories.oa" class="number">--</span>
151
                        <span *ngIf="countryPageOverviewData?.repositories?.oa" class="number">{{countryPageOverviewData.repositories.oa | number}}</span>
152
                      </h3>
344
                  <div class="uk-grid uk-margin-medium-top">
345
                    <div class="uk-width-1-5">
346
                      <img src="../../../assets/img/icons/repositories-icon.svg" width="30" height="30">
153 347
                    </div>
154
                    <div class="uk-margin-top">
155
                      <span class=""><i>repositories</i> from openDOAR & re3data</span>
348
                    <div class="uk-width-2-5">
349
                      <div *ngIf="countryPageOverviewData.repositories?.oa" class="number big">{{countryPageOverviewData.repositories.oa | number}}</div>
350
                      <div *ngIf="!countryPageOverviewData.repositories || !countryPageOverviewData.repositories.oa" class="number big">--</div>
351
                      <div class="uk-margin-small-top">VALIDATED REPOSITORIES</div>
156 352
                    </div>
157
                    <div *ngIf="countryPageOverviewData?.repositories?.percentage" class="uk-margin-top">
158
                      <span class="number">{{countryPageOverviewData.repositories.percentage | number :'1.0-1'}}%</span> Validated
159
                      <div class="progress uk-margin-small-top">
353
                    <div *ngIf="countryPageOverviewData.repositories?.percentage" class="uk-width-2-5">
354
                      <div class="progress">
160 355
                        <div [ngStyle]="{'width': countryPageOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div>
161 356
                      </div>
357
                      <div class="uk-margin-small-top">
358
                        <span class="number">{{countryPageOverviewData.repositories.percentage | number :'1.0-1'}}%</span> VALIDATED
359
                      </div>
162 360
                    </div>
163 361
                  </div>
164
                </div>
165 362

  
166
                <div class="md-card">
167
                  <div class="md-card-content">
168
                    <div class="uk-margin-top">
169
                      <div class="uk-float-right uk-margin-small-right">
170
                        <img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40">
171
                      </div>
172
                      <h3 class="uk-margin-remove">
173
                        <span *ngIf="!countryPageOverviewData || !countryPageOverviewData.journals || !countryPageOverviewData.journals.oa" class="number">--</span>
174
                        <span *ngIf="countryPageOverviewData?.journals?.oa" class="number">{{countryPageOverviewData.journals.oa | number}}</span>
175
                        <!--<span *ngIf="overviewData.overview.journals?.oa" class="number">{{overviewData.overview.journals.oa | number}}</span>-->
176
                        <!--<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">--</span>-->
177
                      </h3>
363
                  <div class="uk-grid uk-margin-medium-top">
364
                    <div class="uk-width-1-5">
365
                      <img src="../../../assets/img/icons/journals-icon.svg" width="30" height="30">
178 366
                    </div>
179
                    <div class="uk-margin-top">
180
                      <span class=""><i>OA journals</i> from DOAJ</span>
367
                    <div class="uk-width-2-5">
368
                      <div *ngIf="countryPageOverviewData.journals?.oa" class="number big">{{countryPageOverviewData.journals.oa | number}}</div>
369
                      <div *ngIf="!countryPageOverviewData.journals || !countryPageOverviewData.journals.oa" class="number big">--</div>
370
                      <div class="uk-margin-small-top">VALIDATED JOURNALS</div>
181 371
                    </div>
182
                    <div *ngIf="countryPageOverviewData?.journals?.percentage" class="uk-margin-top">
183
                      <span class="number">{{countryPageOverviewData.journals.percentage | number :'1.0-1'}}%</span> Validated
184
                      <div class="progress uk-margin-small-top">
372
                    <div *ngIf="countryPageOverviewData.journals?.percentage" class="uk-width-2-5">
373
                      <div class="progress">
185 374
                        <div [ngStyle]="{'width': countryPageOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>
186 375
                      </div>
376
                      <div class="uk-margin-small-top">
377
                        <span class="number">{{countryPageOverviewData.journals.percentage | number : '1.0-1'}}%</span> Validated
378
                      </div>
187 379
                    </div>
188 380
                  </div>
189
                </div>
190 381

  
191
              </div>
382
                  <div class="uk-grid uk-margin-medium-top uk-margin-bottom">
383
                    <div class="uk-width-1-5">
384
                      <img src="../../../assets/img/icons/policies-icon.svg" width="30" height="30">
385
                    </div>
386
                    <div class="uk-width-2-5">
387
                      <div *ngIf="countryPageOverviewData.policies?.oa" class="number big">{{countryPageOverviewData.policies.oa | number}}</div>
388
                      <div *ngIf="!countryPageOverviewData.policies || !countryPageOverviewData.policies.oa" class="number big">--</div>
389
                      <div class="uk-margin-small-top">OA POLICIES</div>
390
                    </div>
391
                    <div class="uk-width-2-5">
192 392

  
193
              <!--<div class="">-->
194
                <!--<div class="md-card">-->
195
                  <!--<div class="md-card-content">-->
196
                    <!--<div class="uk-margin-top">-->
197
                      <!--<div class="uk-float-right uk-margin-small-right">-->
198
                        <!--<img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40">-->
199
                      <!--</div>-->
200
                      <!--<h3 class="uk-margin-remove">-->
201
                        <!--<span *ngIf="!countryData || !countryData.journals || !countryData.journals.oa" class="number">&#45;&#45;</span>-->
202
                        <!--<span *ngIf="countryData?.journals?.oa" class="number">{{countryData.journals.oa | number}}</span>-->
203
                        <!--&lt;!&ndash;<span *ngIf="overviewData.overview.journals?.oa" class="number">{{overviewData.overview.journals.oa | number}}</span>&ndash;&gt;-->
204
                        <!--&lt;!&ndash;<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">&#45;&#45;</span>&ndash;&gt;-->
205
                      <!--</h3>-->
206
                    <!--</div>-->
207
                    <!--<div class="uk-margin-top">-->
208
                      <!--<span class=""><i>OA journals</i></span>-->
209
                    <!--</div>-->
210
                    <!--<div *ngIf="countryData.journals?.percentage" class="uk-margin-top">-->
211
                      <!--<span class="number">{{countryData.journals.percentage | number :'1.0-1'}}%</span> Certified-->
212
                      <!--<div class="progress uk-margin-small-top">-->
213
                        <!--<div [ngStyle]="{'width': countryData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div>-->
214
                      <!--</div>-->
215
                    <!--</div>-->
216
                  <!--</div>-->
217
                <!--</div>-->
218
              <!--</div>-->
219

  
220
              <div class="">
221

  
222
                <div class="md-card" style="height: 47%">
223
                  <div class="md-card-content">
224
                    <div class="uk-margin-top">
225
                      <div class="uk-float-right uk-margin-small-right">
226
                        <img src="../../../assets/img/icons/policies-icon.svg" width="36" height="40">
227
                      </div>
228
                      <h3 class="uk-margin-remove">
229
                        <span class="number">--</span>
230
                        <!--<span *ngIf="overviewData.overview.policies?.oa" class="number">{{overviewData.overview.policies.oa | number}}</span>-->
231
                        <!--<span *ngIf="!overviewData.overview.policies || !overviewData.overview.policies.oa" class="number">--</span>-->
232
                      </h3>
233 393
                    </div>
234
                    <div class="uk-margin-top">
235
                      <span class="">organizations with <i>OA policies</i></span>
236
                    </div>
237 394
                  </div>
395

  
238 396
                </div>
239

  
240
                <div></div>
241 397
              </div>
242 398
            </div>
399

  
400

  
243 401
          </div>
402

  
244 403
        </div>
245 404

  
246
        <!--GREEN VS. GOLD-->
247
        <div class="uk-container uk-container-expand contentSectionContainer uk-margin-large-top">
248
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
249
            Green vs. Gold
250
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
251
          </h2>
252
          <div class="uk-grid">
253
            <div class="uk-width-1-3">
254
              <div class="md-card">
255
                <div class="md-card-toolbar">
256
                  <div class="md-card-toolbar-actions">
257
                    <i class="fas fa-lg fa-info-circle"></i>
258
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
259
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
260
                  </div>
261
                  <h3 class="md-card-toolbar-heading-text">
262
                    <!--Card Heading-->
263
                  </h3>
264
                </div>
265
                <div class="md-card-content">
266
                  <iframe *ngIf="greenGoldLineChartURL" width="100%" height="350" [src]="greenGoldLineChartURL"></iframe>
267
                  <!--<img src="../../../assets/img/mocks/monthly-average-temperat.png">-->
268
                </div>
269
              </div>
405
        <!--Research Overview-->
406
        <!--LAPTOP & PAD LANDSCAPE-->
407
        <div class="uk-visible@m uk-width-1-5@m uk-width-1-5@l">
408
          <div class="md-card infoBox">
409

  
410
            <div class="md-card-toolbar">
411
              <h3 class="uk-text-center uk-margin-small-top">
412
                Research overview
413
              </h3>
270 414
            </div>
271
            <div class="uk-width-1-3">
272
              <div class="md-card">
273
                <div class="md-card-toolbar">
274
                  <div class="md-card-toolbar-actions">
275
                    <i class="fas fa-lg fa-info-circle"></i>
276
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
277
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
278
                  </div>
279
                  <h3 class="md-card-toolbar-heading-text">
280
                    <!--Card Heading-->
281
                  </h3>
415

  
416
            <div class="md-card-content">
417
              <div class="numbers">
418

  
419
                <div class="indicator uk-margin-small-top">
420
                  <span class="number primary">--</span>
421
                  <span><i>R&D expenditure</i></span>
282 422
                </div>
283
                <div class="md-card-content">
284
                  <iframe *ngIf="goldOrganisationsChartURL" width="100%" height="350" [src]="goldOrganisationsChartURL"></iframe>
423

  
424
                <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
425

  
426
                <div class="indicator">
427
                  <span class="number primary" *ngIf="countryPageOverviewData?.funders">{{countryPageOverviewData.funders}}</span>
428
                  <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.funders">--</span>
429
                  <span><i>funding sources</i></span>
285 430
                </div>
286
              </div>
287
            </div>
288
            <div class="uk-width-1-3">
289
              <div class="md-card">
290
                <div class="md-card-toolbar">
291
                  <div class="md-card-toolbar-actions">
292
                    <i class="fas fa-lg fa-info-circle"></i>
293
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
294
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
295
                  </div>
296
                  <h3 class="md-card-toolbar-heading-text">
297
                    <!--Card Heading-->
298
                  </h3>
431

  
432
                <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
433

  
434
                <div class="indicator">
435
                  <span class="number primary" *ngIf="countryPageOverviewData?.fundingOrganizations">{{countryPageOverviewData.fundingOrganizations}}</span>
436
                  <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.fundingOrganizations">--</span>
437
                  <span><i>funding organizations</i></span>
299 438
                </div>
300
                <div class="md-card-content">
301
                  <iframe *ngIf="greenOrganisationsChartURL" width="100%" height="350" [src]="greenOrganisationsChartURL"></iframe>
439

  
440
                <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
441

  
442
                <div class="indicator">
443
                  <span class="number primary" *ngIf="countryPageOverviewData?.ec_fundedOrganizations">{{countryPageOverviewData.ec_fundedOrganizations}}</span>
444
                  <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.ec_fundedOrganizations">--</span>
445
                  <span><i>organizations funded by the European commission since 2013</i></span>
302 446
                </div>
447

  
303 448
              </div>
304
            </div>
305
          </div>
306
        </div>
307 449

  
308
        <!--EU FUNDED OPEN SCIENCE-->
309
        <div class="uk-container uk-container-expand contentSectionContainer uk-margin-medium-top">
310
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
311
            EU funded Open Science
312
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
313
          </h2>
314
          <div class="uk-grid">
315
            <div class="uk-width-1-1">
316
              <div class="md-card">
317
                <div class="md-card-toolbar">
318
                  <div class="md-card-toolbar-actions">
319
                    <i class="fas fa-lg fa-info-circle"></i>
320
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
321
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
322
                  </div>
323
                  <h3 class="md-card-toolbar-heading-text">
324
                    <!--Card Heading-->
325
                  </h3>
450

  
451
              <div class="uk-text-center uk-margin-xlarge-top">
452

  
453
                <div class="uk-text-center uk-margin-medium-bottom">
454
                <span class="openaire-symbol-wrapper">
455
                  <img class="" src="https://www.openaire.eu/images/OpenAIRE_branding/Symbol.png" height="30px" width="30px">
456
                </span>
326 457
                </div>
327
                <div class="md-card-content">
328
                  <iframe *ngIf="publicationsDataSetsSoftwareByYearGraphURL" width="100%" height="350" [src]="publicationsDataSetsSoftwareByYearGraphURL"></iframe>
329
                </div>
458
                <a class="uk-link" href="{{linkToCountryInOpenAIRE}}" target="_blank">Country page in <strong>OpenAIRE</strong><i class="fas fa-long-arrow-alt-right uk-margin-left"></i></a>
330 459
              </div>
460

  
331 461
            </div>
332 462
          </div>
333
          <div class="uk-grid">
334
            <div class="uk-width-1-2">
335
              <div class="md-card">
336
                <div class="md-card-toolbar">
337
                  <div class="md-card-toolbar-actions">
338
                    <i class="fas fa-lg fa-info-circle"></i>
339
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
340
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
341
                  </div>
342
                  <h3 class="md-card-toolbar-heading-text">
343
                    Organisations
344
                  </h3>
345
                </div>
346
                <div class="md-card-content">
347
                  <iframe *ngIf="publicationsDataSetsSoftwareByOrganisationTableURL" width="100%" height="730" [src]="publicationsDataSetsSoftwareByOrganisationTableURL"></iframe>
348
                  <!--<table class="uk-table uk-table-small uk-table-divider">-->
349
                    <!--<thead>-->
350
                    <!--<tr>-->
351
                      <!--<th>Table Heading</th>-->
352
                      <!--<th>Table Heading</th>-->
353
                      <!--<th>Table Heading</th>-->
354
                    <!--</tr>-->
355
                    <!--</thead>-->
356
                    <!--<tbody>-->
357
                    <!--<tr>-->
358
                      <!--<td>Table Data</td>-->
359
                      <!--<td>Table Data</td>-->
360
                      <!--<td>Table Data</td>-->
361
                    <!--</tr>-->
362
                    <!--<tr>-->
363
                      <!--<td>Table Data</td>-->
364
                      <!--<td>Table Data</td>-->
365
                      <!--<td>Table Data</td>-->
366
                    <!--</tr>-->
367
                    <!--<tr>-->
368
                      <!--<td>Table Data</td>-->
369
                      <!--<td>Table Data</td>-->
370
                      <!--<td>Table Data</td>-->
371
                    <!--</tr>-->
372
                    <!--</tbody>-->
373
                  <!--</table>-->
374
                </div>
375
              </div>
376
            </div>
377
            <div class="uk-width-1-2">
378
              <div class="md-card">
379
                <div class="md-card-toolbar">
380
                  <div class="md-card-toolbar-actions">
381
                    <i class="fas fa-lg fa-info-circle"></i>
382
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
383
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
384
                  </div>
385
                  <h3 class="md-card-toolbar-heading-text">
386
                    Repositories
387
                  </h3>
388
                </div>
389
                <div class="md-card-content">
390
                  <iframe *ngIf="publicationsDataSetsSoftwareByRepoTableURL" width="100%" height="730" [src]="publicationsDataSetsSoftwareByRepoTableURL"></iframe>
391
                  <!--<table class="uk-table uk-table-small uk-table-divider">-->
392
                    <!--<thead>-->
393
                    <!--<tr>-->
394
                      <!--<th>Table Heading</th>-->
395
                      <!--<th>Table Heading</th>-->
396
                      <!--<th>Table Heading</th>-->
397
                    <!--</tr>-->
398
                    <!--</thead>-->
399
                    <!--<tbody>-->
400
                    <!--<tr>-->
401
                      <!--<td>Table Data</td>-->
402
                      <!--<td>Table Data</td>-->
403
                      <!--<td>Table Data</td>-->
404
                    <!--</tr>-->
405
                    <!--<tr>-->
406
                      <!--<td>Table Data</td>-->
407
                      <!--<td>Table Data</td>-->
408
                      <!--<td>Table Data</td>-->
409
                    <!--</tr>-->
410
                    <!--<tr>-->
411
                      <!--<td>Table Data</td>-->
412
                      <!--<td>Table Data</td>-->
413
                      <!--<td>Table Data</td>-->
414
                    <!--</tr>-->
415
                    <!--</tbody>-->
416
                  <!--</table>-->
417
                </div>
418
              </div>
419
            </div>
420
          </div>
421 463
        </div>
422 464

  
423
        <!--FUNDING SOURCES-->
424
        <div class="uk-container uk-container-expand contentSectionContainer uk-margin-medium-top">
425
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
426
            Funding sources
427
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
428
          </h2>
429
          <div class="uk-grid">
430
            <div class="uk-width-1-1">
431
              <div class="md-card">
432
                <div class="md-card-toolbar">
433
                  <div class="md-card-toolbar-actions">
434
                    <i class="fas fa-lg fa-info-circle"></i>
435
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
436
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
465
        <!--Research Overview-->
466
        <!--MOBILE & PAD PORTRAIT-->
467
        <div class="uk-hidden@m uk-width-1-1@s uk-margin-medium-top">
468
          <div class="uk-container uk-container-expand">
469
            <div *ngIf="countryPageOverviewData" class="md-card chartCard overviewMobile">
470
              <div class="md-card-content">
471
                <div class="numbers">
472

  
473
                  <div class="">
474
                    <div class="number big primary">--</div>
475
                    <div class="uk-margin-small-top">R&D EXPENDITURE</div>
437 476
                  </div>
438
                  <h3 class="md-card-toolbar-heading-text">
439
                    <!--Card Heading-->
440
                  </h3>
441
                </div>
442
                <div class="md-card-content">
443
                  <iframe *ngIf="publicationsDataSetsSoftwareByFunderGraphURL" width="100%" height="450" [src]="publicationsDataSetsSoftwareByFunderGraphURL"></iframe>
444
                </div>
445
              </div>
446
            </div>
447
          </div>
448
        </div>
449 477

  
450
        <!--PROJECT PERFORMANCE-->
451
        <div class="uk-container uk-container-expand contentSectionContainer uk-margin-medium-top">
452
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
453
            Project performance
454
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
455
          </h2>
456
          <div class="uk-grid">
457
            <div class="uk-width-1-3">
458
              <div class="md-card">
459
                <div class="md-card-toolbar">
460
                  <div class="md-card-toolbar-actions">
461
                    <i class="fas fa-lg fa-info-circle"></i>
462
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
463
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
478
                  <div class="uk-margin-medium-top">
479
                    <div class="number big primary" *ngIf="countryPageOverviewData?.funders">{{countryPageOverviewData.funders}}</div>
480
                    <div class="number big primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.funders">--</div>
481
                    <div class="uk-margin-small-top">FUNDING SOURCES</div>
464 482
                  </div>
465
                  <h3 class="md-card-toolbar-heading-text">
466
                    <!--Card Heading-->
467
                  </h3>
468
                </div>
469
                <div class="md-card-content">
470
                  <iframe *ngIf="topProjectsByPublicationsGraphURL" width="100%" height="350" [src]="topProjectsByPublicationsGraphURL"></iframe>
471
                </div>
472
              </div>
473
            </div>
474
            <div class="uk-width-1-3">
475
              <div class="md-card">
476
                <div class="md-card-toolbar">
477
                  <div class="md-card-toolbar-actions">
478
                    <i class="fas fa-lg fa-info-circle"></i>
479
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
480
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
483

  
484
                  <div class="uk-margin-medium-top">
485
                    <div class="number big primary" *ngIf="countryPageOverviewData?.fundingOrganizations">{{countryPageOverviewData.fundingOrganizations}}</div>
486
                    <div class="number big primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.fundingOrganizations">--</div>
487
                    <div class="uk-margin-small-top">FUNDING ORGANIZATIONS</div>
481 488
                  </div>
482
                  <h3 class="md-card-toolbar-heading-text">
483
                    <!--Card Heading-->
484
                  </h3>
485
                </div>
486
                <div class="md-card-content">
487
                  <iframe *ngIf="topProjectsByDatasetsGraphURL" width="100%" height="350" [src]="topProjectsByDatasetsGraphURL"></iframe>
488
                </div>
489
              </div>
490
            </div>
491
            <div class="uk-width-1-3">
492
              <div class="md-card">
493
                <div class="md-card-toolbar">
494
                  <div class="md-card-toolbar-actions">
495
                    <i class="fas fa-lg fa-info-circle"></i>
496
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
497
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
489

  
490
                  <div class=" uk-margin-medium-top">
491
                    <div class="number big primary" *ngIf="countryPageOverviewData?.ec_fundedOrganizations">{{countryPageOverviewData.ec_fundedOrganizations}}</div>
492
                    <div class="number big primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.ec_fundedOrganizations">--</div>
493
                    <div class="uk-margin-small-top">ORGANIZATIONS FUNDED BY THE EUROPEAN COMMISSION SINCE 2013</div>
498 494
                  </div>
499
                  <h3 class="md-card-toolbar-heading-text">
500
                    <!--Card Heading-->
501
                  </h3>
495

  
502 496
                </div>
503
                <div class="md-card-content">
504
                  <iframe *ngIf="topProjectsBySoftwareGraphURL" width="100%" height="350" [src]="topProjectsBySoftwareGraphURL"></iframe>
505
                </div>
506 497
              </div>
507 498
            </div>
508 499
          </div>
509 500
        </div>
510
      </div>
511 501

  
512 502

  
513
      <div class="uk-width-1-5">
514
        <div class="md-card infoBox">
503
      </div>
515 504

  
516
          <div class="md-card-toolbar">
517
            <h3 class="uk-text-center uk-margin-small-top">
518
              Research overview
519
            </h3>
520
          </div>
505
    </div>
506
  </section>
521 507

  
522
          <div class="md-card-content">
523
            <div class="numbers">
508
  <!--TABS SECTION-->
509
  <section class="section uk-margin-large-top" id="sect-tabs">
510
    <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}">
524 511

  
525
              <div class="indicator uk-margin-small-top">
526
                <span class="number primary">--</span>
527
                <span><i>R&D expenditure</i></span>
528
              </div>
512
      <div class="">
529 513

  
530
              <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
514
        <!--LAPTOP & PAD LANDSCAPE-->
515
        <ul class="uk-visible@m uk-tab uk-tab-large uk-flex-center" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
516
          <li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>
517
          <li aria-expanded="false"><a href="#">Open Science</a></li>
518
          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
519
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
520
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
521
          <!--<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>-->
522
        </ul>
531 523

  
532
              <div class="indicator">
533
                <span class="number primary" *ngIf="countryPageOverviewData?.funders">{{countryPageOverviewData.funders}}</span>
534
                <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.funders">--</span>
535
                <span><i>funding sources</i></span>
536
              </div>
524
        <!--MOBILE & PAD PORTRAIT-->
525
        <ul class="uk-hidden@m uk-tab" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">
526
          <li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>
527
          <li aria-expanded="false"><a href="#">Open Science</a></li>
528
          <li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>
529
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>
530
          <li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>
531
          <!--<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>-->
532
        </ul>
537 533

  
538
              <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
534
        <ul id="team_tabbed" class="uk-switcher dataContainer">
539 535

  
540
              <div class="indicator">
541
                <span class="number primary" *ngIf="countryPageOverviewData?.fundingOrganizations">{{countryPageOverviewData.fundingOrganizations}}</span>
542
                <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.fundingOrganizations">--</span>
543
                <span><i>funding organizations</i></span>
544
              </div>
536
          <!--OVERVIEW tab-->
537
          <li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">
538
            <div class="uk-margin tabContent">
545 539

  
546
              <hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
540
              <!--<div class="uk-grid uk-child-width-1-4 uk-grid-match">-->
541
              <!--<div class="md-card">-->
542
              <!--<div class="md-card-content">-->
543
              <!--22.888-->
544
              <!--</div>-->
545
              <!--</div>-->
546
              <!--<div class="md-card">-->
547
              <!--<div class="md-card-content">-->
548
              <!--30% open access-->
549
              <!--</div>-->
550
              <!--</div>-->
551
              <!--<div class="md-card">-->
552
              <!--<div class="md-card-content">-->
553
              <!--18.165 closed access-->
554
              <!--</div>-->
555
              <!--</div>-->
556
              <!--<div class="md-card">-->
557
              <!--<div class="md-card-content">-->
558
              <!--22.888-->
559
              <!--</div>-->
560
              <!--</div>-->
561
              <!--</div>-->
547 562

  
548
              <div class="indicator">
549
                <span class="number primary" *ngIf="countryPageOverviewData?.ec_fundedOrganizations">{{countryPageOverviewData.ec_fundedOrganizations}}</span>
550
                <span class="number primary" *ngIf="!countryPageOverviewData || !countryPageOverviewData.ec_fundedOrganizations">--</span>
551
                <span><i>organizations funded by the European commission since 2013</i></span>
552
              </div>
563
              <!--<div class="uk-grid uk-child-width-1-1">-->
553 564

  
554
            </div>
565
              <!--<div>-->
566
              <!--<div class="md-card chartCard">-->
567
              <!--<div class="md-card-content">-->
568
              <!--<iframe width="100%" height="550" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22bar%22%2C%22query%22%3A%7B%22select%22%3A%5B%7B%22field%22%3A%22publication%22%2C%22aggregate%22%3A%22count%22%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22aggregate%22%3Anull%7D%5D%2C%22filters%22%3A%5B%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22publication.organization.country.continent%22%2C%22type%22%3A%22%3D%22%2C%22values%22%3A%5B%22Europe%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%2C%7B%22groupFilters%22%3A%5B%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%220041%22%5D%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%220043%22%5D%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%220044%22%5D%7D%2C%7B%22field%22%3A%22publication.classification%22%2C%22type%22%3A%22!%3D%22%2C%22values%22%3A%5B%22Unknown%22%5D%7D%5D%2C%22op%22%3A%22AND%22%7D%5D%2C%22entity%22%3A%22publication%22%2C%22profile%22%3A%22OpenAIRE%20All-inclusive%22%2C%22limit%22%3A%2230%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20by%20type%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22publications%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22type%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Afalse%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
569
              <!--</div>-->
570
              <!--</div>-->
571
              <!--</div>-->
555 572

  
573
              <!--</div>-->
556 574

  
557
            <div class="uk-text-center uk-margin-xlarge-top">
575
              <!--<div class="uk-grid uk-grid-row-medium uk-margin-small-top uk-child-width-1-2@m uk-child-width-1-2@l uk-child-width-1-1@s">-->
558 576

  
559
              <div class="uk-text-center uk-margin-medium-bottom">
560
                <span class="openaire-symbol-wrapper">
561
                  <img class="" src="https://www.openaire.eu/images/OpenAIRE_branding/Symbol.png" height="30px" width="30px">
562
                </span>
563
              </div>
564
              <a class="uk-link" href="{{linkToCountryInOpenAIRE}}" target="_blank">Country page in <strong>OpenAIRE</strong><i class="fas fa-long-arrow-alt-right uk-margin-left"></i></a>
565
            </div>
577
              <!--<div class="uk-grid-margin">-->
578
              <!--<div class="md-card chartCard">-->
579
              <!--<div class="md-card-content">-->
580
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Publications%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.publications%22%7D%7D%2C%7B%22name%22%3A%22OA%20Publications%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.publications.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Publications%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22publications%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
581
              <!--</div>-->
582
              <!--</div>-->
583
              <!--</div>-->
566 584

  
567
          </div>
568
        </div>
569
      </div>
585
              <!--<div class="uk-grid-margin">-->
586
              <!--<div class="md-card chartCard">-->
587
              <!--<div class="md-card-content">-->
588
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Datasets%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.datasets%22%7D%7D%2C%7B%22name%22%3A%22OA%20Datasets%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.datasets.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Datasets%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22datasets%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
589
              <!--</div>-->
590
              <!--</div>-->
591
              <!--</div>-->
570 592

  
571
      <!--<aside class="uk-width-1-5 uk-padding-remove">-->
572
        <!--<div id="sidebar_main" class="md-card dark-grey-box infoBox">-->
573
          <!--<div class="md-card-content">-->
574
            <!--<h3 class="uk-text-center">{{countryName | uppercase}}</h3>-->
593
              <!--<div class="uk-grid-margin">-->
594
              <!--<div class="md-card chartCard">-->
595
              <!--<div class="md-card-content">-->
596
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Software%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.software%22%7D%7D%2C%7B%22name%22%3A%22OA%20Software%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.software.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Software%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22software%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
597
              <!--</div>-->
598
              <!--</div>-->
599
              <!--</div>-->
575 600

  
576
            <!--<div>-->
577
              <!--<app-country-map [country]="countryName"></app-country-map>-->
578
            <!--</div>-->
579

  
580
            <!--<div class="numbers">-->
581
              <!--<div class="uk-margin-medium-top">-->
582
                <!--<div class="number">&#45;&#45;</div>-->
583
                <!--<div class="uk-margin-top">R&D expenditure</div>-->
601
              <!--<div class="uk-grid-margin">-->
602
              <!--<div class="md-card chartCard">-->
603
              <!--<div class="md-card-content">-->
604
              <!--<iframe width="100%" height="350" src="http://88.197.53.71:8080/stats-api/chart?json=%7B%22library%22%3A%22eCharts%22%2C%22chartDescription%22%3A%7B%22queries%22%3A%5B%7B%22name%22%3A%22Other%20Research%20Products%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.other%22%7D%7D%2C%7B%22name%22%3A%22OA%20Other%20Research%20Products%22%2C%22type%22%3A%22column%22%2C%22query%22%3A%7B%22name%22%3A%22new.oso.result_timeline.other.oa%22%7D%7D%5D%2C%22chart%22%3A%7B%7D%2C%22title%22%3A%7B%22text%22%3A%22Other%20research%20products%20over%20the%20years%22%7D%2C%22yAxis%22%3A%7B%22name%22%3A%22other%20research%20products%22%7D%2C%22xAxis%22%3A%7B%22name%22%3A%22year%22%7D%2C%22lang%22%3A%7B%22noData%22%3A%22No%20Data%20available%20for%20the%20Query%22%7D%2C%22toolbox%22%3A%7B%22show%22%3Afalse%7D%2C%22plotOptions%22%3A%7B%22series%22%3A%7B%22dataLabels%22%3A%7B%22enabled%22%3Atrue%7D%2C%22stacking%22%3Atrue%7D%7D%2C%22legend%22%3A%7B%22show%22%3Atrue%2C%22orient%22%3A%22horizontal%22%2C%22left%22%3A%22center%22%2C%22top%22%3A%22bottom%22%7D%2C%22tooltip%22%3A%7B%22show%22%3Atrue%7D%2C%22backgroundColor%22%3A%22%23FFFFFFFF%22%7D%7D"></iframe>-->
584 605
              <!--</div>-->
585
              <!--<div class="uk-margin-medium-top">-->
586
                <!--<div *ngIf="!countryData || !countryData.funders || !countryData.funders.oa" class="number">&#45;&#45;</div>-->
587
                <!--<div *ngIf="countryData?.funders?.oa" class="number">{{countryData.funders.oa}}</div>-->
588
                <!--<div class="uk-margin-top">funding sources</div>-->
589 606
              <!--</div>-->
590
              <!--<div class="uk-margin-medium-top">-->
591
                <!--<div *ngIf="!countryData || !countryData.funders || !countryData.funders.total" class="number">&#45;&#45;</div>-->
592
                <!--<div *ngIf="countryData?.funders?.total" class="number">{{countryData.funders.total}}</div>-->
593
                <!--<div class="uk-margin-top">funding organizations</div>-->
594 607
              <!--</div>-->
595
              <!--<div class="uk-margin-medium-top">-->
596
                <!--<div *ngIf="!countryData || !countryData.ecFundedOrganizations || !countryData.ecFundedOrganizations.oa" class="number">&#45;&#45;</div>-->
597
                <!--<div *ngIf="countryData?.ecFundedOrganizations?.oa" class="number">{{countryData.ecFundedOrganizations.oa}}</div>-->
598
                <!--<div class="uk-margin-top">organizations funded by the European commission since 2013</div>-->
608

  
609

  
599 610
              <!--</div>-->
600
            <!--</div>-->
601 611

  
602
            <!--<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">-->
603 612

  
604
            <!--<div class="uk-text-center uk-margin-medium-top">-->
605 613

  
606
              <!--<div class="uk-text-center uk-margin-medium-bottom">-->
607
                <!--<span class="openaire-symbol-wrapper">-->
608
                  <!--<img class="" src="https://www.openaire.eu/images/OpenAIRE_branding/Symbol.png" height="30px" width="30px">-->
609
                <!--</span>-->
610
              <!--</div>-->
611
              <!--<a class="uk-link" href="{{linkToCountryInOpenAIRE}}" target="_blank">Country page in <strong>OpenAIRE</strong><i class="fas fa-long-arrow-alt-right uk-margin-left"></i></a>-->
612
            <!--</div>-->
613
          <!--</div>-->
614
        <!--</div>-->
615
      <!--</aside>-->
614
              <!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>-->
615
            </div>
616
          </li>
617
          <!--OPEN SCIENCE tab-->
618
          <li aria-hidden="true" style="animation-duration: 200ms;">
619
            <div class="uk-margin tabContent">
620
              <app-data-view></app-data-view>
621
              <!--<app-countries-table [isPercentage]="false" [type]="'openScience'" [countries]="overviewData.countries"></app-countries-table>-->
622
            </div>
623
          </li>
624
          <li aria-hidden="true">
625
            <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="">
626
            </div>
627
          </li>
628
          <li aria-hidden="true">
629
            <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="">
630
            </div>
631
          </li>
632
          <li aria-hidden="true">
633
            <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="">
634
            </div>
635
          </li>
636
        </ul>
637
      </div>
616 638

  
617 639
    </div>
640
  </section>
618 641

  
642

  
643
  <!--link to OpenAIRE page-->
644
  <!--MOBILE & PAD PORTRAIT-->
645
  <div class="uk-hidden@m">
646
    <div class="uk-text-center uk-margin-xlarge-top uk-margin-large-bottom">
647

  
648
      <div class="uk-text-center uk-margin-medium-bottom">
649
                <span class="openaire-symbol-wrapper">
650
                  <img class="" src="https://www.openaire.eu/images/OpenAIRE_branding/Symbol.png" height="30px" width="30px">
651
                </span>
652
      </div>
653
      <a class="uk-link primary" href="{{linkToCountryInOpenAIRE}}" target="_blank">Country page in <strong>OpenAIRE</strong><i class="fas fa-long-arrow-alt-right uk-margin-left"></i></a>
654
    </div>
619 655
  </div>
620
</section>
656

  
657
</div>
658

  

Also available in: Unified diff