Merge pull request #352 from nhsuk/refactor/app-component-folders

Refactor/app component folders

app/pages/examples.njk

@@ -21,87 +21,87 @@
   <h2>Components</h2>
 
   <ul class="nhsuk-list">
-    <li><a href="../components/action-link.html">Action link</a></li>
+    <li><a href="../components/action-link/index.html">Action link</a></li>
     <li><a href="../components/back-link/index.html">Back link</a></li>
-    <li><a href="../components/breadcrumb.html">Breadcrumb</a></li>
+    <li><a href="../components/breadcrumb/index.html">Breadcrumb</a></li>
     <li><a href="../components/button/index.html">Button</a></li>
     <li><a href="../components/button/disabled.html">Button disabled</a></li>
     <li><a href="../components/button/secondary.html">Button secondary</a></li>
     <li><a href="../components/button/secondary-disabled.html">Button secondary disabled</a></li>
     <li><a href="../components/button/reverse.html">Button reverse</a></li>
     <li><a href="../components/button/reverse-disabled.html">Button reverse disabled</a></li>
-    <li><a href="../components/care-card-non-urgent.html">Care card non-urgent (blue)</a></li>
-    <li><a href="../components/care-card-urgent.html">Care card urgent (red)</a></li>
-    <li><a href="../components/care-card-immediate.html">Care card immediate (red and black)</a></li>
+    <li><a href="../components/care-card/care-card-non-urgent.html">Care card non-urgent (blue)</a></li>
+    <li><a href="../components/care-card/care-card-urgent.html">Care card urgent (red)</a></li>
+    <li><a href="../components/care-card/care-card-immediate.html">Care card immediate (red and black)</a></li>
     <li><a href="../components/checkboxes/index.html">Checkboxes</a></li>
     <li><a href="../components/checkboxes/hint.html">Checkboxes with hint text</a></li>
     <li><a href="../components/checkboxes/disabled.html">Checkboxes with disabled item</a></li>
     <li><a href="../components/checkboxes/page-heading.html">Checkboxes with legend as page heading</a></li>
     <li><a href="../components/checkboxes/error.html">Checkboxes with error message</a></li>
-    <li><a href="../components/contents-list.html">Contents list</a></li>
+    <li><a href="../components/contents-list/index.html">Contents list</a></li>
     <li><a href="../components/date-input/index.html">Date input</a></li>
     <li><a href="../components/date-input/error.html">Date input with error</a></li>
     <li><a href="../components/date-input/multiple-errors.html">Date input with multiple errors</a></li>
-    <li><a href="../components/details.html">Details</a></li>
-    <li><a href="../components/do-dont-list.html">Do and Don't list</a></li>
-    <li><a href="../components/emergency-alert.html">Emergency alert</a></li>
+    <li><a href="../components/details/index.html">Details</a></li>
+    <li><a href="../components/do-dont-list/index.html">Do and Don't list</a></li>
+    <li><a href="../components/emergency-alert/index.html">Emergency alert</a></li>
     <li><a href="../components/error-message/index.html">Error message</a></li>
     <li><a href="../components/error-summary/index.html">Error summary</a></li>
-    <li><a href="../components/expander.html">Expander</a></li>
-    <li><a href="../components/expander-group.html">Expander group</a></li>
-    <li><a href="../components/feedback-banner.html">Feedback banner</a></li>
+    <li><a href="../components/details/expander.html">Expander</a></li>
+    <li><a href="../components/details/expander-group.html">Expander group</a></li>
+    <li><a href="../components/feedback-banner/index.html">Feedback banner</a></li>
     <li><a href="../components/fieldset/index.html">Fieldset</a></li>
     <li><a href="../components/fieldset/page-heading.html">Fieldset as page heading</a></li>
