@govuk-one-login/frontend-ui 1.3.1 → 1.3.3

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.
Files changed (9) hide show
  1. package/README.md +3 -26
  2. package/build/all.css +1 -1
  3. package/build/components/bases/auth/auth-base.njk +0 -1
  4. package/build/components/bases/home/home-base.njk +0 -1
  5. package/build/components/bases/identity/identity-base-form.njk +4 -0
  6. package/build/components/bases/ipv-core/ipv-core-base.njk +0 -2
  7. package/build/components/bases/mobile/mobile-base.njk +0 -2
  8. package/build/components/footer/_index.scss +1 -1
  9. package/package.json +1 -1
package/README.md CHANGED
@@ -122,9 +122,10 @@ or
122
122
  ```
123
123
 
124
124
  ### 6. Import all.css
125
- Import the css into your service in the `package.json` via the `build-sass` script.
125
+
126
+ The way is to import the frontend-ui all.css directly into the bottom of your existing css file
126
127
  ```
127
- sass --no-source-map ../../node_modules/@govuk-one-login/frontend-ui/build/all.css [WhereYouStoreStyleSheets]/frontendUi.css --style compressed"
128
+ @import "../../../node_modules/@govuk-one-login/frontend-ui/build/all";
128
129
  ```
129
130
 
130
131
  You will also need to add the following in order to ensure that the assets all load properly across the basefiles
@@ -132,30 +133,6 @@ You will also need to add the following in order to ensure that the assets all l
132
133
  "cp -R ../../node_modules/@govuk-one-login/frontend-ui/build/frontendUiAssets [OneLevelAboveWhereYouStoreStyleSheets/SameFolderAsStyleSheets]/"
133
134
  ```
134
135
 
135
- include a link to this in your template file, this has been done in the created basefiles already
136
- ```html
137
- {% block head %}
138
- '''
139
- <link rel="stylesheet" href="/[WhereYouStoreStyleSheets]/frontendUi.css"/>
140
- {% endblock %}
141
- ```
142
-
143
- Or alternatively you can import the frontend-ui all.css directly into your exisiting css file if you are having a 'flickering' issue
144
- ``` scss
145
- $govuk-assets-path: "/public/";
146
- $hmpo-summary-list: false;
147
-
148
- @import "../../../node_modules/govuk-frontend/govuk/all";
149
- @import "../../../node_modules/hmpo-components/all";
150
- @import "../../../node_modules/@govuk-one-login/frontend-language-toggle/stylesheet/styles";
151
- @import "../../../node_modules/accessible-autocomplete/dist/accessible-autocomplete.min";
152
- @import "components/button-spinner";
153
- @import "components/country-picker";
154
-
155
- @import "../../../node_modules/@govuk-one-login/frontend-ui/build/all.css"; // <--- HERE>
156
-
157
- ```
158
-
159
136
  ### 7. Add Component to Template
160
137
 
161
138
  Render the component in your template, passing any required data. For the Cookie Banner:
