@gov-cy/govcy-frontend-renderer 1.21.0 → 1.22.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -503,6 +503,8 @@ If your using the `pageData.layout`, you can render html in each of the followin
|
|
|
503
503
|
- **main**: the main content
|
|
504
504
|
- **footer**: the footer section
|
|
505
505
|
- **bodyEnd**: the end of the body
|
|
506
|
+
- **afterBody**: the section after the body. Usually reserved for overlay elements
|
|
507
|
+
- **afterJS**: the section after the JS. Usually reserved for JS scripts
|
|
506
508
|
|
|
507
509
|
Use the `govcyElement` macro inside the blocks to render the design elements defined in the `govcyElement.njk` template. More details in defining design elements see in the [design elements](DESIGN_ELEMENTS.md) section.
|
|
508
510
|
|
|
@@ -559,6 +561,8 @@ If your using the `pageData.layout`, you can render html in each of the followin
|
|
|
559
561
|
- **main**: the main content
|
|
560
562
|
- **footer**: the footer section
|
|
561
563
|
- **bodyEnd**: the end of the body
|
|
564
|
+
- **afterBody**: the section after the body. Usually reserved for overlay elements
|
|
565
|
+
- **afterJS**: the section after the JS. Usually reserved for JS scripts
|
|
562
566
|
|
|
563
567
|
Define your design elements for each `sections` under the `elements` array. These elements use the same `govcyElement` macro to render the design elements. Do that by defining the `element` and `params` objects. For example:
|
|
564
568
|
|
|
@@ -5392,6 +5392,23 @@ var t_9 = t_3.govcyGetContent;
|
|
|
5392
5392
|
cb(new Error("cannot import 'govcyGetContent'")); return;
|
|
5393
5393
|
}
|
|
5394
5394
|
context.setVariable("govcyGetContent", t_9);
|
|
5395
|
+
if(runtime.memberLookup((l_params),"entryCount")) {
|
|
5396
|
+
var t_10;
|
|
5397
|
+
t_10 = (lineno = 52, colno = 39, runtime.callWrap(t_9, "govcyGetContent", context, ["common_entry",runtime.memberLookup((l_params),"lang")]));
|
|
5398
|
+
frame.set("entryText", t_10, true);
|
|
5399
|
+
if(frame.topLevel) {
|
|
5400
|
+
context.setVariable("entryText", t_10);
|
|
5401
|
+
}
|
|
5402
|
+
if(frame.topLevel) {
|
|
5403
|
+
context.addExport("entryText", t_10);
|
|
5404
|
+
}
|
|
5405
|
+
t_2 += "<h3 class=\"govcy-visually-hidden\">";
|
|
5406
|
+
t_2 += runtime.suppressValue(runtime.contextOrFrameLookup(context, frame, "entryText"), env.opts.autoescape);
|
|
5407
|
+
t_2 += " ";
|
|
5408
|
+
t_2 += runtime.suppressValue(runtime.memberLookup((l_params),"entryCount"), env.opts.autoescape);
|
|
5409
|
+
t_2 += "</h3>";
|
|
5410
|
+
;
|
|
5411
|
+
}
|
|
5395
5412
|
t_2 += "<dl ";
|
|
5396
5413
|
if(runtime.memberLookup((l_params),"id")) {
|
|
5397
5414
|
t_2 += "id=\"";
|
|
@@ -5414,25 +5431,8 @@ t_2 += runtime.suppressValue(runtime.memberLookup((l_params),"classes"), env.opt
|
|
|
5414
5431
|
;
|
|
5415
5432
|
}
|
|
5416
5433
|
t_2 += "\"";
|
|
5417
|
-
t_2 += runtime.suppressValue((lineno =
|
|
5434
|
+
t_2 += runtime.suppressValue((lineno = 55, colno = 239, runtime.callWrap(t_7, "govcyLangAttribute", context, [runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
|
|
5418
5435
|
t_2 += ">";
|
|
5419
|
-
if(runtime.memberLookup((l_params),"entryCount")) {
|
|
5420
|
-
var t_10;
|
|
5421
|
-
t_10 = (lineno = 53, colno = 43, runtime.callWrap(t_9, "govcyGetContent", context, ["common_entry",runtime.memberLookup((l_params),"lang")]));
|
|
5422
|
-
frame.set("entryText", t_10, true);
|
|
5423
|
-
if(frame.topLevel) {
|
|
5424
|
-
context.setVariable("entryText", t_10);
|
|
5425
|
-
}
|
|
5426
|
-
if(frame.topLevel) {
|
|
5427
|
-
context.addExport("entryText", t_10);
|
|
5428
|
-
}
|
|
5429
|
-
t_2 += "<dt><span class=\"govcy-visually-hidden\">";
|
|
5430
|
-
t_2 += runtime.suppressValue(runtime.contextOrFrameLookup(context, frame, "entryText"), env.opts.autoescape);
|
|
5431
|
-
t_2 += " ";
|
|
5432
|
-
t_2 += runtime.suppressValue(runtime.memberLookup((l_params),"entryCount"), env.opts.autoescape);
|
|
5433
|
-
t_2 += "</span></dt>";
|
|
5434
|
-
;
|
|
5435
|
-
}
|
|
5436
5436
|
frame = frame.push();
|
|
5437
5437
|
var t_13 = runtime.memberLookup((l_params),"items");
|
|
5438
5438
|
if(t_13) {t_13 = runtime.fromIterator(t_13);
|
package/package.json
CHANGED
|
@@ -48,12 +48,12 @@
|
|
|
48
48
|
{% macro summaryList(params) -%}
|
|
49
49
|
{#- Import localizer from utilities -#}
|
|
50
50
|
{%- from "../utilities/govcyUtilities.njk" import govcyLocalizeContent, govcyLangAttribute, govcyElementsFromArray, govcyGetContent -%}
|
|
51
|
+
{#- Render visually hidden text for screen readers the entry number -#}
|
|
52
|
+
{%- if params.entryCount -%}
|
|
53
|
+
{%- set entryText = govcyGetContent('common_entry', params.lang) -%}
|
|
54
|
+
<h3 class="govcy-visually-hidden">{{ entryText }} {{ params.entryCount}}</h3>
|
|
55
|
+
{%- endif -%}
|
|
51
56
|
<dl {% if params.id %}id="{{ params.id }}" {% endif %}class="{% if not params.isInnerList %}govcy-summary-list{% else %}govcy-summary-list-row-internal{% endif %}{% if params.classes %} {{ params.classes }}{% endif %}"{{ govcyLangAttribute(params.lang) }}>
|
|
52
|
-
{#- Render visually hidden text for screen readers the entry number -#}
|
|
53
|
-
{%- if params.entryCount -%}
|
|
54
|
-
{%- set entryText = govcyGetContent('common_entry', params.lang) -%}
|
|
55
|
-
<dt><span class="govcy-visually-hidden">{{ entryText }} {{ params.entryCount}}</span></dt>
|
|
56
|
-
{%- endif -%}
|
|
57
57
|
{%- for item in params.items %}
|
|
58
58
|
{% if not params.isInnerList %}<div class="govcy-summary-list-row">{% endif %}
|
|
59
59
|
{#- KEY -#}
|
|
@@ -141,7 +141,11 @@ To use this template you need to pass the following data:
|
|
|
141
141
|
|
|
142
142
|
<!-- CSS -->
|
|
143
143
|
<link rel="stylesheet" href="{{ site.cdn.dist }}/css/govcy.uds.min.css"{% if site.cdn.cssIntegrity %} integrity="{{ site.cdn.cssIntegrity }}" crossorigin="anonymous"{% endif%}>
|
|
144
|
-
|
|
144
|
+
<style>
|
|
145
|
+
dl.govcy-summary-list-row-internal:not(:first-of-type) {
|
|
146
|
+
margin-top: 0.5rem !important;
|
|
147
|
+
}
|
|
148
|
+
</style>
|
|
145
149
|
<title>{% if pageData.title %}{{ govcyLocalizeContent(pageData.title, site.lang) }} - {% endif %}{% if site.title %}{{ govcyLocalizeContent(site.title, site.lang) }} - {% endif %}gov.cy</title>
|
|
146
150
|
<meta name="description" content="{{ govcyLocalizeContent(site.description, site.lang) }}">
|
|
147
151
|
{% if site.matomo and site.matomo.url and site.matomo.siteId %}
|
|
@@ -162,115 +166,122 @@ To use this template you need to pass the following data:
|
|
|
162
166
|
{% endif %}
|
|
163
167
|
</head>
|
|
164
168
|
<body>
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
<
|
|
168
|
-
|
|
169
|
-
|
|
169
|
+
<div id="govcy--body">
|
|
170
|
+
<!--bodyStart-->
|
|
171
|
+
<section class="govcy-container-fluid" id="bodyStartContainer">
|
|
172
|
+
<a href="#mainContainer" class="govcy-skip-link">{%- if site.lang=='el' -%}Μεταφορά στο κεντρικό περιεχόμενο{%- else -%}Skip to main content{%- endif -%}</a>
|
|
173
|
+
{% block bodyStart %}{% endblock %}
|
|
174
|
+
</section>
|
|
170
175
|
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
176
|
+
<!--Header-->
|
|
177
|
+
<header class="govcy-header govcy-d-print-none" id="headerContainer">
|
|
178
|
+
{% block userName %}{% endblock %}
|
|
179
|
+
{% block header %}
|
|
180
|
+
<div class="govcy-header-main-area">
|
|
181
|
+
<div class="govcy-container govcy-main-area-items">
|
|
182
|
+
<div class="govcy-navigation-container">
|
|
183
|
+
<div class="govcy-service-container">
|
|
184
|
+
<a href="https://gov.cy" class="govcy-logo" title="Go to the gov.cy homepage"><img alt="gov.cy Logo"></a>
|
|
185
|
+
<span class="govcy-service-name">{{ govcyLocalizeContent(site.headerTitle, site.lang) }}</span>
|
|
186
|
+
</div>
|
|
187
|
+
{%- if site.languages -%}
|
|
188
|
+
<ul class="govcy-menu-items">
|
|
189
|
+
{%- for iLang in site.languages %}
|
|
190
|
+
<li class="govcy-desktop-menu-only"><span><a href="{{ iLang.href }}"
|
|
191
|
+
class="govcy-menu-item{% if iLang.code == site.lang %} active{% endif %}"
|
|
192
|
+
{% if iLang.code == site.lang %} aria-current="true"{% endif %}
|
|
193
|
+
aria-label="{{ iLang.alt }}" lang="{{ iLang.code }}">{{ iLang.label }}</a></span>
|
|
194
|
+
</li>{%- endfor %}
|
|
195
|
+
<li class="govcy-mobile-menu govcy-mobile-menu-only govcy-dropdown govcy-ms-auto"><span><a href="#" class="govcy-menu-item govcy-expand-btn">{{ govcyLocalizeContent(pageData.menu, site.lang) }}</a></span></li>
|
|
196
|
+
</ul>
|
|
197
|
+
{%- endif %}
|
|
181
198
|
</div>
|
|
182
|
-
{%- if site.languages -%}
|
|
183
|
-
<ul class="govcy-menu-items">
|
|
184
|
-
{%- for iLang in site.languages %}
|
|
185
|
-
<li class="govcy-desktop-menu-only"><span><a href="{{ iLang.href }}"
|
|
186
|
-
class="govcy-menu-item{% if iLang.code == site.lang %} active{% endif %}"
|
|
187
|
-
{% if iLang.code == site.lang %} aria-current="true"{% endif %}
|
|
188
|
-
aria-label="{{ iLang.alt }}" lang="{{ iLang.code }}">{{ iLang.label }}</a></span>
|
|
189
|
-
</li>{%- endfor %}
|
|
190
|
-
<li class="govcy-mobile-menu govcy-mobile-menu-only govcy-dropdown govcy-ms-auto"><span><a href="#" class="govcy-menu-item govcy-expand-btn">{{ govcyLocalizeContent(pageData.menu, site.lang) }}</a></span></li>
|
|
191
|
-
</ul>
|
|
192
|
-
{%- endif %}
|
|
193
199
|
</div>
|
|
194
200
|
</div>
|
|
195
|
-
</div>
|
|
196
201
|
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
202
|
+
{%- if site.languages -%}
|
|
203
|
+
<div class="govcy-header-menu-area">
|
|
204
|
+
<nav class="govcy-mainmenu" aria-label="{{ govcyLocalizeContent(pageData.menu, site.lang) }}">
|
|
205
|
+
<div class="govcy-container">
|
|
206
|
+
<ul class="govcy-menu-items govcy-header-language-area govcy-mobile-menu-only">
|
|
207
|
+
{%- for iLang in site.languages %}
|
|
208
|
+
<li><a href="{{ iLang.href }}" class="govcy-menu-item{% if iLang.code == site.lang %} active{% endif %}" {% if iLang.code == site.lang %} aria-current="true"{% endif %} aria-label="{{ iLang.alt }}" lang="{{ iLang.code }}">{{ iLang.label }}</a></li>
|
|
209
|
+
{%- endfor %}
|
|
210
|
+
</ul>
|
|
211
|
+
</div>
|
|
212
|
+
</nav>
|
|
213
|
+
</div>
|
|
214
|
+
{%- endif %}
|
|
215
|
+
{% endblock %}
|
|
216
|
+
</header>
|
|
217
|
+
|
|
218
|
+
<!--beforeMain-->
|
|
219
|
+
<section class="govcy-container" id="beforeMainContainer">
|
|
220
|
+
{% block beforeMain %}{% endblock %}
|
|
221
|
+
{% if site.isTesting %}
|
|
222
|
+
<div class="govcy-phase-banner">
|
|
223
|
+
<span class="govcy-tag">TESTING</span>
|
|
224
|
+
<span class="govcy-ml-2">{{ govcyLocalizeContent({"en": "This is not a real service. It is only used for testing purposes. Any submissions made through this service will be ignored", "el": "Αυτή δεν είναι πραγματική υπηρεσία. Χρησιμοποιείται μόνο για σκοπούς δοκιμών. Οποιεσδήποτε υποβολές γίνουν μέσω της υπηρεσίας αυτής θα αγνοηθούν."}, site.lang) }}</span>
|
|
206
225
|
</div>
|
|
207
|
-
|
|
208
|
-
</
|
|
209
|
-
{%- endif %}
|
|
210
|
-
{% endblock %}
|
|
211
|
-
</header>
|
|
226
|
+
{% endif %}
|
|
227
|
+
</section>
|
|
212
228
|
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
<span class="govcy-ml-2">{{ govcyLocalizeContent({"en": "This is not a real service. It is only used for testing purposes. Any submissions made through this service will be ignored", "el": "Αυτή δεν είναι πραγματική υπηρεσία. Χρησιμοποιείται μόνο για σκοπούς δοκιμών. Οποιεσδήποτε υποβολές γίνουν μέσω της υπηρεσίας αυτής θα αγνοηθούν."}, site.lang) }}</span>
|
|
229
|
+
<!--main-->
|
|
230
|
+
<main class="govcy-container" id="mainContainer">
|
|
231
|
+
<div class="govcy-row">
|
|
232
|
+
<article class="govcy-col-{% if pageData.mainLayout=='max-width' %}12{% else %}8{% endif %}">
|
|
233
|
+
{% block main %}{% endblock %}
|
|
234
|
+
</article>
|
|
220
235
|
</div>
|
|
221
|
-
|
|
222
|
-
</section>
|
|
236
|
+
</main>
|
|
223
237
|
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
<div class="govcy-container">
|
|
237
|
-
<div class="govcy-d-flex govcy-justify-content-between govcy-align-items-end govcy-flex-wrap">
|
|
238
|
-
<div class="govcy-my-4">
|
|
239
|
-
{%- if site.footerLinks %}
|
|
240
|
-
<ul>
|
|
241
|
-
{%- for iLink in site.footerLinks %}
|
|
242
|
-
<li><a href="{{ iLink.href }}">{{ govcyLocalizeContent(iLink.label, site.lang) }}</a></li>
|
|
243
|
-
{%- endfor %}
|
|
244
|
-
</ul>
|
|
245
|
-
{%- endif %}
|
|
246
|
-
<div class="govcy-d-flex govcy-align-items-center govcy-flex-wrap">
|
|
247
|
-
<span class="govcy-fs-2 govcy-fw-bold govcy-mr-6">gov.cy</span>
|
|
248
|
-
<span class="govcy-mr-6 govcy-mt-2">© {{ govcyLocalizeContent(site.copyrightText, site.lang) }}</span>
|
|
249
|
-
{%- if site.footerIcons %}
|
|
250
|
-
{% for footerIcon in site.footerIcons %}
|
|
251
|
-
{#- src, alt and href are mandatory -#}
|
|
252
|
-
{%- if footerIcon.src and footerIcon.alt and footerIcon.href -%}
|
|
253
|
-
<a href="{{ govcyLocalizeContent(footerIcon.href, site.lang, true) }}"{% if footerIcon.target %} target="{{ footerIcon.target }}"{% endif %}{% if footerIcon.title %} title="{{ govcyLocalizeContent(footerIcon.title, site.lang) }}"{% endif %}>
|
|
254
|
-
<img class="govcy-eu-logo govcy-mb-2{% if footerIcon.classes %} {{ footerIcon.classes }}{% endif %}" src="{{ govcyLocalizeContent(footerIcon.src, site.lang, true) }}" alt="{{ govcyLocalizeContent(footerIcon.alt, site.lang, true) }}"{% if footerIcon.style %} style="{{ govcyLocalizeContent(footerIcon.style, site.lang, true) }}"{% endif %}>
|
|
255
|
-
</a>
|
|
256
|
-
{%- endif %}
|
|
257
|
-
{% endfor %}
|
|
238
|
+
<!-- Footer -->
|
|
239
|
+
<footer class="govcy-footer govcy-d-print-none" id="footerContainer">
|
|
240
|
+
{% block footer %}
|
|
241
|
+
<div class="govcy-container">
|
|
242
|
+
<div class="govcy-d-flex govcy-justify-content-between govcy-align-items-end govcy-flex-wrap">
|
|
243
|
+
<div class="govcy-my-4">
|
|
244
|
+
{%- if site.footerLinks %}
|
|
245
|
+
<ul>
|
|
246
|
+
{%- for iLink in site.footerLinks %}
|
|
247
|
+
<li><a href="{{ iLink.href }}">{{ govcyLocalizeContent(iLink.label, site.lang) }}</a></li>
|
|
248
|
+
{%- endfor %}
|
|
249
|
+
</ul>
|
|
258
250
|
{%- endif %}
|
|
251
|
+
<div class="govcy-d-flex govcy-align-items-center govcy-flex-wrap">
|
|
252
|
+
<span class="govcy-fs-2 govcy-fw-bold govcy-mr-6">gov.cy</span>
|
|
253
|
+
<span class="govcy-mr-6 govcy-mt-2">© {{ govcyLocalizeContent(site.copyrightText, site.lang) }}</span>
|
|
254
|
+
{%- if site.footerIcons %}
|
|
255
|
+
{% for footerIcon in site.footerIcons %}
|
|
256
|
+
{#- src, alt and href are mandatory -#}
|
|
257
|
+
{%- if footerIcon.src and footerIcon.alt and footerIcon.href -%}
|
|
258
|
+
<a href="{{ govcyLocalizeContent(footerIcon.href, site.lang, true) }}"{% if footerIcon.target %} target="{{ footerIcon.target }}"{% endif %}{% if footerIcon.title %} title="{{ govcyLocalizeContent(footerIcon.title, site.lang) }}"{% endif %}>
|
|
259
|
+
<img class="govcy-eu-logo govcy-mb-2{% if footerIcon.classes %} {{ footerIcon.classes }}{% endif %}" src="{{ govcyLocalizeContent(footerIcon.src, site.lang, true) }}" alt="{{ govcyLocalizeContent(footerIcon.alt, site.lang, true) }}"{% if footerIcon.style %} style="{{ govcyLocalizeContent(footerIcon.style, site.lang, true) }}"{% endif %}>
|
|
260
|
+
</a>
|
|
261
|
+
{%- endif %}
|
|
262
|
+
{% endfor %}
|
|
263
|
+
{%- endif %}
|
|
264
|
+
</div>
|
|
265
|
+
</div>
|
|
266
|
+
<div class="govcy-my-4">
|
|
267
|
+
<a href="https://gov.cy" class="govcy-footer-logo" title="Go to the gov.cy homepage"><img alt="gov.cy Logo"/></a>
|
|
259
268
|
</div>
|
|
260
|
-
</div>
|
|
261
|
-
<div class="govcy-my-4">
|
|
262
|
-
<a href="https://gov.cy" class="govcy-footer-logo" title="Go to the gov.cy homepage"><img alt="gov.cy Logo"/></a>
|
|
263
269
|
</div>
|
|
264
270
|
</div>
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
</footer>
|
|
271
|
+
{% endblock %}
|
|
272
|
+
</footer>
|
|
268
273
|
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
274
|
+
<!--bodyEnd-->
|
|
275
|
+
<section class="govcy-container-fluid" id="bodyEndContainer">
|
|
276
|
+
{% block bodyEnd %}{% endblock %}
|
|
277
|
+
</section>
|
|
278
|
+
</div>
|
|
279
|
+
<div id="govcy--afterBody">
|
|
280
|
+
{% block afterBody %}{% endblock %}
|
|
281
|
+
</div>
|
|
282
|
+
<!-- JS -->
|
|
273
283
|
{%- if site.lang == 'en' -%}<script src="{{ site.cdn.dist }}/js/locales/govcy.datepicker.en.min.js"></script>{%- elseif site.lang == 'el' -%}<script src="{{ site.cdn.dist }}/js/locales/govcy.datepicker.el.min.js"></script>{%- endif -%}
|
|
274
284
|
<script src="{{ site.cdn.dist }}/js/govcy.uds.min.js"{% if site.cdn.jsIntegrity %} integrity="{{ site.cdn.jsIntegrity }}" crossorigin="anonymous"{% endif %}></script>
|
|
285
|
+
{% block afterJS %}{% endblock %}
|
|
275
286
|
</body>
|
|
276
287
|
</html>
|