DS preview

[FilisLiu]

What?

Refurbish dummy app preview pages with a two_column layout

Why?

This resembles all the other design system guideline pages and reduces user's cognitive load to get their hands on.

• GOVUK: https://design-system.service.gov.uk/
• NHSUK: https://service-manual.nhs.uk/design-system
• XGOVUK: https://govuk-components.netlify.app/introduction/get-started/

How?

• Added two_column layout to dummy app
• Added application helper component_preview which will capture a block of erb code and render its html output
• Added styles_controller and components_controller to manage sub-pages
• Added sidebars to navigate through pages
• Moved DS helper demo snippets from pages#index into individual views
• Added ds_code and self-hosting hljs
• Updated cypress tests (fixed the broken footer test)

Testing?

All passed and eyeballed
Specific content in each page will be discussed with @rebecafiadeiro later and will subject to changes

Screenshots (optional)

Anything Else?

This is just a scaffolding for page refurbishments. I've left quite some TODO notes to work on. Happy to discuss