|
1
|
|
|
2
|
<div>
|
|
3
|
<div class="uk-offcanvas-content">
|
|
4
|
|
|
5
|
<!--MOBILE & PAD PORTRAIT-->
|
|
6
|
<div class="tm-header-mobile uk-hidden@m">
|
|
7
|
|
|
8
|
<ng-container *ngIf="isHomeRoute() ; else smallHeader">
|
|
9
|
<div class="uk-hidden@m">
|
|
10
|
<a *ngIf="environmentName==='beta'" href="/"><img alt="BETA" class="medium-beta-indication-nonFixed" src="../../../assets/img/beta_flag.svg"></a>
|
|
11
|
</div>
|
|
12
|
<nav class="uk-navbar-container uk-navbar" uk-navbar>
|
|
13
|
<div class="uk-navbar-right">
|
|
14
|
|
|
15
|
<ul class="uk-navbar-nav">
|
|
16
|
<li>
|
|
17
|
<a class="" href="#offcanvas-nav" uk-toggle>
|
|
18
|
<div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon">
|
|
19
|
</div>
|
|
20
|
</a>
|
|
21
|
<!--<div class="uk-navbar-dropdown">-->
|
|
22
|
<!--<ul class="uk-nav uk-navbar-dropdown-nav">-->
|
|
23
|
<!--<li class="uk-active"><a routerLink="/home">Home</a></li>-->
|
|
24
|
<!--<li class="uk-active"><a [routerLink]="['/overview','europe']">OA in Europe</a></li>-->
|
|
25
|
<!--<!–<li class="uk-active"><a href="#">About</a></li>–>-->
|
|
26
|
<!--<li class="uk-active"><a routerLink="/methodology">Methodology</a></li>-->
|
|
27
|
<!--<!–<li class="uk-nav-divider"></li>–>-->
|
|
28
|
<!--<!–<li class="uk-active"><a routerLink="/home">Sign In</a></li>–>-->
|
|
29
|
<!--</ul>-->
|
|
30
|
<!--</div>-->
|
|
31
|
</li>
|
|
32
|
</ul>
|
|
33
|
|
|
34
|
</div>
|
|
35
|
</nav>
|
|
36
|
|
|
37
|
<nav class="uk-navbar-container uk-navbar" uk-navbar="">
|
|
38
|
<div class="uk-navbar-center">
|
|
39
|
<a class="uk-navbar-item uk-logo" routerLink="/home">
|
|
40
|
<img src="../../../assets/img/OS_Logo_Vertical.svg" alt="Open Science Observatory" width="161"
|
|
41
|
class="uk-responsive-height"> </a>
|
|
42
|
</div>
|
|
43
|
</nav>
|
|
44
|
</ng-container>
|
|
45
|
|
|
46
|
<ng-template #smallHeader>
|
|
47
|
<div class="uk-hidden@m">
|
|
48
|
<a *ngIf="environmentName==='beta'" href="/"><img alt="BETA" class="medium-beta-indication-fixed" src="../../../assets/img/beta_flag.svg"></a>
|
|
49
|
</div>
|
|
50
|
<nav class="uk-navbar-container uk-navbar smallHeader" uk-navbar>
|
|
51
|
<div class="uk-navbar-left">
|
|
52
|
<a class="uk-navbar-item uk-logo" routerLink="/home">
|
|
53
|
<img src="../../../assets/img/OS_Logo_small.svg" alt="Open Science Observatory" width="36"
|
|
54
|
class="uk-responsive-height"> </a>
|
|
55
|
</div>
|
|
56
|
|
|
57
|
<div class="uk-navbar-center">
|
|
58
|
|
|
59
|
<div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry">
|
|
60
|
<span id="search-icon" uk-search-icon></span>
|
|
61
|
<ng-autocomplete
|
|
62
|
[data]="countriesCollection"
|
|
63
|
[searchKeyword]="keyword"
|
|
64
|
placeHolder="Search for a country..."
|
|
65
|
(selected)='selectCountryFromAutocompleteEvent($event)'
|
|
66
|
(inputChanged)='onChangeSearch($event)'
|
|
67
|
(inputFocused)='onFocused($event)'
|
|
68
|
historyIdentifier="countriesCollection"
|
|
69
|
[itemTemplate]="itemTemplate"
|
|
70
|
[notFoundTemplate]="notFoundTemplate">
|
|
71
|
</ng-autocomplete>
|
|
72
|
|
|
73
|
<ng-template #itemTemplate let-item>
|
|
74
|
<a [innerHTML]="item.name"></a>
|
|
75
|
</ng-template>
|
|
76
|
|
|
77
|
<ng-template #notFoundTemplate let-notFound>
|
|
78
|
<div [innerHTML]="notFound"></div>
|
|
79
|
</ng-template>
|
|
80
|
</div>
|
|
81
|
|
|
82
|
<!--<div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry" data-uk-autocomplete="{source:'https://getuikit.com/v2/tests/components/_autocomplete.json'}">-->
|
|
83
|
<!--<span uk-search-icon></span>-->
|
|
84
|
<!--<input class="uk-search-input" type="search" placeholder="Search for a country...">-->
|
|
85
|
<!--<!–<input type="text">–>-->
|
|
86
|
<!--</div>-->
|
|
87
|
|
|
88
|
</div>
|
|
89
|
|
|
90
|
<div class="uk-navbar-right">
|
|
91
|
<ul class="uk-navbar-nav">
|
|
92
|
<li>
|
|
93
|
<a class="" href="#offcanvas-nav" uk-toggle>
|
|
94
|
<div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon">
|
|
95
|
</div>
|
|
96
|
</a>
|
|
97
|
<!--<div class="uk-navbar-dropdown">-->
|
|
98
|
<!--<ul class="uk-nav uk-navbar-dropdown-nav">-->
|
|
99
|
<!--<li class="uk-active"><a routerLink="/home">Home</a></li>-->
|
|
100
|
<!--<li class="uk-active"><a [routerLink]="['/overview', 'europe']">OA in Europe</a></li>-->
|
|
101
|
<!--<!–<li class="uk-active"><a href="#">About</a></li>–>-->
|
|
102
|
<!--<li class="uk-active"><a routerLink="/methodology">Methodology</a></li>-->
|
|
103
|
<!--<!–<li class="uk-nav-divider"></li>–>-->
|
|
104
|
<!--<!–<li class="uk-active"><a routerLink="/home">Sign In</a></li>–>-->
|
|
105
|
<!--</ul>-->
|
|
106
|
<!--</div>-->
|
|
107
|
</li>
|
|
108
|
</ul>
|
|
109
|
|
|
110
|
</div>
|
|
111
|
</nav>
|
|
112
|
|
|
113
|
</ng-template>
|
|
114
|
|
|
115
|
|
|
116
|
</div>
|
|
117
|
|
|
118
|
<div id="offcanvas-nav" class="tm-mobile uk-hidden@m" uk-offcanvas="flip: true; overlay: true;">
|
|
119
|
<!--<div class="uk-offcanvas-bar">-->
|
|
120
|
<div class="uk-offcanvas-bar-light">
|
|
121
|
|
|
122
|
<button class="uk-offcanvas-close" type="button" uk-close></button>
|
|
123
|
|
|
124
|
<ul class="uk-nav uk-nav-default">
|
|
125
|
<li [routerLinkActive]="['uk-active']"><a routerLink="/home" [routerLinkActive]="['uk-active']" class="uk-offcanvas-close custom-offcanvas-close">Home</a></li>
|
|
126
|
<li [routerLinkActive]="['uk-active']"><a [routerLink]="['/overview', 'europe']" [routerLinkActive]="['uk-active']" class="uk-offcanvas-close custom-offcanvas-close">OA in Europe</a></li>
|
|
127
|
<li class="uk-parent" [routerLinkActive]="['uk-active']">
|
|
128
|
<a href="#">Methodology</a>
|
|
129
|
<ul class="uk-nav-sub">
|
|
130
|
<li><a routerLink="/methodology" routerLinkActive="uk-active" class="uk-offcanvas-close custom-offcanvas-close">Overview</a></li>
|
|
131
|
<li><a routerLink="/methodology" fragment="terminology" routerLinkActive="uk-active" class="uk-offcanvas-close custom-offcanvas-close">Terminology and construction</a></li>
|
|
132
|
</ul>
|
|
133
|
</li>
|
|
134
|
<!--<li class="uk-nav-header">Header</li>-->
|
|
135
|
<!--<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: table"></span> Item</a></li>-->
|
|
136
|
<!--<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: thumbnails"></span> Item</a></li>-->
|
|
137
|
<!--<li class="uk-nav-divider"></li>-->
|
|
138
|
<!--<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: trash"></span> Item</a></li>-->
|
|
139
|
</ul>
|
|
140
|
|
|
141
|
</div>
|
|
142
|
</div>
|
|
143
|
|
|
144
|
<!--LAPTOP & PAD LANDSCAPE-->
|
|
145
|
<div class="uk-visible@m">
|
|
146
|
<a *ngIf="environmentName==='beta'" href="/"><img alt="BETA" class="large-beta-indication" src="../../../assets/img/beta_flag.svg"></a>
|
|
147
|
</div>
|
|
148
|
<div class="tm-header uk-visible@m tm-header-transparent" uk-header="">
|
|
149
|
<div class="uk-navbar-container uk-sticky uk-navbar-transparent" uk-sticky="top:0" media="768"
|
|
150
|
cls-active="uk-active uk-navbar-sticky" style="" animation="uk-animation-slide-top"
|
|
151
|
top=".tm-header + [class*="uk-section"]" cls-inactive="uk-navbar-transparent">
|
|
152
|
<div class="uk-container uk-container-expand">
|
|
153
|
<nav class="uk-navbar" uk-navbar="{"align":"left"}">
|
|
154
|
<div class="uk-navbar-left">
|
|
155
|
<a routerLink="/home" class="uk-logo uk-navbar-item">
|
|
156
|
<img src="../../../assets/img/OS_Logo_Horizontal.svg" alt="Open Science Observatory" class="uk-responsive-height">
|
|
157
|
</a>
|
|
158
|
</div>
|
|
159
|
|
|
160
|
<div class="uk-navbar-right">
|
|
161
|
|
|
162
|
<ul class="uk-navbar-nav" >
|
|
163
|
<li class="uk-parent" [routerLinkActive]="['uk-active']">
|
|
164
|
<a routerLink="/home" [routerLinkActive]="['uk-active']">
|
|
165
|
Home
|
|
166
|
</a>
|
|
167
|
</li>
|
|
168
|
<li class="uk-parent" [routerLinkActive]="['uk-active']">
|
|
169
|
<a [routerLink]="['/overview', 'europe']" [routerLinkActive]="['uk-active']">
|
|
170
|
OA in Europe
|
|
171
|
</a>
|
|
172
|
</li>
|
|
173
|
<!--<li class="uk-parent" [routerLinkActive]="['uk-active']">-->
|
|
174
|
<!--<a routerLink="/methodology" [routerLinkActive]="['uk-active']">-->
|
|
175
|
<!--Methodology-->
|
|
176
|
<!--</a>-->
|
|
177
|
<!--</li>-->
|
|
178
|
<li class="uk-parent" [routerLinkActive]="['uk-active']">
|
|
179
|
<a href="#" class="" aria-expanded="false">
|
|
180
|
Methodology
|
|
181
|
</a>
|
|
182
|
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 106.55px;" id="methodology" uk-toggle>
|
|
183
|
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
|
|
184
|
<div class="uk-first-column">
|
|
185
|
<ul class="uk-nav uk-navbar-dropdown-nav">
|
|
186
|
<!--<li><a [routerLink]="['/support/faqs']" routerLinkActive="uk-active">FAQs</a></li>-->
|
|
187
|
<li><a routerLink="/methodology" routerLinkActive="uk-active">Overview</a></li>
|
|
188
|
<li><a routerLink="/methodology" fragment="terminology" routerLinkActive="uk-active">Terminology and construction</a></li>
|
|
189
|
</ul>
|
|
190
|
</div>
|
|
191
|
</div>
|
|
192
|
</div>
|
|
193
|
</li>
|
|
194
|
<!--<li class="uk-parent" [routerLinkActive]="['uk-active']">-->
|
|
195
|
<!--<a routerLink="/home" [routerLinkActive]="['uk-active']">-->
|
|
196
|
<!--Sign In-->
|
|
197
|
<!--</a>-->
|
|
198
|
<!--</li>-->
|
|
199
|
|
|
200
|
</ul>
|
|
201
|
|
|
202
|
|
|
203
|
</div>
|
|
204
|
|
|
205
|
</nav>
|
|
206
|
</div>
|
|
207
|
</div>
|
|
208
|
|
|
209
|
<div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" hidden="hidden"></div>
|
|
210
|
</div>
|
|
211
|
|
|
212
|
</div>
|
|
213
|
</div>
|
|
214
|
|
|
215
|
|