@comicrelief/component-library 8.21.0 → 8.22.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -19,6 +19,7 @@ const Footer = _ref => {
19
19
  campaign = 'Comic Relief',
20
20
  additionalLegalLine = '',
21
21
  overrideallowList = false,
22
+ showFundraisingRegulatorLogo = false,
22
23
  ...rest
23
24
  } = _ref;
24
25
  // Remove white space between words
@@ -41,7 +42,7 @@ const Footer = _ref => {
41
42
  }))), /*#__PURE__*/_react.default.createElement(_Nav.default, Object.assign({
42
43
  navItems: navItems,
43
44
  overrideallowList: overrideallowList
44
- }, rest)), /*#__PURE__*/_react.default.createElement(_FundraisingRegulatorLogo.default, null), /*#__PURE__*/_react.default.createElement(_Footer.FooterCopyright, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
45
+ }, rest)), showFundraisingRegulatorLogo && /*#__PURE__*/_react.default.createElement(_FundraisingRegulatorLogo.default, null), /*#__PURE__*/_react.default.createElement(_Footer.FooterCopyright, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
45
46
  tag: "p",
46
47
  color: "grey"
47
48
  }, footerCopy)))));
@@ -16,12 +16,13 @@ import footerCopy from './data/footerCopy';
16
16
  overrideallowList
17
17
  />
18
18
 
19
- <p>Adding a additionalLegalLine to the top of the footer</p>
19
+ <p>Adding a additionalLegalLine to the top of the footer, add FR logo</p>
20
20
  <Footer
21
21
  additionalLegalLine="CHICKEN RUN: DAWN OF THE NUGGET ™/ © Aardman. Netflix ™/© Netflix. Used with permission/Wallace & Gromit Ltd. All rights reserved/ Shaun the Sheep © & TM /Morph ©/TM Aardman Animations Ltd. All rights reserved."
22
22
  navItems={data}
23
23
  footerCopy={footerCopy.copy}
24
24
  campaign="Comic Relief"
25
+ showFundraisingRegulatorLogo
25
26
  />
26
27
  </>
27
28
  ```
@@ -20,8 +20,7 @@ const FundraisingRegulatorLogo = () => /*#__PURE__*/_react.default.createElement
20
20
  width: '150px',
21
21
  textDecoration: 'none'
22
22
  },
23
- target: "_blank",
24
- rel: "noreferrer"
23
+ target: "_blank"
25
24
  }, /*#__PURE__*/_react.default.createElement("img", {
26
25
  src: "https://www.fundraisingregulator.org.uk/fr-badge/80983ed7-ea80-40db-8e52-4a3351d9e77d/en/white",
27
26
  width: "100%",
@@ -27,7 +27,7 @@ exports[`renders correctly 1`] = `
27
27
  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
28
28
  }
29
29
 