-    <li><a href="../components/footer.html">Footer</a></li>
-    <li><a href="../components/header.html">Header</a></li>
-    <li><a href="../components/header-logo.html">Header with logo only</a></li>
-    <li><a href="../components/header-service-name.html">Header with service name and search</a></li>
-    <li><a href="../components/header-transactional.html">Header transactional</a></li>
-    <li><a href="../components/header-transactional-service-name.html">Header transactional with service name</a></li>
-    <li><a href="../components/header-transactional-long-service-name.html">Header transactional with a long service name</a></li>
-    <li><a href="../components/header-navigation.html">Header with navigation</a></li>
-    <li><a href="../components/header-search.html">Header with search</a></li>
-    <li><a href="../components/hero.html">Hero</a></li>
-    <li><a href="../components/hero-image.html">Hero with image</a></li>
-    <li><a href="../components/hero-image-content.html">Hero with image with content</a></li>
+    <li><a href="../components/footer/index.html">Footer</a></li>
+    <li><a href="../components/header/index.html">Header</a></li>
+    <li><a href="../components/header/header-logo.html">Header with logo only</a></li>
+    <li><a href="../components/header/header-service-name.html">Header with service name and search</a></li>
+    <li><a href="../components/header/header-transactional.html">Header transactional</a></li>
+    <li><a href="../components/header/header-transactional-service-name.html">Header transactional with service name</a></li>
+    <li><a href="../components/header/header-transactional-long-service-name.html">Header transactional with a long service name</a></li>
+    <li><a href="../components/header/header-navigation.html">Header with navigation</a></li>
+    <li><a href="../components/header/header-search.html">Header with search</a></li>
+    <li><a href="../components/hero/index.html">Hero</a></li>
+    <li><a href="../components/hero/hero-image.html">Hero with image</a></li>
+    <li><a href="../components/hero/hero-image-content.html">Hero with image with content</a></li>
     <li><a href="../components/hint/index.html">Hint</a></li>
-    <li><a href="../components/images.html">Images</a></li>
+    <li><a href="../components/images/index.html">Images</a></li>
     <li><a href="../components/input/index.html">Input</a></li>
     <li><a href="../components/input/hint.html">Input with hint text</a></li>
     <li><a href="../components/input/error.html">Input with error message</a></li>
     <li><a href="../components/input/custom-width.html">Input with width modifier</a></li>
-    <li><a href="../components/inset-text.html">Inset text</a></li>
+    <li><a href="../components/inset-text/index.html">Inset text</a></li>
     <li><a href="../components/label/index.html">Label</a></li>
     <li><a href="../components/label/bold.html">Label with bold text</a></li>
     <li><a href="../components/label/page-heading.html">Label as page heading</a></li>
-    <li><a href="../components/list-panel.html">List panel</a></li>
-    <li><a href="../components/nav-a-z.html">Nav A-Z</a></li>
-    <li><a href="../components/pagination.html">Pagination</a></li>
-    <li><a href="../components/panel.html">Panel</a></li>
-    <li><a href="../components/panel-grey.html">Panel with grey background</a></li>
-    <li><a href="../components/panel-with-label.html">Panel with label</a></li>
-    <li><a href="../components/panel-group.html">Panel group</a></li>
-    <li><a href="../components/promo.html">Promo</a></li>
-    <li><a href="../components/promo-no-description.html">Promo with no description</a></li>
-    <li><a href="../components/promo-small.html">Promo small</a></li>
-    <li><a href="../components/promo-with-image.html">Promo with image</a></li>
-    <li><a href="../components/promo-group.html">Promo group</a></li>
+    <li><a href="../components/list-panel/index.html">List panel</a></li>
+    <li><a href="../components/nav-a-z/index.html">Nav A-Z</a></li>
+    <li><a href="../components/pagination/index.html">Pagination</a></li>
+    <li><a href="../components/panel/index.html">Panel</a></li>
+    <li><a href="../components/panel/panel-grey.html">Panel with grey background</a></li>
+    <li><a href="../components/panel/panel-with-label.html">Panel with label</a></li>
+    <li><a href="../components/panel/panel-group.html">Panel group</a></li>
+    <li><a href="../components/promo/index.html">Promo</a></li>
+    <li><a href="../components/promo/promo-no-description.html">Promo with no description</a></li>
+    <li><a href="../components/promo/promo-small.html">Promo small</a></li>
+    <li><a href="../components/promo/promo-with-image.html">Promo with image</a></li>
+    <li><a href="../components/promo/promo-group.html">Promo group</a></li>
     <li><a href="../components/radios/index.html">Radios</a></li>
     <li><a href="../components/radios/inline.html">Radios inline</a></li>
     <li><a href="../components/radios/disabled.html">Radios disabled</a></li>
     <li><a href="../components/radios/divider.html">Radios with a divider</a></li>
     <li><a href="../components/radios/hint.html">Radios with hint text</a></li>
     <li><a href="../components/radios/without-fieldset.html">Radios without fieldset</a></li>
     <li><a href="../components/radios/hint-error.html">Radios with hint text and error message</a></li>
