Project

General

Profile

« Previous | Next » 

Revision 57746

Use uikit3 instead of the custom uikit2

View differences:

country-page.component.html
1
<section class="section greySection uk-padding-top-remove uk-padding-bottom-remove" id="sect-country-page">
2
  <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
<section class="section greySection uk-padding-remove" 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}">-->
3 4

  
5
    <!--<aside id="left-col" class="uk-light" uk-height-viewport="offset-bottom: 5">-->
6
      <!--<div class="bar-wrap">-->
7
        <!--<ul class="uk-nav-default uk-nav-parent-icon" uk-nav>-->
8
          <!--<li class="uk-active"><a href="#">Active</a></li>-->
9
          <!--<li class="uk-parent">-->
10
            <!--<a href="#">Parent</a>-->
11
            <!--<ul class="uk-nav-sub">-->
12
              <!--<li><a href="#">Sub item</a></li>-->
13
              <!--<li><a href="#">Sub item</a></li>-->
14
            <!--</ul>-->
15
          <!--</li>-->
16
          <!--<li class="uk-parent">-->
17
            <!--<a href="#">Parent</a>-->
18
            <!--<ul class="uk-nav-sub">-->
19
              <!--<li><a href="#">Sub item</a></li>-->
20
              <!--<li><a href="#">Sub item</a></li>-->
21
            <!--</ul>-->
22
          <!--</li>-->
23
          <!--<li class="uk-nav-header">Header</li>-->
24
          <!--<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: table"></span> Item</a></li>-->
25
          <!--<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: thumbnails"></span> Item</a></li>-->
26
          <!--<li class="uk-nav-divider"></li>-->
27
          <!--<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: trash"></span> Item</a></li>-->
28
        <!--</ul>-->
29
      <!--</div>-->
30
    <!--</aside>-->
31
    <!--<div id="right-col">-->
32
      <!--<div class="uk-container uk-margin-medium-top">-->
33
        <!--<div class="uk-grid uk-child-width-1-3" uk-grid>-->
34
          <!--<div>-->
35
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
36
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
37
          <!--</div>-->
38
          <!--<div>-->
39
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
40
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
41
          <!--</div>-->
42
          <!--<div>-->
43
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
44
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
45
          <!--</div>-->
46
          <!--<div class="uk-width-1-1">-->
47
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
48
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
49
          <!--</div>-->
50
          <!--<div>-->
51
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
52
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
53
          <!--</div>-->
54
          <!--<div>-->
55
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
56
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
57
          <!--</div>-->
58
          <!--<div>-->
59
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
60
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
61
          <!--</div>-->
62
          <!--<div class="uk-width-1-1">-->
63
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
64
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
65
          <!--</div>-->
66

  
67
        <!--</div>-->
68
        <!--<div class="uk-grid uk-child-width-1-3" uk-grid>-->
69
          <!--<div>-->
70
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
71
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
72
          <!--</div>-->
73
          <!--<div>-->
74
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
75
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
76
          <!--</div>-->
77
          <!--<div>-->
78
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
79
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
80
          <!--</div>-->
81
          <!--<div class="uk-width-1-1">-->
82
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
83
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
84
          <!--</div>-->
85
          <!--<div>-->
86
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
87
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
88
          <!--</div>-->
89
          <!--<div>-->
90
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
91
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
92
          <!--</div>-->
93
          <!--<div>-->
94
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
95
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
96
          <!--</div>-->
97
          <!--<div class="uk-width-1-1">-->
98
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
99
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
100
          <!--</div>-->
101

  
102
        <!--</div>-->
103
        <!--<div class="uk-grid uk-child-width-1-3" uk-grid>-->
104
          <!--<div>-->
105
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
106
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
107
          <!--</div>-->
108
          <!--<div>-->
109
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
110
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
111
          <!--</div>-->
112
          <!--<div>-->
113
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
114
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
115
          <!--</div>-->
116
          <!--<div class="uk-width-1-1">-->
117
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
118
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
119
          <!--</div>-->
120
          <!--<div>-->
121
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
122
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
123
          <!--</div>-->
124
          <!--<div>-->
125
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
126
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
127
          <!--</div>-->
