UKHomeOfficeForms / hof

Bootstrap a HOF project
MIT License
15 stars 17 forks source link

Feature/add hods theme #412

Open andrewgibson-ibm opened 10 months ago

andrewgibson-ibm commented 10 months ago

Description

Current HOF framework enables the use of govUK theme which implements the components and styling designed in the Government Design System. This update enables the use of the Home Office Design System by implementing the relevant styles and page template.

Changes

  1. All styling changes are described on the HODS website
  2. The TaskList component has been added
  3. Document title has been changed to {{pageTitle}} - {{appTitle}}
  4. Build task now includes copying over font assets if they exist

Testing

  1. Import this fork as hof package in your app
  2. In hof.settings.json, set "theme": "hods",
  3. Run npm i, then npm run start to start your app
  4. Observe that the changes listed above are implemented
sulthan-ahmed commented 9 months ago

I see that the styles are being copied across rather than having an npm module. I had a look at the HODs site and it looks like that's the way to do it. I sent a message to the team

Hi what is the approach to import the ho-design system for production?
@Andrew Gibson has written some code for our HOF framework to use the design system. I’m just reviewing it. Do you have an npm module for the ho-design system something similar to govuk-frontend, it would make it easier to import the styles? I wonder if copying and pasting the styles would be difficult to maintain when the design system is updated? CC @daniel (edited)

serviceops commented 8 months ago

The email you have sent to @.*** is for a legacy domain and will shortly be removed.

Please update your address book and send to the same address but having removed .gsi. from the domain part.

Mail to legacy addresses will stop working after 31st March 2024

sulthan-ahmed commented 8 months ago

This is really great work @andrewgibson-ibm there's just some minor linting things to sort out. I also have a question about the sass. Am I right in thinking it has been copied and pasted from the HO design system? If that's the case, then this will make it difficult to maintain in the future. For example if the HO design system updates and changes the sass how can we tell what has changed and how will we update it in the future. I don't know the answer to this so it would be good to discuss.

Once we can come to a way forward with this, the next bit would be to publish a beta package of this and test it on multiple services.