LandRegistry · ahosgood · Sep 14, 2022 · Jul 19, 2022 · Jul 19, 2022 · Jul 19, 2022
@@ -10,7 +10,7 @@ assignees: ''
 <!--
     Please fill in as much of the template below as you’re able to. If you're unsure whether the issue already exists or how to fill in the template, open an issue anyway. Our team will help you to complete the rest.
 
-    Your issue might already exist. If so, add a comment to the existing issue instead of creating a new one. You can find existing issues here: https://github.com/LandRegistry/hmlr-design-system-2/issues
+    Your issue might already exist. If so, add a comment to the existing issue instead of creating a new one. You can find existing issues here: https://github.com/LandRegistry/hmlr-design-system/issues
 -->
 
 ## Description of the issue

@@ -10,7 +10,7 @@ assignees: ''
 <!--
     Please fill in as much of the template below as you’re able to. If you're unsure whether the issue already exists or how to fill in the template, open an issue anyway. Our team will help you to complete the rest.
 
-    Your issue might already exist. If so, add a comment to the existing issue instead of creating a new one. You can find existing issues here: https://github.com/LandRegistry/hmlr-design-system-2/issues
+    Your issue might already exist. If so, add a comment to the existing issue instead of creating a new one. You can find existing issues here: https://github.com/LandRegistry/hmlr-design-system/issues
 
     We also welcome pull requests from users, if you feel comfortable doing so.
 -->

@@ -12,7 +12,7 @@ assignees: ''
 
   Your issue might already exist. If so, add a comment to the existing issue instead of creating a new one. You can find existing issues here:
   - the community backlog: https://hmlr-design-system-staging.herokuapp.com/community/backlog/
-  - an existing Github issue: https://github.com/LandRegistry/hmlr-design-system-2/issues
+  - an existing Github issue: https://github.com/LandRegistry/hmlr-design-system/issues
 
   If you are proposing a new component or pattern, please follow the instructions here: https://hmlr-design-system-staging.herokuapp.com/community/propose-a-component-or-pattern/
 -->