128
          <!--<div>-->
129
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
130
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
131
          <!--</div>-->
132
          <!--<div class="uk-width-1-1">-->
133
            <!--<h3>Lorem ipsum, dolor sit amet consectetur adipisicing elit. </h3>-->
134
            <!--<p>Harum, amet magni repellat excepturi recusandae modi molestias voluptatum vero sint debitis eligendi blanditiis consectetur sunt mollitia provident iusto est, necessitatibus praesentium.</p>-->
135
          <!--</div>-->
136

  
137
        <!--</div>-->
138
      <!--</div>-->
139
    <!--</div>-->
140

  
141

  
4 142
    <div class="uk-grid uk-grid-small">
5 143

  
6
      <div class="uk-width-4-5">
144
      <div class="uk-width-4-5 uk-margin-medium-bottom">
7 145

  
8 146
        <div class="uk-container uk-container-expand uk-margin-medium-top">
9 147
          <div class="uk-text-right">
10 148
            <button class="md-btn md-btn-primary"><i class="fas fa-code uk-margin-small-right"></i>Embed</button>
11
            <button class="md-btn md-btn-primary uk-margin-left"><i class="fas fa-download uk-margin-small-right"></i>Data catalogues</button>
12
            <button class="md-btn md-btn-primary uk-margin-left"><i class="fas fa-file-pdf uk-margin-small-right"></i>PDF</button>
149
            <button class="md-btn md-btn-primary uk-margin-left"><i class="fas fa-download uk-margin-small-right"></i>Download CSV</button>
150
            <button class="md-btn md-btn-primary uk-margin-left"><i class="fas fa-file-pdf uk-margin-small-right"></i>Download PDF</button>
13 151
          </div>
14 152
        </div>
15 153

  
16 154
        <div class="uk-container uk-container-expand uk-margin-top">
17 155
          <!--Overview cards-->
18 156
          <div class="uk-width-1-1 indicatorCards">
19
            <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="">
157
            <div class="uk-grid uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m uk-child-width-1-5@l uk-margin-top uk-grid-match" data-uk-grid-margin="">
158
            <!--<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="">-->
20 159
              <div class="uk-row-first">
21 160
                <div class="md-card">
22 161
                  <div class="md-card-content">
......
27 166
                      <h2 class="uk-margin-remove">
28 167
                        <span class="number">18,165</span>
29 168
                        <!--<span *ngIf="overviewData.overview.publications?.oa" class="number">{{overviewData.overview.publications.oa | number}}</span>-->
30
                        <!--<span *ngIf="!overviewData.overview.publications || !overviewData.overview.publications.oa" class="number">&#45;&#45;</span>-->
169
                        <!--<span *ngIf="!overviewData.overview.publications || !overviewData.overview.publications.oa" class="number">--</span>-->
31 170
                      </h2>
32 171
                    </div>
33 172
                    <div class="uk-margin-top">
......
53 192
                      <h2 class="uk-margin-remove">
54 193
                        <span class="number">12,812</span>
55 194
                        <!--<span *ngIf="overviewData.overview.datasets?.oa" class="number">{{overviewData.overview.datasets.oa | number}}</span>-->
56
                        <!--<span *ngIf="!overviewData.overview.datasets || !overviewData.overview.datasets.oa" class="number">&#45;&#45;</span>-->
195
                        <!--<span *ngIf="!overviewData.overview.datasets || !overviewData.overview.datasets.oa" class="number">--</span>-->
57 196
                      </h2>
58 197
                    </div>
59 198
                    <div class="uk-margin-top">
......
79 218
                      <h2 class="uk-margin-remove">
80 219
                        <span class="number">512</span>
81 220
                        <!--<span *ngIf="overviewData.overview.repositories?.oa" class="number">{{overviewData.overview.repositories.oa | number}}</span>-->
82
                        <!--<span *ngIf="!overviewData.overview.repositories || !overviewData.overview.repositories.oa" class="number">&#45;&#45;</span>-->
221
                        <!--<span *ngIf="!overviewData.overview.repositories || !overviewData.overview.repositories.oa" class="number">--</span>-->
83 222
                      </h2>
