feat(root): adds dark mode switch

[ad9242]

Summary of the changes

• Adds dark mode switch to site.
• Added system color preference. When a user first visits the page the initial theme will be whatever their system preference is
• Added theme persistance through sessionStorage. If a user wants to adjust the system preference, they press the button and their preference is stored in sessionStorage where it will be used as the user's preferred theme if they refresh the page.
• Added dark mode colors to guidance site specific elements. Tried to base them off the colors of the other components, however please comment if some don't seem correct :) Implement dark mode on the guidance site #1133

Related issue

#1216

Checklist

• I have manually accessibility tested any changes, if relevant.
• I have raised this pull request against the develop branch

[github-actions]

View your branch deployment here: https://mi6.github.io/ic-design-system-githubpages/branches/dark-mode-toggle

[ad9242]

Suggestion to use local storage or a cookie rather than session storage. If you open a page in a new window, it reverts back to your OS setting

[gd2910]

At 90% page zoom, when hovering the button, I get a horizontal scroll appear. Only when going to light mode though. Small issue but overflow-x: hidden on the fixes it if it is seen as an issue.

[GCHQ-Developer-530]

Found a couple of issues. The first time I open the site with dark mode as my system setting, it seems to know I'm in dark mode but doesn't update the site:
Cookie banner

Site

After I click the dark mode enabler button to light mode then dark mode again it's fixed itself and displays dark mode.
When in dark mode, the bottom image on the homepage means that some of the text isn't readable, a new image might need generating for dark mode that has darker boxes.