@@ -1,3 +1,5 @@
+<img src="https://raw.githubusercontent.com/LandRegistry/hmlr-frontend/staging/src/hmlr/assets/images/hmlr_icon.svg" alt="HM Land Registry logo" title="HM Land Registry" align="right" width="80" />
+
 # HM Land Registry Design System
 
 This repository contains the code for the GOV.UK Design System website. To find the code we provide for reuse by services, go to the [govuk-frontend repository](https://github.com/alphagov/govuk-frontend).
@@ -13,7 +15,7 @@ If you're an external contributor make sure to [fork this project first](https:/
 
 ### Clone repository
 ```
-git clone [email protected]:LandRegistry/hmlr-design-system-2.git # or clone your own fork
+git clone [email protected]:LandRegistry/hmlr-design-system.git # or clone your own fork
 
 cd govuk-design-system
 ```
@@ -54,9 +56,9 @@ npm run lint
 
 [stylelint]: https://github.com/stylelint/stylelint
 
-## GOV.UK Frontend packages
+## Frontend packages
 
-Design System consumes the [GOV.UK Frontend](https://github.com/alphagov/govuk-frontend) package via [NPM](https://www.npmjs.com/).
+Design System consumes the [GOV.UK Frontend](https://github.com/alphagov/govuk-frontend) and the [HMLR Frontend](https://github.com/LandRegistry/hmlr-frontend) packages via [NPM](https://www.npmjs.com/).
 This is defined in the [package.json](package.json) file.
 
 --------------------
@@ -72,7 +74,7 @@ When changes are pushed to GitHub, [Github Actions][github-actions] will:
 If any of these fail, this will be reported in the GitHub status checks
 interface.
 
-[github-actions]: https://github.com/LandRegistry/hmlr-design-system-2/actions
+[github-actions]: https://github.com/LandRegistry/hmlr-design-system/actions
 
 ## Deployment
 
@@ -83,7 +85,7 @@ interface.
 
 GDS is an advocate of responsible vulnerability disclosure. If you’ve found a vulnerability, we would like to know so we can fix it.
 
-To learn how to report a security vulnerability, [see our security policy](https://github.com/LandRegistry/hmlr-design-system-2/security/policy).
+To learn how to report a security vulnerability, [see our security policy](https://github.com/LandRegistry/hmlr-design-system/security/policy).
 
 ## Contributing
 

@@ -5,6 +5,8 @@
   "nodemodules": "node_modules/",
     "govukfrontend": "node_modules/govuk-frontend/",
     "govukfrontendcomponents": "node_modules/govuk-frontend/govuk/components/",
+    "hmlrfrontend": "node_modules/@hmlr/frontend/",
+    "hmlrfrontendcomponents": "node_modules/@hmlr/frontend/hmlr/components/",
     "iframeresizer": "node_modules/iframe-resizer/",
     "clipboard": "node_modules/clipboard/dist/",
   "source": "src/",

@@ -122,7 +122,7 @@ trailing-slashed URLs, but decided against it because:
 - other parts of GOV.UK's infrastructure (such as their mirroring) make
   assumptions based on the lack of a trailing slash and relative URLs.
 
-[github-actions]: https://github.com/LandRegistry/hmlr-design-system-2/actions
+[github-actions]: https://github.com/LandRegistry/hmlr-design-system/actions
 [paas]: https://www.cloud.service.gov.uk/
 [nginx-bp]: https://github.com/cloudfoundry/nginx-buildpack
 [govuk-dns-config]: https://github.com/alphagov/govuk-dns-config/blob/master/service.gov.uk.yaml

@@ -14,4 +14,4 @@ buildpack to redirects any requests to the service domain.
 
 This app was deployed manually using the CloudFoundry command line tools.
 
-[app]: https://github.com/LandRegistry/hmlr-design-system-2-redirect
+[app]: https://github.com/LandRegistry/hmlr-design-system-redirect
@@ -23,7 +23,7 @@ You'll then need to ask the technical lead on the GOV.UK Design System team to g
 
 ## How we transform logs with Logstash Filters
 
-The configuration is based on the [GOV.UK PaaS setup instructions](https://docs.cloud.service.gov.uk/monitoring_apps.html#configure-logstash-filters), see [git history for updates](https://github.com/LandRegistry/hmlr-design-system-2/commits/main/docs/logs.md).
+The configuration is based on the [GOV.UK PaaS setup instructions](https://docs.cloud.service.gov.uk/monitoring_apps.html#configure-logstash-filters), see [git history for updates](https://github.com/LandRegistry/hmlr-design-system/commits/main/docs/logs.md).
 
 **We use this file as version control for the Logit Filters for our stack. Please make sure to update the below code snippet in this file whenever changing Filters. We recommend pairing on updating filters as they are easy to break.**
 

@@ -11,7 +11,10 @@ renderer.paragraph = text => text
 
 function getMacroOptionsJson (componentName) {
   try {
-    let optionsFilePath = path.join(paths.govukfrontendcomponents, componentName, 'macro-options.json')
+    let optionsFilePath = path.join(paths.hmlrfrontendcomponents, componentName, 'macro-options.json')
+    if (!fs.existsSync(optionsFilePath)) {
+      optionsFilePath = path.join(paths.govukfrontendcomponents, componentName, 'macro-options.json')
+    }
     return JSON.parse(fs.readFileSync(optionsFilePath, 'utf8'))
   } catch (err) {
     console.error(err)

@@ -39,7 +39,8 @@ const views = [
   paths.layouts,
   paths.partials,
   paths.components,
-  paths.govukfrontend
+  paths.govukfrontend,
+  paths.hmlrfrontend
 ]
 
 // static site generator
@@ -70,7 +71,7 @@ module.exports = metalsmith(__dirname) // __dirname defined by node.js: name of
   // convert *.scss files to *.css
   .use(sass({
     quietDeps: true,
-    loadPaths: ['node_modules', 'src/stylesheets'] // an array of paths that sass can look in when attempt to resolve @import declarations
+    loadPaths: ['', 'node_modules', 'src/stylesheets'] // an array of paths that sass can look in when attempt to resolve @import declarations
   }))
 
   .use(postcss({
@@ -85,9 +86,9 @@ module.exports = metalsmith(__dirname) // __dirname defined by node.js: name of
     destination: 'assets'
   }))
 
-  // copy HMLR-specific assets from assets
+  // copy static assets from node_modules/@hmlr/frontend
   .use(assets({
-    source: '../assets/',
+    source: path.join('../', paths.hmlrfrontend, 'hmlr/assets/'),
     destination: 'assets'
   }))
 

@@ -4,14 +4,14 @@
   "description": "HM Land Registry Design System",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/landregistry/hmlr-design-system-2.git"
+    "url": "git+https://github.com/landregistry/hmlr-design-system.git"
   },
   "author": "HM Land Registry Design System team",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/landregistry/hmlr-design-system-2/issues"
+    "url": "https://github.com/landregistry/hmlr-design-system/issues"
   },
-  "homepage": "https://github.com/landregistry/hmlr-design-system-2#readme",
+  "homepage": "https://github.com/landregistry/hmlr-design-system#readme",
   "scripts": {
     "preinstall": "node bin/check-nvmrc.js",
     "prestart": "node bin/check-nvmrc.js",
@@ -28,6 +28,7 @@
     ]
   },
   "dependencies": {
+    "@hmlr/frontend": "1.0.0-rc1",
     "@metalsmith/postcss": "^5.0.0",
     "acorn": "^6.4.1",
     "autoprefixer": "^10.4.7",
@@ -76,9 +77,6 @@
     "request": "^2.88.0",
     "rollup-plugin-commonjs": "^9.3.4",
     "rollup-plugin-node-resolve": "^4.2.3",
-    "stylelint": "^14.6.1",
-    "stylelint-config-gds": "^0.2.0",
-    "stylelint-order": "^5.0.0",
     "sitemap": "^2.1.0",
     "standard": "^12.0.1",
     "stylelint": "^14.6.1",

@@ -6,7 +6,9 @@ layout: layout-single-page-prose.njk
 
 # Accessibility
 
-The HM Land Registry Design System website and the codebase it uses, GOV.UK Frontend, is maintained by a team at the HM Land Registry (HMLR).
+The HM Land Registry Design System website and the codebase it uses, HM Land Registry Frontend, is maintained by a team at the HM Land Registry (HMLR).
+
+The HM Land Registry Design System also uses the GOV.UK Frontend codebase and mirrors the code from the GOV.UK Design System, both of which are maintained by a team at the Government Digital Service (GDS).
 
 This page explains how the team works to ensure the Design System and Frontend are accessible.
 
@@ -48,20 +50,22 @@ The GOV.UK Frontend documentation website at [http://frontend.design-system.serv
 
 ### How this website has been tested for accessibility
 
-The Design System website was last tested on 7 October 2019. The test was carried out by the [Digital Accessibility Centre (DAC)](https://digitalaccessibilitycentre.org/).
+# [TODO]
+
+{# The Design System website was last tested on 7 October 2019. The test was carried out by the [Digital Accessibility Centre (DAC)](https://digitalaccessibilitycentre.org/). #}
 
-DAC tested a sample of pages to cover the different content types in the HM Land Registry Design System website. They were:
+{# DAC tested a sample of pages to cover the different content types in the HM Land Registry Design System website. They were: #}
 
-- [the homepage](https://hmlr-design-system-staging.herokuapp.com/)
-- [a short content page](https://hmlr-design-system-staging.herokuapp.com/community/design-system-working-group/)
-- [an overview page](https://hmlr-design-system-staging.herokuapp.com/community/)
-- [a styles page](https://hmlr-design-system-staging.herokuapp.com/styles/typography/)
-{# - [a component page](https://hmlr-design-system-staging.herokuapp.com/components/radios/)
-- [a pattern page](https://hmlr-design-system-staging.herokuapp.com/patterns/question-pages/) #}
+{# - [the homepage](https://hmlr-design-system-staging.herokuapp.com/) #}
+{# - [a short content page](https://hmlr-design-system-staging.herokuapp.com/community/design-system-working-group/) #}
+{# - [an overview page](https://hmlr-design-system-staging.herokuapp.com/community/) #}
+{# - [a styles page](https://hmlr-design-system-staging.herokuapp.com/styles/typography/) #}
+{# - [a component page](https://hmlr-design-system-staging.herokuapp.com/components/radios/) #}
+{# - [a pattern page](https://hmlr-design-system-staging.herokuapp.com/patterns/question-pages/) #}
 
-They also tested the global search functionality that appears in the header of every page in the Design System.
+{# They also tested the global search functionality that appears in the header of every page in the Design System. #}
 
-The [GOV.UK Frontend documentation website](http://frontend.design-system.service.gov.uk/) was last tested for accessibility issues in March 2021.
+{# The [GOV.UK Frontend documentation website](http://frontend.design-system.service.gov.uk/) was last tested for accessibility issues in March 2021. #}
 
 ### How the HM Land Registry Design System team makes this website accessible
 
@@ -87,16 +91,4 @@ You must research styles, components and patterns as part of your service to ens
 
 Find out what you need to do to [make your service accessible](https://www.gov.uk/service-manual/helping-people-to-use-your-service/making-your-service-accessible-an-introduction) in the GOV.UK Service Manual.
 
-## If you are not using the Design System and Frontend
-
-The Design System and Frontend were introduced in June 2018 to replace the following deprecated codebases:
-
-- GOV.UK Elements
-- GOV.UK Frontend Toolkit
-- GOV.UK Template
-
-The HM Land Registry Design System team no longer supports these products and will not be making updates to help them meet level AA of WCAG 2.1.
-
-If you're using these products, you should start updating your service to use the Design System and Frontend.
-
 If you have any questions or need help, [contact the HM Land Registry Design System team](/get-in-touch/).
@@ -7,11 +7,11 @@ layout: layout-pane.njk
 order: 2
 ---
 
-If you're building a digital service in a central government department, you must provide assisted digital support.
+If you’re building a digital service in a central government department, you must provide assisted digital support.
 
 This means offering help for people who:
-- need to use the digital service but can't access it or
-- don't have the skills to use the digital service on their own.
+- need to use the digital service but can’t access it or
+- don’t have the skills to use the digital service on their own.
 
 Any user may need assisted digital support, if they lack:
 

@@ -7,14 +7,14 @@ layout: layout-pane.njk
 order: 8
 ---
 
-Not everyone reading your document will be able to see an image or screenshot so you must always add '[alternative text](https://design-system.service.gov.uk/styles/images/#alternative-text)' or 'alt text'. 
+Not everyone reading your document will be able to see an image or screenshot so you must always add "[alternative text](https://design-system.service.gov.uk/styles/images/#alternative-text)" or "alt text". 
 
 This means people using screen readers can read or hear a description of the image. 
 
-If the image is purely decorative then you can mark it as 'decorative only'. 
+If the image is purely decorative then you can mark it as "decorative only". 
 
 But if this is the case, you might want to think about whether you need to include the image at all. [Images, Describing images, Graphs and charts, Diagrams, Infographics, Image copyright standard](https://www.gov.uk/guidance/content-design/images).  
 
-You can usually add 'alt text' by using your right-hand mouse function on an image, or when you run an accessibility check you'll be guided to add any missing 'alt text'. 
+You can usually add "alt text" by using your right-hand mouse function on an image, or when you run an accessibility check you will be guided to add any missing "alt text". 
 
 If you decide you want to keep the image, [you can mark the image so they can be ignored by assistive technology](https://www.w3.org/TR/WCAG20-TECHS/H67.html#H67-description).
@@ -11,9 +11,9 @@ Always make your [links](https://www.gov.uk/guidance/content-design/links) descr
 
 Links are blue and underlined by default. 
 
-Never leave the full link visible or use the words 'click' or 'click here' as some people do not use a mouse.
+Never leave the full link visible or use the words "click" or "click here" as some people do not use a mouse.
 
-Use ‘select’ and make sure the link is meaningful, for example:
+Use "select" and make sure the link is meaningful, for example:
 
 Good: [guidance on GDS standards](https://www.gov.uk/service-manual/service-standard)
 

@@ -19,7 +19,7 @@ If you use Word to write your content you can then run the Flesch reading scale
 
 If your score is lower than 70, then take a look at your sentence length and word length. The shorter the sentences and words, the easier it will be read.
 
-To set this up in Word (see below for Macbook), Open Word, go to File then Options. Select Proofing then make sure 'check grammar with spelling' and 'show readability statistics' are both selected. Now you have enabled this feature, when you run a spell check Word will display information about the reading level of your document as well.  
+To set this up in Word (see below for Macbook), Open Word, go to File then Options. Select Proofing then make sure "Check grammar with spelling" and "Show readability statistics" are both selected. Now you have enabled this feature, when you run a spell check Word will display information about the reading level of your document as well.  
 
 If you are working on a Macbook: Open word, go to the Word drop down menu, select Preferences, Select Spelling and Grammar, Check Show readability statistics and click OK. Now when you use the spell check tool, it will automatically tell you the Flesch-Kincaid grade level equivalency.
 

@@ -0,0 +1,7 @@
+---
+title: Footer
+layout: layout-example.njk
+---
+{% from "hmlr/components/footer/macro.njk" import hmlrFooter %}
+
+{{ hmlrFooter() }}