84 223
                    </div>
85 224
                    <div class="uk-margin-top">
......
102 241
                      <h2 class="uk-margin-remove">
103 242
                        <span class="number">1356</span>
104 243
                        <!--<span *ngIf="overviewData.overview.journals?.oa" class="number">{{overviewData.overview.journals.oa | number}}</span>-->
105
                        <!--<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">&#45;&#45;</span>-->
244
                        <!--<span *ngIf="!overviewData.overview.journals || !overviewData.overview.journals.oa" class="number">--</span>-->
106 245
                      </h2>
107 246
                    </div>
108 247
                    <div class="uk-margin-top">
......
125 264
                      <h2 class="uk-margin-remove">
126 265
                        <span class="number">798</span>
127 266
                        <!--<span *ngIf="overviewData.overview.policies?.oa" class="number">{{overviewData.overview.policies.oa | number}}</span>-->
128
                        <!--<span *ngIf="!overviewData.overview.policies || !overviewData.overview.policies.oa" class="number">&#45;&#45;</span>-->
267
                        <!--<span *ngIf="!overviewData.overview.policies || !overviewData.overview.policies.oa" class="number">--</span>-->
129 268
                      </h2>
130 269
                    </div>
131 270
                    <div class="uk-margin-top">
......
142 281
          </div>
143 282
        </div>
144 283

  
284
        <!--GREEN VS. GOLD-->
285
        <div class="uk-container uk-container-expand uk-margin-medium-top">
286
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
287
            Green vs. Gold
288
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
289
          </h2>
290
          <div class="uk-grid">
291
            <div class="uk-width-1-2">
292
              <div class="md-card">
293
                <div class="md-card-toolbar">
294
                  <div class="md-card-toolbar-actions">
295
                    <i class="fas fa-lg fa-info-circle"></i>
296
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
297
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
298
                  </div>
299
                  <h3 class="md-card-toolbar-heading-text">
300
                    <!--Card Heading-->
301
                  </h3>
302
                </div>
303
                <div class="md-card-content">
304
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
305
              </div>
306
            </div>
307
            <div class="uk-width-1-2">
308
              <div class="md-card">
309
                <div class="md-card-toolbar">
310
                  <div class="md-card-toolbar-actions">
311
                    <i class="fas fa-lg fa-info-circle"></i>
312
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
313
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
314
                  </div>
315
                  <h3 class="md-card-toolbar-heading-text">
316
                    <!--Card Heading-->
317
                  </h3>
318
                </div>
319
                <div class="md-card-content">
320
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
321
              </div>
322
            </div>
323
          </div>
324
        </div>
145 325

  
326
        <!--EU FUNDED OPEN SCIENCE-->
327
        <div class="uk-container uk-container-expand uk-margin-medium-top">
328
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
329
            EU funded Open Science
330
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
331
          </h2>
332
          <div class="uk-grid">
333
            <div class="uk-width-1-1">
334
              <div class="md-card">
335
                <div class="md-card-toolbar">
336
                  <div class="md-card-toolbar-actions">
337
                    <i class="fas fa-lg fa-info-circle"></i>
338
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
339
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
340
                  </div>
341
                  <h3 class="md-card-toolbar-heading-text">
342
                    <!--Card Heading-->
343
                  </h3>
344
                </div>
345
                <div class="md-card-content">
346
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
347
              </div>
348
            </div>
349
          </div>
350
          <div class="uk-grid">
351
            <div class="uk-width-1-2">
352
              <div class="md-card">
353
                <div class="md-card-toolbar">
354
                  <div class="md-card-toolbar-actions">
355
                    <i class="fas fa-lg fa-info-circle"></i>
356
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
357
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
358
                  </div>
359
                  <h3 class="md-card-toolbar-heading-text">
360
                    <!--Card Heading-->
361
                  </h3>
362
                </div>
363
                <div class="md-card-content">
364
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
365
              </div>
366
            </div>
367
            <div class="uk-width-1-2">
368
              <div class="md-card">
369
                <div class="md-card-toolbar">
370
                  <div class="md-card-toolbar-actions">
371
                    <i class="fas fa-lg fa-info-circle"></i>
