Skip to content

Commit 1ae0fba

Browse files
nicki-nhsnicki-nhs
committed
CCM-10893 Fix footer styling
1 parent 9d3733b commit 1ae0fba

File tree

3 files changed

+127
-23
lines changed

3 files changed

+127
-23
lines changed

‎frontend/src/__tests__/components/molecules/Footer.test.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,4 +81,10 @@ describe('Footer component', () => {
8181
screen.getByTestId('nhs-england-copyright-text')
8282
).toBeInTheDocument();
8383
});
84+
85+
it('matches snapshot', () => {
86+
const container = render(<NHSNotifyFooter />);
87+
88+
expect(container.asFragment()).toMatchSnapshot();
89+
});
8490
});

‎frontend/src/__tests__/components/molecules/__snapshots__/Footer.test.tsx.snap‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`Footer component matches snapshot 1`] = `
4+
<DocumentFragment>
5+
<footer
6+
class="nhsuk-footer"
7+
data-testid="page-footer"
8+
role="contentinfo"
9+
>
10+
<div
11+
class="nhsuk-width-container"
12+
>
13+
<div
14+
class="nhsuk-footer__meta"
15+
>
16+
<h2
17+
class="nhsuk-u-visually-hidden"
18+
data-testid="support-links"
19+
>
20+
Support links
21+
</h2>
22+
<ul
23+
class="nhsuk-footer__list"
24+
data-testid="footer-links"
25+
>
26+
<li
27+
class="nhsuk-footer__list-item"
28+
>
29+
<a
30+
class="nhsuk-footer__list-item-link"
31+
data-testid="acceptable-use-policy-statement-link"
32+
href="https://digital.nhs.uk/services/nhs-notify/acceptable-use-policy"
33+
rel="noopener noreferrer"
34+
target="_blank"
35+
>
36+
Acceptable use policy
37+
</a>
38+
</li>
39+
<li
40+
class="nhsuk-footer__list-item"
41+
>
42+
<a
43+
class="nhsuk-footer__list-item-link"
44+
data-testid="accessibility-statement-link"
45+
href="/accessibility"
46+
rel="noopener noreferrer"
47+
target="_blank"
48+
>
49+
Accessibility statement
50+
</a>
51+
</li>
52+
<li
53+
class="nhsuk-footer__list-item"
54+
>
55+
<a
56+
class="nhsuk-footer__list-item-link"
57+
data-testid="cookies-statement-link"
58+
href="/cookies"
59+
rel="noopener noreferrer"
60+
target="_blank"
61+
>
62+
Cookies
63+
</a>
64+
</li>
65+
<li
66+
class="nhsuk-footer__list-item"
67+
>
68+
<a
69+
class="nhsuk-footer__list-item-link"
70+
data-testid="privacy-statement-link"
71+
href="https://digital.nhs.uk/services/nhs-notify/transparency-notice"
72+
rel="noopener noreferrer"
73+
target="_blank"
74+
>
75+
Privacy
76+
</a>
77+
</li>
78+
<li
79+
class="nhsuk-footer__list-item"
80+
>
81+
<a
82+
class="nhsuk-footer__list-item-link"
83+
data-testid="terms-and-conditions-statement-link"
84+
href="https://digital.nhs.uk/services/nhs-notify/terms-and-conditions"
85+
rel="noopener noreferrer"
86+
target="_blank"
87+
>
88+
Terms and conditions
89+
</a>
90+
</li>
91+
</ul>
92+
<p
93+
class="nhsuk-body-s"
94+
data-testid="nhs-england-copyright-text"
95+
>
96+
© NHS England
97+
</p>
98+
</div>
99+
</div>
100+
</footer>
101+
</DocumentFragment>
102+
`;

‎frontend/src/components/molecules/Footer/Footer.tsx‎

Lines changed: 19 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,14 @@ const footerContent = content.components.footer;
44

55
export function NHSNotifyFooter() {
66
return (
7-
<footer role='contentinfo' data-testid='page-footer'>
8-
<div className='nhsuk-footer-container'>
9-
<div className='nhsuk-width-container'>
7+
<footer role='contentinfo' data-testid='page-footer' className='nhsuk-footer'>
8+
<div className='nhsuk-width-container'>
9+
<div className='nhsuk-footer__meta'>
1010
<h2 className='nhsuk-u-visually-hidden' data-testid='support-links'>
1111
{footerContent.supportLinks}
1212
</h2>
13-
<div className='nhsuk-footer'>
14-
<ul className='nhsuk-footer__list' data-testid='footer-links'>
15-
<li className='nhsuk-footer__list-item nhsuk-footer-default__list-item'>
13+
<ul className='nhsuk-footer__list' data-testid='footer-links'>
14+
<li className='nhsuk-footer__list-item'>
1615
<a
1716
className='nhsuk-footer__list-item-link'
1817
href={footerContent.links.acceptableUsePolicy.url}
@@ -22,8 +21,8 @@ export function NHSNotifyFooter() {
2221
>
2322
{footerContent.links.acceptableUsePolicy.text}
2423
</a>
25-
</li>
26-
<li className='nhsuk-footer__list-item nhsuk-footer-default__list-item'>
24+
</li>
25+
<li className='nhsuk-footer__list-item'>
2726
<a
2827
className='nhsuk-footer__list-item-link'
2928
href={footerContent.links.accessibilityStatement.url}
@@ -33,8 +32,8 @@ export function NHSNotifyFooter() {
3332
>
3433
{footerContent.links.accessibilityStatement.text}
3534
</a>
36-
</li>
37-
<li className='nhsuk-footer__list-item nhsuk-footer-default__list-item'>
35+
</li>
36+
<li className='nhsuk-footer__list-item'>
3837
<a
3938
className='nhsuk-footer__list-item-link'
4039
href={footerContent.links.cookies.url}
@@ -44,8 +43,8 @@ export function NHSNotifyFooter() {
4443
>
4544
{footerContent.links.cookies.text}
4645
</a>
47-
</li>
48-
<li className='nhsuk-footer__list-item nhsuk-footer-default__list-item'>
46+
</li>
47+
<li className='nhsuk-footer__list-item'>
4948
<a
5049
className='nhsuk-footer__list-item-link'
5150
href={footerContent.links.privacy.url}
@@ -55,8 +54,8 @@ export function NHSNotifyFooter() {
5554
>
5655
{footerContent.links.privacy.text}
5756
</a>
58-
</li>
59-
<li className='nhsuk-footer__list-item nhsuk-footer-default__list-item'>
57+
</li>
58+
<li className='nhsuk-footer__list-item'>
6059
<a
6160
className='nhsuk-footer__list-item-link'
6261
href={footerContent.links.termsAndConditions.url}
@@ -66,15 +65,12 @@ export function NHSNotifyFooter() {
6665
>
6766
{footerContent.links.termsAndConditions.text}
6867
</a>
69-
</li>
70-
</ul>
71-
<p
72-
className='nhsuk-footer__copyright'
73-
data-testid='nhs-england-copyright-text'
74-
>
75-
&copy; {footerContent.nhsEngland}
76-
</p>
77-
</div>
68+
</li>
69+
</ul>
70+
71+
<p className='nhsuk-body-s' data-testid='nhs-england-copyright-text'>
72+
&copy; {footerContent.nhsEngland}
73+
</p>
7874
</div>
7975
</div>
8076
</footer>

0 commit comments

Comments
 (0)