package/build/all.css CHANGED
@@ -1 +1 @@
1
- @media(max-width: 640px){.govuk-header__navigation-item{border-left:none !important}.govuk-template--rebranded .govuk-header__navigation-list{padding-bottom:0px !important}.govuk-header__navigation-item{padding-top:8px !important}}.frontendUi_header_signOut-item{padding:5px 0px 5px 30px;border-left:1px solid #b1b4b6;margin-left:auto}.frontendUi_header_signOut-item--rebrand{border-left:none;padding:5px 0px 5px 0px;margin-left:auto;font-weight:700 !important}.frontendUi_header__signOut{display:flex;flex-wrap:wrap}.frontendUi-header__content{margin-left:auto}.govuk-header__navigation--signOut{padding:15px 0 15px !important}.govuk-template--rebranded .govuk-header__navigation{padding:15px 0 15px !important}@media(max-width: 640px){.govuk-header__navigation--signOut{padding:18px 0 8px !important}.govuk-template--rebranded .govuk-header__navigation{padding:18px 0 8px !important}}.govuk-template--rebranded .govuk-header__navigation-item a{font-weight:700 !important}.govuk-template--rebranded .govuk-header__navigation-item{padding-top:5px !important}@media(min-width: 20em)and (max-width: 48.0525em){.govuk-template--rebranded .govuk-header__navigation-list{padding-bottom:0px}}@media(max-width: 323px){.govuk-header__logo{padding-right:5px}.frontendUi_header_signOut-item{padding-left:0px}}@media(max-width: 261px){.frontendUi-header__content{margin-left:unset}.govuk-template--rebranded .govuk-header__navigation{padding:0px 0 8px !important}.govuk-header__logotype{max-width:100%;max-height:auto}.govuk-template--rebranded .govuk-header__logo{padding-top:5% !important;padding-bottom:5% !important}}.govuk-tag{font-family:"GDS Transport",arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:700;font-size:14px;font-size:.875rem;line-height:1;display:inline-block;padding-top:5px;padding-right:8px;padding-bottom:4px;padding-left:8px;outline:2px solid rgba(0,0,0,0);outline-offset:-2px;color:#fff !important;background-color:#1d70b8 !important;letter-spacing:1px !important;text-decoration:none !important;text-transform:uppercase !important}/*! Copyright (c) 2011 by Margaret Calvert & Henrik Kubel. All rights reserved. The font has been customised for exclusive use on gov.uk. This cut is not commercially available. */@font-face{font-family:"GDS Transport";font-style:normal;font-weight:normal;src:url("/assets/fonts/light-94a07e06a1-v2.woff2") format("woff2"),url("/assets/fonts/light-f591b13f7d-v2.woff") format("woff");font-display:fallback}@font-face{font-family:"GDS Transport";font-style:normal;font-weight:bold;src:url("/assets/fonts/bold-b542beb274-v2.woff2") format("woff2"),url("/assets/fonts/bold-affa96571d-v2.woff") format("woff");font-display:fallback}@media print{.govuk-tag{font-family:sans-serif}}@media(min-width: 40.0625em){.govuk-tag{font-size:16px;font-size:1rem;line-height:1}}@media print{.govuk-tag{font-size:14pt;line-height:1}}@media(max-width: 256px){.govuk-phase-banner__content{display:block}}.language-select{margin:15px 0 15px 0}.language-select__list{margin-top:1em;text-align:right}.language-select__list-item{display:inline-block}.language-select__list-item:first-child::after{content:"";display:inline-block;position:relative;top:.1875em;height:1em;border-right:.09375em solid #000}.language-select__list-item a,.language-select__list-item [aria-current]{padding:.3125em}@media screen and (max-width: 641px){.language-select__list{float:none;text-align:left;padding-bottom:10px;border-bottom:1px solid #b1b4b6}}.spinner{width:80px;height:80px;border-radius:50%;border-width:12px;border-style:solid;border-color:#dee0e2;border-top-color:#005ea5;margin-bottom:govuk-spacing(3)}@media(forced-colors: active){.spinner{forced-color-adjust:none;border-top-color:rgba(0,0,0,0) !important}}@media not (prefers-reduced-motion){.spinner{-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}}@media(prefers-reduced-motion){.spinner{transform:rotate(0.125turn)}}.spinner__ready{border-color:#005ea5;-webkit-animation:none;animation:none}#spinner-container__error .spinner,#spinner-container__error .spinner-state-text{display:none}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.centre{margin-left:auto;margin-right:auto;text-align:center;display:block}.govuk-footer__copyright-logo::before{background-image:url("../frontendUiAssets/images/govuk-crest.svg"),url("/frontendUiAssets/images/govuk-crest.svg") !important}.govuk-footer__copyright-logo{background-image:url("../frontendUiAssets/images/govuk-crest.svg"),url("/frontendUiAssets/images/govuk-crest.svg") !important}@media(max-width: 256px){.govuk-footer__crown{max-width:100%;max-height:auto}}.govuk-footer{font-family:"GDS Transport",arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:.875rem;line-height:1.1428571429;padding-top:25px;padding-bottom:15px;border-top:1px solid #b1b4b6;color:#0b0c0c;background:#f3f2f1}.govuk-template--rebranded .govuk-footer{font-family:"GDS Transport",arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:14px;font-size:.875rem;line-height:1.1428571429;padding-top:25px;padding-bottom:15px;border-top:10px solid #1d70b8;color:#0b0c0c;background:#f3f2f1}
1
+ @media(max-width: 640px){.govuk-header__navigation-item{border-left:none !important}.govuk-template--rebranded .govuk-header__navigation-list{padding-bottom:0px !important}.govuk-header__navigation-item{padding-top:8px !important}}.frontendUi_header_signOut-item{padding:5px 0px 5px 30px;border-left:1px solid #b1b4b6;margin-left:auto}.frontendUi_header_signOut-item--rebrand{border-left:none;padding:5px 0px 5px 0px;margin-left:auto;font-weight:700 !important}.frontendUi_header__signOut{display:flex;flex-wrap:wrap}.frontendUi-header__content{margin-left:auto}.govuk-header__navigation--signOut{padding:15px 0 15px !important}.govuk-template--rebranded .govuk-header__navigation{padding:15px 0 15px !important}@media(max-width: 640px){.govuk-header__navigation--signOut{padding:18px 0 8px !important}.govuk-template--rebranded .govuk-header__navigation{padding:18px 0 8px !important}}.govuk-template--rebranded .govuk-header__navigation-item a{font-weight:700 !important}.govuk-template--rebranded .govuk-header__navigation-item{padding-top:5px !important}@media(min-width: 20em)and (max-width: 48.0525em){.govuk-template--rebranded .govuk-header__navigation-list{padding-bottom:0px}}@media(max-width: 323px){.govuk-header__logo{padding-right:5px}.frontendUi_header_signOut-item{padding-left:0px}}@media(max-width: 261px){.frontendUi-header__content{margin-left:unset}.govuk-template--rebranded .govuk-header__navigation{padding:0px 0 8px !important}.govuk-header__logotype{max-width:100%;max-height:auto}.govuk-template--rebranded .govuk-header__logo{padding-top:5% !important;padding-bottom:5% !important}}.govuk-tag{font-family:"GDS Transport",arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:700;font-size:14px;font-size:.875rem;line-height:1;display:inline-block;padding-top:5px;padding-right:8px;padding-bottom:4px;padding-left:8px;outline:2px solid rgba(0,0,0,0);outline-offset:-2px;color:#fff !important;background-color:#1d70b8 !important;letter-spacing:1px !important;text-decoration:none !important;text-transform:uppercase !important}/*! Copyright (c) 2011 by Margaret Calvert & Henrik Kubel. All rights reserved. The font has been customised for exclusive use on gov.uk. This cut is not commercially available. */@font-face{font-family:"GDS Transport";font-style:normal;font-weight:normal;src:url("/assets/fonts/light-94a07e06a1-v2.woff2") format("woff2"),url("/assets/fonts/light-f591b13f7d-v2.woff") format("woff");font-display:fallback}@font-face{font-family:"GDS Transport";font-style:normal;font-weight:bold;src:url("/assets/fonts/bold-b542beb274-v2.woff2") format("woff2"),url("/assets/fonts/bold-affa96571d-v2.woff") format("woff");font-display:fallback}@media print{.govuk-tag{font-family:sans-serif}}@media(min-width: 40.0625em){.govuk-tag{font-size:16px;font-size:1rem;line-height:1}}@media print{.govuk-tag{font-size:14pt;line-height:1}}@media(max-width: 256px){.govuk-phase-banner__content{display:block}}.language-select{margin:15px 0 15px 0}.language-select__list{margin-top:1em;text-align:right}.language-select__list-item{display:inline-block}.language-select__list-item:first-child::after{content:"";display:inline-block;position:relative;top:.1875em;height:1em;border-right:.09375em solid #000}.language-select__list-item a,.language-select__list-item [aria-current]{padding:.3125em}@media screen and (max-width: 641px){.language-select__list{float:none;text-align:left;padding-bottom:10px;border-bottom:1px solid #b1b4b6}}.spinner{width:80px;height:80px;border-radius:50%;border-width:12px;border-style:solid;border-color:#dee0e2;border-top-color:#005ea5;margin-bottom:govuk-spacing(3)}@media(forced-colors: active){.spinner{forced-color-adjust:none;border-top-color:rgba(0,0,0,0) !important}}@media not (prefers-reduced-motion){.spinner{-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}}@media(prefers-reduced-motion){.spinner{transform:rotate(0.125turn)}}.spinner__ready{border-color:#005ea5;-webkit-animation:none;animation:none}#spinner-container__error .spinner,#spinner-container__error .spinner-state-text{display:none}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.centre{margin-left:auto;margin-right:auto;text-align:center;display:block}.govuk-footer__copyright-logo::before{background-image:url("../frontendUiAssets/images/govuk-crest.svg"),url("/frontendUiAssets/images/govuk-crest.svg") !important}.govuk-footer__copyright-logo{background-image:url("../frontendUiAssets/images/govuk-crest.svg"),url("/frontendUiAssets/images/govuk-crest.svg") !important}@media(max-width: 256px){.govuk-footer__crown{max-width:100%;max-height:auto}}.govuk-footer{font-family:"GDS Transport",arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:.875rem;line-height:1.1428571429;padding-top:25px;padding-bottom:15px;border-top:1px solid #b1b4b6;color:#0b0c0c;background:#f3f2f1}.govuk-template--rebranded .govuk-footer{font-family:"GDS Transport",arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:14px;font-size:.875rem;line-height:1.1428571429;padding-top:25px;padding-bottom:15px;border-top:10px solid #1d70b8;color:#0b0c0c;background:#f4f8fb}
package/build/components/bases/auth/auth-base.njk CHANGED
@@ -18,7 +18,6 @@
18
18
  {% block head %}
19
19
  <!--[if !IE 8]><!-->
20
20
  <link href="/public/style.css" rel="stylesheet">
21
- <link rel="stylesheet" href="/public/frontendUi.css"/>
22
21
  <!--<![endif]-->
23
22
 
24
23
  <!--[if IE 8]>
package/build/components/bases/home/home-base.njk CHANGED
@@ -17,7 +17,6 @@
17
17
  <script src="{{ dynatraceRumUrl }}" crossorigin="anonymous" nonce="{{ scriptNonce }}"></script>
18
18
  {% endif %}
19
19
  <link href="/public/style.css" rel="stylesheet">
20
- <link rel="stylesheet" href="/public/frontendUi.css"/>
21
20
 
22
21
  {% endblock %}
23
22
 
package/build/components/bases/identity/identity-base-form.njk CHANGED
@@ -10,6 +10,10 @@
10
10
  {%set htmlClasses = 'govuk-template--rebranded'%}
11
11
  {% endif %}
12
12
 
13
+ {% block head %}
14
+ <link rel="stylesheet" href="/public/stylesheets/application.css"/>
15
+ {% endblock %}
16
+
13
17
  {%- block pageTitle %}
14
18
  {{- (translate("govuk.error", { default: "Error" }) + ": ") if errorlist.length }}{{ hmpoTitle | safe }}{{ " – " + govukServiceName | safe if govukServiceName !== " " }} – GOV.UK One Login
15
19
  {%- endblock %}
package/build/components/bases/ipv-core/ipv-core-base.njk CHANGED
@@ -26,8 +26,6 @@
26
26
 
27
27
  <link href="/public/stylesheets/application.css" rel="stylesheet">
28
28
 
29
- <link rel="stylesheet" href="/public/stylesheets/frontendUi.css"/>
30
-
31
29
  {# For older browsers to allow them to recognise HTML5 elements such as `<header>` #}
32
30
  <!--[if lt IE 9]>
33
31
  <script nonce='{{ cspNonce }}' src="/html5-shiv/html5shiv.js"></script>
package/build/components/bases/mobile/mobile-base.njk CHANGED
@@ -21,10 +21,8 @@
21
21
  {% block head %}
22
22
  <link href="/stylesheets/application.css" rel="stylesheet">
23
23
  <link href="/stylesheets/language-toggle.css" rel="stylesheet">
24
- <link href="/stylesheets/frontend-ui.css" rel="stylesheet">
25
24
  <meta name="robots" content="noindex">
26
25
 
27
- <link rel="stylesheet" href="/stylesheets/frontendUi.css"/>
28
26
  {% endblock %}
29
27
 
30
28
  {% block pageTitle %}
package/build/components/footer/_index.scss CHANGED
@@ -40,5 +40,5 @@
40
40
  padding-bottom: 15px;
41
41
  border-top: 10px solid #1d70b8;
42
42
  color: #0b0c0c;
43
- background: #f3f2f1;
43
+ background: #f4f8fb;
44
44
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@govuk-one-login/frontend-ui",
3
- "version": "1.3.1",
3
+ "version": "1.3.3",
4
4
  "description": "",
5
5
  "main": "build/cjs/index.cjs",
6
6
  "module": "build/esm/index.js",