@gov-cy/govcy-frontend-renderer 1.14.0 → 1.14.2

package/README.md

@@ -14,11 +14,11 @@ The rendered HTML should:
 - Allow multiple languages
 - Be tested
 
-The project is not intended to be used for production purposes, but your welcome to try.
+Though the project is not intended to be used for production purposes and does provide any guaranties, your welcome to try it.
 
 The project uses [nunjucks](https://mozilla.github.io/nunjucks/) templates to built the html.
 
-The package currently works with the **version 3.0.0** of the design system.
+The package currently works with the **version 3.2.0** of the design system.
 
 ## Features
 

package/dist/govcyCompiledTemplates.browser.js

@@ -3731,7 +3731,6 @@ context.addExport("ofLabel", t_18);
 ;
 }
 if(runtime.contextOrFrameLookup(context, frame, "current") && runtime.contextOrFrameLookup(context, frame, "total")) {
-t_2 += "<style>\r\n.govcy-step-indicator {\r\n    margin-left: 0px;\r\n    margin-right: 0px;\r\n    margin-bottom: .5rem !important;\r\n}\r\n.govcy-step-indicator__segments {\r\n    display: flex;\r\n    list-style: none;\r\n    margin: 0px;\r\n    padding: 0px;\r\n}\r\n\r\n.govcy-step-indicator__segment {\r\n    flex: 1 1 0%;\r\n    margin-left: 1px;\r\n    margin-right: 1px;\r\n    max-width: 15rem;\r\n    min-height: 0.5rem;\r\n    position: relative;\r\n}\r\n\r\n.govcy-step-indicator__segment::after {\r\n    background-color: #A6A8AA;\r\n    content: \"\";\r\n    display: block;\r\n    height: 0.5rem;\r\n    left: 0px;\r\n    position: absolute;\r\n    right: 0px;\r\n    top: 0px;\r\n}\r\n.govcy-step-indicator__segment--complete::after {\r\n    background-color: #254355;\r\n}\r\n.govcy-step-indicator__segment--current::after {\r\n    background-color: #1D70B8;\r\n}\r\n\r\n/* Label */\r\n.govcy-step-indicator__label {\r\n    padding-left: 0.5rem;\r\n    padding-right: 0.5rem;\r\n    text-align: center;\r\n    color: #6d6e70;\r\n    line-height:1.1rem;\r\n    margin-top: calc(0.75rem);\r\n}\r\n\r\n.govcy-step-indicator__segment--complete .govcy-step-indicator__label {\r\n    color: #254355;\r\n}\r\n\r\n.govcy-step-indicator__segment--current .govcy-step-indicator__label {\r\n    color: #1D70B8;\r\n    font-weight: 700;\r\n}\r\n\r\n@media (min-width: 0px) {\r\n    .govcy-step-indicator__counter {\r\n        margin-bottom: .5rem !important;\r\n    }\r\n    .govcy-step-indicator__current-counter {\r\n        width: 24px;\r\n        height: 24px;\r\n        border:1px solid #1D70B8;\r\n        background: #1D70B8;\r\n        color:#fff;\r\n        border-radius: 9999px;\r\n        font-weight: 600;\r\n        display:inline-block;\r\n        text-align:center;\r\n    }\r\n    /* Hide label on small screens */\r\n    .govcy-step-indicator__label {\r\n        display:none;\r\n    }\r\n}\r\n@media (min-width: 768px) {\r\n    .govcy-step-indicator__counter {\r\n        font-size:20px;\r\n        line-height:19px;\r\n        margin-bottom: .5rem !important;\r\n    }\r\n    .govcy-step-indicator__current-counter {\r\n        border-radius:9999px;\r\n        border:1px solid #1D70B8;\r\n        background: #1D70B8;\r\n        color:#fff;\r\n        padding:10px;\r\n        line-height:19px;\r\n        font-weight:600;\r\n        font-size:20px;\r\n        display:inline-block;\r\n        width:40px;\r\n        height:40px;\r\n        text-align:center;\r\n    }\r\n    /* Show label on big screens */\r\n    .govcy-step-indicator__label {\r\n        display:block;\r\n    }\r\n}\r\n</style>";
 if(runtime.contextOrFrameLookup(context, frame, "showSteps")) {
 t_2 += "\r\n        <div ";
 if(runtime.memberLookup((l_params),"id")) {
@@ -3747,10 +3746,10 @@ t_2 += runtime.suppressValue(runtime.memberLookup((l_params),"classes"), env.opt
 ;
 }
 t_2 += "\"";
-t_2 += runtime.suppressValue((lineno = 160, colno = 167, runtime.callWrap(t_7, "govcyLangAttribute", context, [runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
+t_2 += runtime.suppressValue((lineno = 55, colno = 167, runtime.callWrap(t_7, "govcyLangAttribute", context, [runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
 t_2 += ">\r\n            <ol class=\"govcy-step-indicator__segments\">";
 frame = frame.push();
-var t_21 = (lineno = 162, colno = 26, runtime.callWrap(runtime.contextOrFrameLookup(context, frame, "range"), "range", context, [1,runtime.contextOrFrameLookup(context, frame, "total") + 1]));
+var t_21 = (lineno = 57, colno = 26, runtime.callWrap(runtime.contextOrFrameLookup(context, frame, "range"), "range", context, [1,runtime.contextOrFrameLookup(context, frame, "total") + 1]));
 if(t_21) {t_21 = runtime.fromIterator(t_21);
 var t_20 = t_21.length;
 for(var t_19=0; t_19 < t_21.length; t_19++) {
@@ -3780,7 +3779,7 @@ t_2 += " aria-current=\"step\"";
 t_2 += ">";
 if(runtime.memberLookup((l_params),"steps") && runtime.memberLookup((runtime.memberLookup((l_params),"steps")),t_22 - 1) && runtime.memberLookup((runtime.memberLookup((runtime.memberLookup((l_params),"steps")),t_22 - 1)),"text")) {
 t_2 += "<span class=\"govcy-step-indicator__label\">\r\n                        ";
-t_2 += runtime.suppressValue((lineno = 166, colno = 47, runtime.callWrap(t_6, "govcyLocalizeContent", context, [runtime.memberLookup((runtime.memberLookup((runtime.memberLookup((l_params),"steps")),t_22 - 1)),"text"),runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
+t_2 += runtime.suppressValue((lineno = 61, colno = 47, runtime.callWrap(t_6, "govcyLocalizeContent", context, [runtime.memberLookup((runtime.memberLookup((runtime.memberLookup((l_params),"steps")),t_22 - 1)),"text"),runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
 if(t_22 < runtime.contextOrFrameLookup(context, frame, "current")) {
 t_2 += "\r\n                                <span class=\"govcy-visually-hidden\">";
 t_2 += runtime.suppressValue(runtime.contextOrFrameLookup(context, frame, "completedLabel"), env.opts.autoescape);
@@ -3815,7 +3814,7 @@ t_2 += "-counter\" ";
 ;
 }
 t_2 += "class=\"govcy-step-indicator__counter\"";
-t_2 += runtime.suppressValue((lineno = 179, colno = 125, runtime.callWrap(t_7, "govcyLangAttribute", context, [runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
+t_2 += runtime.suppressValue((lineno = 74, colno = 125, runtime.callWrap(t_7, "govcyLangAttribute", context, [runtime.memberLookup((l_params),"lang")])), env.opts.autoescape);
 t_2 += ">\r\n        <span class=\"govcy-visually-hidden\">";
 t_2 += runtime.suppressValue(runtime.contextOrFrameLookup(context, frame, "stepLabel"), env.opts.autoescape);
 t_2 += " </span>\r\n        <span class=\"govcy-step-indicator__current-counter\">";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gov-cy/govcy-frontend-renderer",
-  "version": "1.14.0",
+  "version": "1.14.2",
   "description": "Render html for design elements of the Unified design system using njk or json template.",
   "author": "DMRID - DSF Team",
   "license": "MIT",

package/src/njk/elements/progressList.njk

@@ -52,111 +52,6 @@
 {%- endif -%}
 {#- current and total are mandatory -#}
 {%- if current and total %}
-{#- style to be removed after included in the UDS -#}
-<style>
-.govcy-step-indicator {
-    margin-left: 0px;
-    margin-right: 0px;
-    margin-bottom: .5rem !important;
-}
-.govcy-step-indicator__segments {
-    display: flex;
-    list-style: none;
-    margin: 0px;
-    padding: 0px;
-}
-
-.govcy-step-indicator__segment {
-    flex: 1 1 0%;
-    margin-left: 1px;
-    margin-right: 1px;
-    max-width: 15rem;
-    min-height: 0.5rem;
-    position: relative;
-}
-
-.govcy-step-indicator__segment::after {
-    background-color: #A6A8AA;
-    content: "";
-    display: block;
-    height: 0.5rem;
-    left: 0px;
-    position: absolute;
-    right: 0px;
-    top: 0px;
-}
-.govcy-step-indicator__segment--complete::after {
-    background-color: #254355;
-}
-.govcy-step-indicator__segment--current::after {
-    background-color: #1D70B8;
-}
-
-/* Label */
-.govcy-step-indicator__label {
-    padding-left: 0.5rem;
-    padding-right: 0.5rem;
-    text-align: center;
-    color: #6d6e70;
-    line-height:1.1rem;
-    margin-top: calc(0.75rem);
-}
-
-.govcy-step-indicator__segment--complete .govcy-step-indicator__label {
-    color: #254355;
-}
-
-.govcy-step-indicator__segment--current .govcy-step-indicator__label {
-    color: #1D70B8;
-    font-weight: 700;
-}
-
-@media (min-width: 0px) {
-    .govcy-step-indicator__counter {
-        margin-bottom: .5rem !important;
-    }
-    .govcy-step-indicator__current-counter {
-        width: 24px;
-        height: 24px;
-        border:1px solid #1D70B8;
-        background: #1D70B8;
-        color:#fff;
-        border-radius: 9999px;
-        font-weight: 600;
-        display:inline-block;
-        text-align:center;
-    }
-    /* Hide label on small screens */
-    .govcy-step-indicator__label {
-        display:none;
-    }
-}
-@media (min-width: 768px) {
-    .govcy-step-indicator__counter {
-        font-size:20px;
-        line-height:19px;
-        margin-bottom: .5rem !important;
-    }
-    .govcy-step-indicator__current-counter {
-        border-radius:9999px;
-        border:1px solid #1D70B8;
-        background: #1D70B8;
-        color:#fff;
-        padding:10px;
-        line-height:19px;
-        font-weight:600;
-        font-size:20px;
-        display:inline-block;
-        width:40px;
-        height:40px;
-        text-align:center;
-    }
-    /* Show label on big screens */
-    .govcy-step-indicator__label {
-        display:block;
-    }
-}
-</style>
     {%- if showSteps %}
         <div {% if params.id %}id="{{ params.id }}" {% endif %}class="govcy-step-indicator{% if params.classes %} {{ params.classes }}{% endif %}"{{ govcyLangAttribute(params.lang) }}>
             <ol class="govcy-step-indicator__segments">

package/src/njk/layouts/govcyBase.njk

@@ -72,7 +72,7 @@ To use this template you need to pass the following data:
     <link rel="apple-touch-icon-precomposed" href="{{ site.cdn.dist }}/img/apple-touch-icon-57x57-precomposed.png">
  
     <!-- CSS -->
-    <link rel="stylesheet" href="{{ site.cdn.dist }}/css/govcy.uds.min.css" integrity="{{ site.cdn.cssIntegrity }}" crossorigin="anonymous">
+    <link rel="stylesheet" href="{{ site.cdn.dist }}/css/govcy.uds.min.css"{% if site.cdn.cssIntegrity %} integrity="{{ site.cdn.cssIntegrity }}" crossorigin="anonymous"{% endif%}>
     
     <title>{% if pageData.title %}{{ govcyLocalizeContent(pageData.title, site.lang) }} - {% endif %}{% if site.title %}{{ govcyLocalizeContent(site.title, site.lang) }} - {% endif %}gov.cy</title>
     <meta name="description" content="{{ govcyLocalizeContent(site.description, site.lang) }}">
@@ -178,6 +178,6 @@ To use this template you need to pass the following data:
         {% block bodyEnd %}{% endblock %}
     </section>
     {%- 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 -%}
-    <script src="{{ site.cdn.dist }}/js/govcy.uds.min.js" integrity="{{ site.cdn.jsIntegrity }}" crossorigin="anonymous"></script>
+    <script src="{{ site.cdn.dist }}/js/govcy.uds.min.js"{% if site.cdn.jsIntegrity %} integrity="{{ site.cdn.jsIntegrity }}" crossorigin="anonymous"{% endif %}></script>
   </body>
 </html>