372
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
373
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
374
                  </div>
375
                  <h3 class="md-card-toolbar-heading-text">
376
                    <!--Card Heading-->
377
                  </h3>
378
                </div>
379
                <div class="md-card-content">
380
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
381
              </div>
382
            </div>
383
          </div>
384
        </div>
385

  
386
        <!--FUNDING SOURCES-->
387
        <div class="uk-container uk-container-expand uk-margin-medium-top">
388
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
389
            Funding sources
390
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
391
          </h2>
392
          <div class="uk-grid">
393
            <div class="uk-width-1-1">
394
              <div class="md-card">
395
                <div class="md-card-toolbar">
396
                  <div class="md-card-toolbar-actions">
397
                    <i class="fas fa-lg fa-info-circle"></i>
398
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
399
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
400
                  </div>
401
                  <h3 class="md-card-toolbar-heading-text">
402
                    <!--Card Heading-->
403
                  </h3>
404
                </div>
405
                <div class="md-card-content">
406
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
407
              </div>
408
            </div>
409
          </div>
410
        </div>
411

  
412
        <!--PROJECT PERFORMANCE-->
413
        <div class="uk-container uk-container-expand uk-margin-medium-top">
414
          <h2 class="heading_c uk-margin-medium-bottom uk-text-center-medium">
415
            Project performance
416
            <!--<span class="sub-heading">The Best Images From Around The World</span>-->
417
          </h2>
418
          <div class="uk-grid">
419
            <div class="uk-width-1-3">
420
              <div class="md-card">
421
                <div class="md-card-toolbar">
422
                  <div class="md-card-toolbar-actions">
423
                    <i class="fas fa-lg fa-info-circle"></i>
424
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
425
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
426
                  </div>
427
                  <h3 class="md-card-toolbar-heading-text">
428
                    <!--Card Heading-->
429
                  </h3>
430
                </div>
431
                <div class="md-card-content">
432
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
433
              </div>
434
            </div>
435
            <div class="uk-width-1-3">
436
              <div class="md-card">
437
                <div class="md-card-toolbar">
438
                  <div class="md-card-toolbar-actions">
439
                    <i class="fas fa-lg fa-info-circle"></i>
440
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
441
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
442
                  </div>
443
                  <h3 class="md-card-toolbar-heading-text">
444
                    <!--Card Heading-->
445
                  </h3>
446
                </div>
447
                <div class="md-card-content">
448
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
449
              </div>
450
            </div>
451
            <div class="uk-width-1-3">
452
              <div class="md-card">
453
                <div class="md-card-toolbar">
454
                  <div class="md-card-toolbar-actions">
455
                    <i class="fas fa-lg fa-info-circle"></i>
456
                    <i class="fas fa-lg fa-download uk-margin-left"></i>
457
                    <i class="fas fa-lg fa-file-pdf uk-margin-left"></i>
458
                  </div>
459
                  <h3 class="md-card-toolbar-heading-text">
460
                    <!--Card Heading-->
461
                  </h3>
462
                </div>
463
                <div class="md-card-content">
464
                  Expedita ut nobis voluptatem nostrum minima qui reiciendis placeat eaque quia enim aliquam sunt sed nihil in sapiente ea rerum aperiam nemo neque eius velit expedita fugiat pariatur sed et fuga inventore sed illo aut ea ipsa nesciunt adipisci id sed consequatur aliquam molestias dolores dolores debitis exercitationem laudantium quas excepturi qui qui esse neque id delectus saepe voluptatem et error et qui voluptates omnis quasi nulla minima consequuntur natus.                        </div>
465
              </div>
466
            </div>
467
          </div>
468
        </div>
146 469
      </div>
147 470

  
148 471
      <div class="uk-width-1-5 uk-padding-remove">
149
        <div id="sidebar_main" class="md-card dark-grey-box infoBox uk-sticky" uk-height-viewport="offset-bottom: 0">
472
        <div id="sidebar_main" class="md-card dark-grey-box infoBox">
150 473
          <div class="md-card-content">
151 474
            <h3 class="uk-text-center">{{countryName | uppercase}}</h3>
152 475

  

Also available in: Unified diff