30
- .c26 {
30
+ .c25 {
31
31
  color: #969598;
32
32
  font-size: 1rem;
33
33
  line-height: 1rem;
@@ -281,16 +281,6 @@ exports[`renders correctly 1`] = `
281
281
  right: -25px;
282
282
  }
283
283
 
284
- .c24 {
285
- width: 75%;
286
- margin: 3rem 0;
287
- max-width: 200px;
288
- }
289
-
290
- .c24 img {
291
- display: block;
292
- }
293
-
294
284
  .c0 {
295
285
  text-align: center;
296
286
  line-height: initial;
@@ -325,7 +315,7 @@ exports[`renders correctly 1`] = `
325
315
  align-items: center;
326
316
  }
327
317
 
328
- .c25 {
318
+ .c24 {
329
319
  display: block;
330
320
  width: 100%;
331
321
  height: 100%;
@@ -333,7 +323,7 @@ exports[`renders correctly 1`] = `
333
323
  margin-top: 0;
334
324
  }
335
325
 
336
- .c25 p {
326
+ .c24 p {
337
327
  font-size: 15px;
338
328
  line-height: 24px;
339
329
  margin-bottom: 5px;
@@ -540,7 +530,7 @@ exports[`renders correctly 1`] = `
540
530
  }
541
531
 
542
532
  @media (min-width:1024px) {
543
- .c25 p {
533
+ .c24 p {
544
534
  font-size: 16px;
545
535
  line-height: 27px;
546
536
  }
@@ -1217,33 +1207,9 @@ exports[`renders correctly 1`] = `
1217
1207
  </nav>
1218
1208
  <div
1219
1209
  className="c24"
1220
- >
1221
- <a
1222
- className="fr-digital-badge"
1223
- href="https://www.fundraisingregulator.org.uk/validate?registrant=COMIC+RELIEF"
1224
- rel="noreferrer"
1225
- style={
1226
- Object {
1227
- "height": "auto",
1228
- "textDecoration": "none",
1229
- "width": "150px",
1230
- }
1231
- }
1232
- target="_blank"
1233
- >
1234
- <img
1235
- alt="Fundraising Regulator badge with validation link"
1236
- loading="lazy"
1237
- src="https://www.fundraisingregulator.org.uk/fr-badge/80983ed7-ea80-40db-8e52-4a3351d9e77d/en/white"
1238
- width="100%"
1239
- />
1240
- </a>
1241
- </div>
1242
- <div
1243
- className="c25"
1244
1210
  >
1245
1211
  <p
1246
- className="c26"
1212
+ className="c25"
1247
1213
  color="grey"
1248
1214
  size="s"
1249
1215
  >
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@comicrelief/component-library",
3
3
  "author": "Comic Relief Engineering Team",
4
- "version": "8.21.0",
4
+ "version": "8.22.1",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
@@ -17,7 +17,7 @@ import {
17
17
  } from './Footer.style';
18
18
 
19
19
  const Footer = ({
20
- navItems = {}, footerCopy = '', campaign = 'Comic Relief', additionalLegalLine = '', overrideallowList = false, ...rest
20
+ navItems = {}, footerCopy = '', campaign = 'Comic Relief', additionalLegalLine = '', overrideallowList = false, showFundraisingRegulatorLogo = false, ...rest
21
21
  }) => {
22
22
  // Remove white space between words
23
23
  const campaignName = campaign.replace(/\s/g, '').toLowerCase();
@@ -40,7 +40,7 @@ const Footer = ({
40
40
  </FooterBranding>
41
41
  <FooterNav navItems={navItems} overrideallowList={overrideallowList} {...rest} />
42
42
 
43
- <FundraisingRegulatorLogo />
43
+ { showFundraisingRegulatorLogo && <FundraisingRegulatorLogo /> }
44
44
 
45
45
  <FooterCopyright>
46
46
  <Text tag="p" color="grey">
@@ -58,7 +58,8 @@ Footer.propTypes = {
58
58
  footerCopy: PropTypes.string,
59
59
  campaign: PropTypes.string,
60
60
  overrideallowList: PropTypes.bool,
61
- additionalLegalLine: PropTypes.string
61
+ additionalLegalLine: PropTypes.string,
62
+ showFundraisingRegulatorLogo: PropTypes.bool
62
63
  };
63
64
 
64
65
  export default Footer;
@@ -16,12 +16,13 @@ import footerCopy from './data/footerCopy';
16
16
  overrideallowList
17
17
  />
18
18
 
19
- <p>Adding a additionalLegalLine to the top of the footer</p>
19
+ <p>Adding a additionalLegalLine to the top of the footer, add FR logo</p>
20
20
  <Footer
21
21
  additionalLegalLine="CHICKEN RUN: DAWN OF THE NUGGET ™/ © Aardman. Netflix ™/© Netflix. Used with permission/Wallace & Gromit Ltd. All rights reserved/ Shaun the Sheep © & TM /Morph ©/TM Aardman Animations Ltd. All rights reserved."
22
22
  navItems={data}
23
23
  footerCopy={footerCopy.copy}
24
24
  campaign="Comic Relief"
25
+ showFundraisingRegulatorLogo
25
26
  />
26
27
  </>
27
28
  ```
@@ -16,7 +16,8 @@ const FundraisingRegulatorWrapper = styled.div`
16
16
  const FundraisingRegulatorLogo = () => (
17
17
  <FundraisingRegulatorWrapper>
18
18
  {/* Code from https://www.fundraisingregulator.org.uk/ */}
19
- <a href="https://www.fundraisingregulator.org.uk/validate?registrant=COMIC+RELIEF" className="fr-digital-badge" style={{ height: 'auto', width: '150px', textDecoration: 'none' }} target="_blank" rel="noreferrer">
19
+ {/* eslint-disable-next-line react/jsx-no-target-blank */}
20
+ <a href="https://www.fundraisingregulator.org.uk/validate?registrant=COMIC+RELIEF" className="fr-digital-badge" style={{ height: 'auto', width: '150px', textDecoration: 'none' }} target="_blank">
20
21
  <img src="https://www.fundraisingregulator.org.uk/fr-badge/80983ed7-ea80-40db-8e52-4a3351d9e77d/en/white" width="100%" alt="Fundraising Regulator badge with validation link" loading="lazy" />
21
22
  </a>
22
23
  </FundraisingRegulatorWrapper>
@@ -27,7 +27,7 @@ exports[`renders correctly 1`] = `
27
27
  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
28
28
  }
29
29
 
30
- .c26 {
30
+ .c25 {
31
31
  color: #969598;
32
32
  font-size: 1rem;
33
33
  line-height: 1rem;
@@ -281,16 +281,6 @@ exports[`renders correctly 1`] = `
281
281
  right: -25px;
282
282
  }
283
283
 
284
- .c24 {
285
- width: 75%;
286
- margin: 3rem 0;
287
- max-width: 200px;
288
- }
289
-
290
- .c24 img {
291
- display: block;
292
- }
293
-
294
284
  .c0 {
295
285
  text-align: center;
296
286
  line-height: initial;
@@ -325,7 +315,7 @@ exports[`renders correctly 1`] = `
325
315
  align-items: center;
326
316
  }
327
317
 
328
- .c25 {
318
+ .c24 {
329
319
  display: block;
330
320
  width: 100%;
331
321
  height: 100%;
@@ -333,7 +323,7 @@ exports[`renders correctly 1`] = `
333
323
  margin-top: 0;
334
324
  }
335
325
 
336
- .c25 p {
326
+ .c24 p {
337
327
  font-size: 15px;
338
328
  line-height: 24px;
339
329
  margin-bottom: 5px;
@@ -540,7 +530,7 @@ exports[`renders correctly 1`] = `
540
530
  }
541
531
 
542
532
  @media (min-width:1024px) {
543
- .c25 p {
533
+ .c24 p {
544
534
  font-size: 16px;
545
535
  line-height: 27px;
546
536
  }
@@ -1217,33 +1207,9 @@ exports[`renders correctly 1`] = `
1217
1207
  </nav>
1218
1208
  <div
1219
1209
  className="c24"
1220
- >
1221
- <a
1222
- className="fr-digital-badge"
1223
- href="https://www.fundraisingregulator.org.uk/validate?registrant=COMIC+RELIEF"
1224
- rel="noreferrer"
1225
- style={
1226
- Object {
1227
- "height": "auto",
1228
- "textDecoration": "none",
1229
- "width": "150px",
1230
- }
1231
- }
1232
- target="_blank"
1233
- >
1234
- <img
1235
- alt="Fundraising Regulator badge with validation link"
1236
- loading="lazy"
1237
- src="https://www.fundraisingregulator.org.uk/fr-badge/80983ed7-ea80-40db-8e52-4a3351d9e77d/en/white"
1238
- width="100%"
1239
- />
1240
- </a>
1241
- </div>
1242
- <div
1243
- className="c25"
1244
1210
  >
1245
1211
  <p
1246
- className="c26"
1212
+ className="c25"
1247
1213
  color="grey"
1248
1214
  size="s"
1249
1215
  >