-    <li><a href="../components/review-date.html">Review date</a></li>
+    <li><a href="../components/review-date/index.html">Review date</a></li>
     <li><a href="../components/select/index.html">Select</a></li>
     <li><a href="../components/select/hint-error.html">Select with hint text and error message</a></li>
-    <li><a href="../components/skip-link.html">Skip link</a></li>
-    <li><a href="../components/tables.html">Table</a></li>
-    <li><a href="../components/tables-panel.html">Table as a panel</a></li>
+    <li><a href="../components/skip-link/index.html">Skip link</a></li>
+    <li><a href="../components/tables/index.html">Table</a></li>
+    <li><a href="../components/tables/tables-panel.html">Table as a panel</a></li>
     <li><a href="../components/textarea/index.html">Textarea</a></li>
     <li><a href="../components/textarea/error.html">Textarea with error message</a></li>
-    <li><a href="../components/warning-callout.html">Warning callout</a></li>
+    <li><a href="../components/warning-callout/index.html">Warning callout</a></li>
   </ul>
 
 {% endblock %}

packages/components/action-link/README.md

@@ -6,7 +6,7 @@ To discuss or contribute to this component, visit the [GitHub issue for this com
 
 ### Action link
 
-[Preview the action link component](https://nhsuk.github.io/nhsuk-frontend/components/action-link.html)
+[Preview the action link component](https://nhsuk.github.io/nhsuk-frontend/components/action-link/index.html)
 
 ### HTML markup
 

packages/components/breadcrumb/README.md

@@ -6,7 +6,7 @@ To discuss or contribute to this component, visit the [GitHub issue for this com
 
 ### Breadcrumb
 
-[Preview the breadcrumb component](https://nhsuk.github.io/nhsuk-frontend/components/breadcrumb.html)
+[Preview the breadcrumb component](https://nhsuk.github.io/nhsuk-frontend/components/breadcrumb/index.html)
 
 ### HTML markup
 

packages/components/care-card/README.md

@@ -10,7 +10,7 @@ Find out more about the care card component and when to use it in the [NHS Digit
 
 ### Care card non-urgent (blue)
 
-[Preview the care card non-urgent (blue) component](https://nhsuk.github.io/nhsuk-frontend/components/care-card-non-urgent.html)
+[Preview the care card non-urgent (blue) component](https://nhsuk.github.io/nhsuk-frontend/components/care-card/care-card-non-urgent.html)
 
 ### HTML markup
 
@@ -56,7 +56,7 @@ If you’re using Nunjucks macros in production be aware that using `html` argum
 
 ### Care card urgent (red)
 
-[Preview care card urgent (red) component](https://nhsuk.github.io/nhsuk-frontend/components/care-card-urgent.html)
+[Preview care card urgent (red) component](https://nhsuk.github.io/nhsuk-frontend/components/care-card/care-card-urgent.html)
 
 ### HTML markup
 
@@ -102,7 +102,7 @@ If you’re using Nunjucks macros in production be aware that using `html` argum
 
 ### Care card immediate (red and black)
 
-[Preview care card immediate (red and black) component](https://nhsuk.github.io/nhsuk-frontend/components/care-card-immediate.html)
+[Preview care card immediate (red and black) component](https://nhsuk.github.io/nhsuk-frontend/components/care-card/care-card-immediate.html)
 
 ### HTML markup
 

packages/components/contents-list/README.md

@@ -6,7 +6,7 @@ To discuss or contribute to this component, visit the [GitHub issue for this com
 
 ### Contents list
 
-[Preview the contents list component](https://nhsuk.github.io/nhsuk-frontend/components/contents-list.html)
+[Preview the contents list component](https://nhsuk.github.io/nhsuk-frontend/components/contents-list/index.html)
 
 ### HTML markup
 

packages/components/details/README.md

@@ -10,7 +10,7 @@ For this component to be accessible and compatible with older browsers, include
 
 ### Details
 
-[Preview the details component](https://nhsuk.github.io/nhsuk-frontend/components/details.html)
+[Preview the details component](https://nhsuk.github.io/nhsuk-frontend/components/details/index.html)
 
 ### HTML markup
 
@@ -62,7 +62,7 @@ If you’re using Nunjucks macros in production be aware that using `html` argum
 
 ### Expander
 
-[Preview the expander component](https://nhsuk.github.io/nhsuk-frontend/components/expander.html)
+[Preview the expander component](https://nhsuk.github.io/nhsuk-frontend/components/details/expander.html)
 
 ### HTML markup
 
@@ -166,7 +166,7 @@ If you’re using Nunjucks macros in production be aware that using `html` argum
 
 ### Expander group
 
-[Preview this component](https://nhsuk.github.io/nhsuk-frontend/components/expander-group.html)
+[Preview this component](https://nhsuk.github.io/nhsuk-frontend/components/details/expander-group.html)
 
 ### HTML markup
 

packages/components/do-dont-list/README.md

@@ -2,14 +2,14 @@
 
 To discuss or contribute to this component, visit the [GitHub issue for this component](https://github.com/nhsuk/nhsuk-frontend/issues/164).
 
-## Guidance 
+## Guidance
 Find out more about the do and don't list component and when to use it in the [NHS Digital service manual](https://beta.nhs.uk/service-manual/patterns/do-and-dont-lists/).
 
 ## Quick start examples
 
 ### Do and don't list
 
-[Preview the do and don't list component](https://nhsuk.github.io/nhsuk-frontend/components/do-dont-list.html)
+[Preview the do and don't list component](https://nhsuk.github.io/nhsuk-frontend/components/do-dont-list/index.html)
 
 ### HTML markup
 

packages/components/emergency-alert/README.md

@@ -6,7 +6,7 @@ To discuss or contribute to this component, visit the [GitHub issue for this com
 
 ### Emergency alert
 
-[Preview the emergency alert component](https://nhsuk.github.io/nhsuk-frontend/components/emergency-alert.html)
+[Preview the emergency alert component](https://nhsuk.github.io/nhsuk-frontend/components/emergency-alert/index.html)
 
 ### HTML markup
 

packages/components/feedback-banner/README.md

@@ -4,14 +4,14 @@ To discuss or contribute to this component, visit the [GitHub issue for this com
 
 ## Dependencies
 
-For this component to work, you need to make sure you include the required JavaScript. You can either include the 
+For this component to work, you need to make sure you include the required JavaScript. You can either include the
 compiled JavaScript for all components `nhsuk.min.js` or the individual component JavaScript `feedback-banner.js`.
 
 ## Quick start examples
 
 ### Feedback banner
 
-[Preview the feedback banner component](https://nhsuk.github.io/nhsuk-frontend/components/feedback-banner.html)
+[Preview the feedback banner component](https://nhsuk.github.io/nhsuk-frontend/components/feedback-banner/index.html)
 
 ### HTML markup
 

packages/components/footer/README.md

@@ -9,7 +9,7 @@ Find out more about the footer component and when to use it in the [NHS Digital
 
 ### Footer
 
-[Preview the footer component](https://nhsuk.github.io/nhsuk-frontend/components/footer.html)
+[Preview the footer component](https://nhsuk.github.io/nhsuk-frontend/components/footer/index.html)
 
 ### HTML markup