@comicrelief/component-library 8.49.0 → 8.49.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.
Files changed (57) hide show
  1. package/dist/components/Atoms/Button/Button.style.js +1 -1
  2. package/dist/components/Atoms/Button/Button.test.js +1 -1
  3. package/dist/components/Atoms/Link/Link.style.js +1 -1
  4. package/dist/components/Atoms/Link/Link.test.js +1 -1
  5. package/dist/components/Molecules/ArticleTeaser/ArticleTeaser.js +0 -1
  6. package/dist/components/Molecules/ArticleTeaser/ArticleTeaser.test.js +0 -2
  7. package/dist/components/Molecules/CardDs/__snapshots__/CardDs.test.js.snap +2 -2
  8. package/dist/components/Molecules/Countdown/Countdown.js +4 -8
  9. package/dist/components/Molecules/Descriptor/Descriptor.js +1 -2
  10. package/dist/components/Molecules/Descriptor/Descriptor.test.js +0 -2
  11. package/dist/components/Molecules/InfoBanner/InfoBanner.js +6 -12
  12. package/dist/components/Molecules/InfoBanner/__snapshots__/InfoBanner.test.js.snap +0 -1
  13. package/dist/components/Molecules/Promo/__snapshots__/Promo.test.js.snap +2 -2
  14. package/dist/components/Molecules/SearchResult/SearchResult.js +2 -4
  15. package/dist/components/Molecules/SearchResult/__snapshots__/SearchResult.test.js.snap +0 -8
  16. package/dist/components/Molecules/SingleMessage/__snapshots__/SingleMessage.test.js.snap +2 -2
  17. package/dist/components/Molecules/SingleMessageDS/SingleMessageDs.style.js +1 -1
  18. package/dist/components/Molecules/SingleMessageDS/__snapshots__/SingleMessageDs.test.js.snap +1 -2
  19. package/dist/components/Organisms/CookieBanner/CookieBanner.test.js +1 -1
  20. package/dist/components/Organisms/Donate/Donate.js +1 -2
  21. package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +0 -4
  22. package/dist/components/Organisms/EmailSignUp/_EmailSignUp.js +1 -2
  23. package/dist/components/Organisms/EmailSignUp/__snapshots__/EmailSignUp.test.js.snap +1 -2
  24. package/dist/components/Organisms/FooterNew/__snapshots__/FooterNew.test.js.snap +1 -1
  25. package/dist/components/Organisms/ImpactSlider/ImpactSlider.js +0 -1
  26. package/dist/components/Organisms/ImpactSlider/_ImpactMoneybuys.js +0 -1
  27. package/dist/components/Organisms/WYMDCarousel/WYMDCarousel.js +0 -2
  28. package/dist/components/Organisms/WYMDCarousel/__snapshots__/WYMDCarousel.test.js.snap +0 -1
  29. package/package.json +1 -1
  30. package/src/components/Atoms/Button/Button.style.js +1 -1
  31. package/src/components/Atoms/Button/Button.test.js +1 -1
  32. package/src/components/Atoms/Link/Link.style.js +1 -1
  33. package/src/components/Atoms/Link/Link.test.js +1 -1
  34. package/src/components/Molecules/ArticleTeaser/ArticleTeaser.js +0 -1
  35. package/src/components/Molecules/ArticleTeaser/ArticleTeaser.test.js +0 -2
  36. package/src/components/Molecules/CardDs/__snapshots__/CardDs.test.js.snap +2 -2
  37. package/src/components/Molecules/Countdown/Countdown.js +4 -4
  38. package/src/components/Molecules/Descriptor/Descriptor.js +0 -2
  39. package/src/components/Molecules/Descriptor/Descriptor.test.js +0 -2
  40. package/src/components/Molecules/InfoBanner/InfoBanner.js +6 -6
  41. package/src/components/Molecules/InfoBanner/__snapshots__/InfoBanner.test.js.snap +0 -1
  42. package/src/components/Molecules/Promo/__snapshots__/Promo.test.js.snap +2 -2
  43. package/src/components/Molecules/SearchResult/SearchResult.js +2 -2
  44. package/src/components/Molecules/SearchResult/__snapshots__/SearchResult.test.js.snap +0 -8
  45. package/src/components/Molecules/SingleMessage/__snapshots__/SingleMessage.test.js.snap +2 -2
  46. package/src/components/Molecules/SingleMessageDS/SingleMessageDs.style.js +0 -1
  47. package/src/components/Molecules/SingleMessageDS/__snapshots__/SingleMessageDs.test.js.snap +1 -2
  48. package/src/components/Organisms/CookieBanner/CookieBanner.test.js +1 -1
  49. package/src/components/Organisms/Donate/Donate.js +1 -1
  50. package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +0 -4
  51. package/src/components/Organisms/EmailSignUp/_EmailSignUp.js +1 -1
  52. package/src/components/Organisms/EmailSignUp/__snapshots__/EmailSignUp.test.js.snap +1 -2
  53. package/src/components/Organisms/FooterNew/__snapshots__/FooterNew.test.js.snap +1 -1
  54. package/src/components/Organisms/ImpactSlider/ImpactSlider.js +1 -1
  55. package/src/components/Organisms/ImpactSlider/_ImpactMoneybuys.js +1 -1
  56. package/src/components/Organisms/WYMDCarousel/WYMDCarousel.js +2 -2
  57. package/src/components/Organisms/WYMDCarousel/__snapshots__/WYMDCarousel.test.js.snap +0 -1
@@ -11,7 +11,7 @@ var _fontHelper = _interopRequireDefault(require("../../../theme/crTheme/fontHel
11
11
  const StyledButton = _styledComponents.default.button.withConfig({
12
12
  displayName: "Buttonstyle__StyledButton",
13
13
  componentId: "sc-k17brs-0"
14
- })(["display:inline-flex;position:relative;text-decoration:none;transition:all 0.2s;min-height:2.5rem;width:100%;justify-content:center;align-items:center;border:none;cursor:pointer;padding:0.6rem 1rem;border-radius:0.5rem;> a{text-decoration:none;}", ";", " @media ", "{width:", ";}@media ", "{width:", ";}"], _ref => {
14
+ })(["display:inline-flex;position:relative;text-decoration:none;transition:all 0.2s;height:2.5rem;width:100%;justify-content:center;align-items:center;border:none;cursor:pointer;padding:0.6rem 1rem;border-radius:0.5rem;> a{text-decoration:none;}", ";", " @media ", "{width:", ";}@media ", "{width:", ";}"], _ref => {
15
15
  let {
16
16
  color,
17
17
  theme,
@@ -20,7 +20,7 @@ it('renders a standard styled link correctly', () => {
20
20
  text-decoration: none;
21
21
  -webkit-transition: all 0.2s;
22
22
  transition: all 0.2s;
23
- min-height: 2.5rem;
23
+ height: 2.5rem;
24
24
  width: 100%;
25
25
  -webkit-box-pack: center;
26
26
  -webkit-justify-content: center;
@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
10
10
  var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
11
11
  var _hideVisually = _interopRequireDefault(require("../../../theme/shared/hideVisually"));
12
12
  var _fontHelper = _interopRequireDefault(require("../../../theme/crTheme/fontHelper"));
13
- const buttonStyle = () => (0, _styledComponents.css)(["display:inline-flex;position:relative;text-decoration:none;transition:all 0.2s;min-height:2.5em;width:100%;justify-content:center;align-items:center;border:none;cursor:pointer;padding:0.6rem 1rem;border-radius:0.5rem;", ";", " ", ";@media ", "{width:", ";}@media ", "{width:", ";", ";}"], _ref => {
13
+ const buttonStyle = () => (0, _styledComponents.css)(["display:inline-flex;position:relative;text-decoration:none;transition:all 0.2s;height:2.5rem;width:100%;justify-content:center;align-items:center;border:none;cursor:pointer;padding:0.6rem 1rem;border-radius:0.5rem;", ";", " ", ";@media ", "{width:", ";}@media ", "{width:", ";", ";}"], _ref => {
14
14
  let {
15
15
  color,
16
16
  theme,
@@ -196,7 +196,7 @@ it('renders link styled as button correctly', () => {
196
196
  text-decoration: none;
197
197
  -webkit-transition: all 0.2s;
198
198
  transition: all 0.2s;
199
- min-height: 2.5em;
199
+ height: 2.5rem;
200
200
  width: 100%;
201
201
  -webkit-box-pack: center;
202
202
  -webkit-justify-content: center;
@@ -176,7 +176,6 @@ const ArticleTeaser = _ref15 => {
176
176
  tag: "h3",
177
177
  height: "2rem",
178
178
  weight: "normal",
179
- uppercase: true,
180
179
  family: family
181
180
  }, title), time && /*#__PURE__*/_react.default.createElement(Time, {
182
181
  size: "xs",
@@ -60,7 +60,6 @@ it('renders article teaser correctly', () => {
60
60
  font-family: 'Anton',Impact,sans-serif;
61
61
  font-weight: normal;
62
62
  line-height: 2rem;
63
- text-transform: uppercase;
64
63
  }
65
64
 
66
65
  .c10 span {
@@ -358,7 +357,6 @@ it('renders press realese correctly', () => {
358
357
  font-family: 'Anton',Impact,sans-serif;
359
358
  font-weight: normal;
360
359
  line-height: 2rem;
361
- text-transform: uppercase;
362
360
  }
363
361
 
364
362
  .c10 span {
@@ -37,7 +37,7 @@ exports[`renders Column view correctly 1`] = `
37
37
  text-decoration: none;
38
38
  -webkit-transition: all 0.2s;
39
39
  transition: all 0.2s;
40
- min-height: 2.5em;
40
+ height: 2.5rem;
41
41
  width: 100%;
42
42
  -webkit-box-pack: center;
43
43
  -webkit-justify-content: center;
@@ -319,7 +319,7 @@ exports[`renders correctly 1`] = `
319
319
  text-decoration: none;
320
320
  -webkit-transition: all 0.2s;
321
321
  transition: all 0.2s;
322
- min-height: 2.5em;
322
+ height: 2.5rem;
323
323
  width: 100%;
324
324
  -webkit-box-pack: center;
325
325
  -webkit-justify-content: center;
@@ -59,8 +59,7 @@ const Countdown = _ref => {
59
59
  size: "xl"
60
60
  }, countdownTime.days), /*#__PURE__*/_react.default.createElement(_Text.default, {
61
61
  color: color,
62
- size: "xs",
63
- uppercase: true
62
+ size: "xs"
64
63
  }, "days")), /*#__PURE__*/_react.default.createElement(_Text.default, {
65
64
  color: color,
66
65
  family: "Anton",
@@ -71,8 +70,7 @@ const Countdown = _ref => {
71
70
  size: "xl"
72
71
  }, countdownTime.hours), /*#__PURE__*/_react.default.createElement(_Text.default, {
73
72
  color: color,
74
- size: "xs",
75
- uppercase: true
73
+ size: "xs"
76
74
  }, "hours")), /*#__PURE__*/_react.default.createElement(_Text.default, {
77
75
  color: color,
78
76
  family: "Anton",
@@ -83,16 +81,14 @@ const Countdown = _ref => {
83
81
  size: "xl"
84
82
  }, countdownTime.minutes), /*#__PURE__*/_react.default.createElement(_Text.default, {
85
83
  color: color,
86
- size: "xs",
87
- uppercase: true
84
+ size: "xs"
88
85
  }, "minutes")), /*#__PURE__*/_react.default.createElement(_Countdown.Digits, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
89
86
  color: color,
90
87
  family: "Anton",
91
88
  size: "xl"
92
89
  }, countdownTime.seconds), /*#__PURE__*/_react.default.createElement(_Text.default, {
93
90
  color: color,
94
- size: "xs",
95
- uppercase: true
91
+ size: "xs"
96
92
  }, "seconds"))));
97
93
  };
98
94
  var _default = exports.default = Countdown;
@@ -94,7 +94,7 @@ const TagWrapper = _styledComponents.default.div.withConfig({
94
94
  const Tag = (0, _styledComponents.default)(_Text.default).withConfig({
95
95
  displayName: "Descriptor__Tag",
96
96
  componentId: "sc-1np5gzw-8"
97
- })(["position:relative;text-transform:uppercase;"]);
97
+ })(["position:relative;"]);
98
98
  const Description = _styledComponents.default.div.withConfig({
99
99
  displayName: "Descriptor__Description",
100
100
  componentId: "sc-1np5gzw-9"
@@ -145,7 +145,6 @@ const Descriptor = _ref3 => {
145
145
  tag: "h3",
146
146
  height: "2rem",
147
147
  weight: "normal",
148
- uppercase: true,
149
148
  family: "Anton"
150
149
  }, title), /*#__PURE__*/_react.default.createElement(TagWrapper, null, tagItems), /*#__PURE__*/_react.default.createElement(Description, null, children)));
151
150
  };
@@ -58,7 +58,6 @@ it('renders article teaser correctly', () => {
58
58
  font-family: 'Anton',Impact,sans-serif;
59
59
  font-weight: normal;
60
60
  line-height: 2rem;
61
- text-transform: uppercase;
62
61
  }
63
62
 
64
63
  .c7 span {
@@ -180,7 +179,6 @@ it('renders article teaser correctly', () => {
180
179
 
181
180
  .c11 {
182
181
  position: relative;
183
- text-transform: uppercase;
184
182
  }
185
183
 
186
184
  .c12 {
@@ -46,22 +46,19 @@ const InfoBanner = _ref3 => {
46
46
  } = _ref3;
47
47
  return /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
48
48
  tag: "h3",
49
- size: "md",
50
- uppercase: true
49
+ size: "md"
51
50
  }, "Project Name"), /*#__PURE__*/_react.default.createElement(_Text.default, {
52
51
  tag: "p",
53
52
  size: "s"
54
53
  }, title)), /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
55
54
  tag: "h3",
56
- size: "md",
57
- uppercase: true
55
+ size: "md"
58
56
  }, "End Date"), /*#__PURE__*/_react.default.createElement(_Text.default, {
59
57
  tag: "p",
60
58
  size: "s"
61
59
  }, endDate)), /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
62
60
  tag: "h3",
63
- size: "md",
64
- uppercase: true
61
+ size: "md"
65
62
  }, "Funding theme"), /*#__PURE__*/_react.default.createElement(_Text.default, {
66
63
  tag: "p",
67
64
  size: "s"
@@ -71,8 +68,7 @@ const InfoBanner = _ref3 => {
71
68
  type: "standard"
72
69
  }, theme))), /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
73
70
  tag: "h3",
74
- size: "md",
75
- uppercase: true
71
+ size: "md"
76
72
  }, "Amount Awarded"), /*#__PURE__*/_react.default.createElement(_Text.default, {
77
73
  tag: "p",
78
74
  size: "s"
@@ -84,15 +80,13 @@ const InfoBanner = _ref3 => {
84
80
  renderText: value => value
85
81
  }))), /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
86
82
  tag: "h3",
87
- size: "md",
88
- uppercase: true
83
+ size: "md"
89
84
  }, "Start Date"), /*#__PURE__*/_react.default.createElement(_Text.default, {
90
85
  tag: "p",
91
86
  size: "s"
92
87
  }, startDate)), /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
93
88
  tag: "h3",
94
- size: "md",
95
- uppercase: true
89
+ size: "md"
96
90
  }, "Beneficiary Country"), /*#__PURE__*/_react.default.createElement(_Text.default, {
97
91
  tag: "p",
98
92
  size: "s"
@@ -16,7 +16,6 @@ exports[`renders correctly 1`] = `
16
16
  .c2 {
17
17
  font-size: undefined;
18
18
  line-height: normal;
19
- text-transform: uppercase;
20
19
  }
21
20
 
22
21
  .c2 span {
@@ -76,7 +76,7 @@ exports[`renders Promo correctly 1`] = `
76
76
  text-decoration: none;
77
77
  -webkit-transition: all 0.2s;
78
78
  transition: all 0.2s;
79
- min-height: 2.5em;
79
+ height: 2.5rem;
80
80
  width: 100%;
81
81
  -webkit-box-pack: center;
82
82
  -webkit-justify-content: center;
@@ -426,7 +426,7 @@ exports[`renders Promo correctly end position 1`] = `
426
426
  text-decoration: none;
427
427
  -webkit-transition: all 0.2s;
428
428
  transition: all 0.2s;
429
- min-height: 2.5em;
429
+ height: 2.5rem;
430
430
  width: 100%;
431
431
  -webkit-box-pack: center;
432
432
  -webkit-justify-content: center;
@@ -93,12 +93,10 @@ const SearchResult = _ref7 => {
93
93
  objectFit: "cover",
94
94
  alt: alt
95
95
  })), /*#__PURE__*/_react.default.createElement(CopyWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
96
- size: "xs",
97
- uppercase: true
96
+ size: "xs"
98
97
  }, `${type ? ` ${type} |` : ''} ${date}`), /*#__PURE__*/_react.default.createElement(Title, {
99
98
  size: "xl",
100
- tag: "h3",
101
- uppercase: true
99
+ tag: "h3"
102
100
  }, title), copy && /*#__PURE__*/_react.default.createElement(_Text.default, {
103
101
  size: "m",
104
102
  tag: "p"
@@ -16,7 +16,6 @@ exports[`renders correctly in minimalist form 1`] = `
16
16
  .c7 {
17
17
  font-size: 0.75rem;
18
18
  line-height: normal;
19
- text-transform: uppercase;
20
19
  }
21
20
 
22
21
  .c7 span {
@@ -39,7 +38,6 @@ exports[`renders correctly in minimalist form 1`] = `
39
38
  .c8 {
40
39
  font-size: 2rem;
41
40
  line-height: normal;
42
- text-transform: uppercase;
43
41
  }
44
42
 
45
43
  .c8 span {
@@ -236,7 +234,6 @@ exports[`renders correctly with copy 1`] = `
236
234
  .c7 {
237
235
  font-size: 0.75rem;
238
236
  line-height: normal;
239
- text-transform: uppercase;
240
237
  }
241
238
 
242
239
  .c7 span {
@@ -259,7 +256,6 @@ exports[`renders correctly with copy 1`] = `
259
256
  .c8 {
260
257
  font-size: 2rem;
261
258
  line-height: normal;
262
- text-transform: uppercase;
263
259
  }
264
260
 
265
261
  .c8 span {
@@ -496,7 +492,6 @@ exports[`renders correctly with date 1`] = `
496
492
  .c7 {
497
493
  font-size: 0.75rem;
498
494
  line-height: normal;
499
- text-transform: uppercase;
500
495
  }
501
496
 
502
497
  .c7 span {
@@ -519,7 +514,6 @@ exports[`renders correctly with date 1`] = `
519
514
  .c8 {
520
515
  font-size: 2rem;
521
516
  line-height: normal;
522
- text-transform: uppercase;
523
517
  }
524
518
 
525
519
  .c8 span {
@@ -716,7 +710,6 @@ exports[`renders correctly with date and type 1`] = `
716
710
  .c7 {
717
711
  font-size: 0.75rem;
718
712
  line-height: normal;
719
- text-transform: uppercase;
720
713
  }
721
714
 
722
715
  .c7 span {
@@ -739,7 +732,6 @@ exports[`renders correctly with date and type 1`] = `
739
732
  .c8 {
740
733
  font-size: 2rem;
741
734
  line-height: normal;
742
- text-transform: uppercase;
743
735
  }
744
736
 
745
737
  .c8 span {
@@ -268,7 +268,7 @@ exports[`renders Single Message with Image correctly 1`] = `
268
268
  text-decoration: none;
269
269
  -webkit-transition: all 0.2s;
270
270
  transition: all 0.2s;
271
- min-height: 2.5em;
271
+ height: 2.5rem;
272
272
  width: 100%;
273
273
  -webkit-box-pack: center;
274
274
  -webkit-justify-content: center;
@@ -829,7 +829,7 @@ exports[`renders Single Message with full width correctly 1`] = `
829
829
  text-decoration: none;
830
830
  -webkit-transition: all 0.2s;
831
831
  transition: all 0.2s;
832
- min-height: 2.5em;
832
+ height: 2.5rem;
833
833
  width: 100%;
834
834
  -webkit-box-pack: center;
835
835
  -webkit-justify-content: center;
@@ -33,7 +33,7 @@ const Container = exports.Container = _styledComponents.default.div.withConfig({
33
33
  const Subtitle = exports.Subtitle = (0, _styledComponents.default)(_Text.default).withConfig({
34
34
  displayName: "SingleMessageDsstyle__Subtitle",
35
35
  componentId: "sc-s8zd7s-1"
36
- })(["letter-spacing:0.03em;text-transform:uppercase;"]);
36
+ })(["letter-spacing:0.03em;"]);
37
37
  const Image = exports.Image = _styledComponents.default.div.withConfig({
38
38
  displayName: "SingleMessageDsstyle__Image",
39
39
  componentId: "sc-s8zd7s-2"
@@ -84,7 +84,7 @@ exports[`renders correctly 1`] = `
84
84
  text-decoration: none;
85
85
  -webkit-transition: all 0.2s;
86
86
  transition: all 0.2s;
87
- min-height: 2.5em;
87
+ height: 2.5rem;
88
88
  width: 100%;
89
89
  -webkit-box-pack: center;
90
90
  -webkit-justify-content: center;
@@ -149,7 +149,6 @@ exports[`renders correctly 1`] = `
149
149
  -moz-letter-spacing: 0.03em;
150
150
  -ms-letter-spacing: 0.03em;
151
151
  letter-spacing: 0.03em;
152
- text-transform: uppercase;
153
152
  }
154
153
 
155
154
  .c2 {
@@ -63,7 +63,7 @@ it('renders correctly', () => {
63
63
  text-decoration: none;
64
64
  -webkit-transition: all 0.2s;
65
65
  transition: all 0.2s;
66
- min-height: 2.5em;
66
+ height: 2.5rem;
67
67
  width: 100%;
68
68
  -webkit-box-pack: center;
69
69
  -webkit-justify-content: center;
@@ -114,8 +114,7 @@ const Donate = _ref => {
114
114
  color: textColor,
115
115
  size: "big",
116
116
  family: "Anton",
117
- weight: "normal",
118
- uppercase: true
117
+ weight: "normal"
119
118
  }, thisTitle), /*#__PURE__*/_react.default.createElement(_Text.default, {
120
119
  tag: "p",
121
120
  color: textColor,
@@ -18,7 +18,6 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
18
18
  line-height: normal;
19
19
  font-family: 'Anton',Impact,sans-serif;
20
20
  font-weight: normal;
21
- text-transform: uppercase;
22
21
  color: #FFFFFF;
23
22
  }
24
23
 
@@ -821,7 +820,6 @@ exports[`Monthly donation renders correctly 1`] = `
821
820
  line-height: normal;
822
821
  font-family: 'Anton',Impact,sans-serif;
823
822
  font-weight: normal;
824
- text-transform: uppercase;
825
823
  color: #FFFFFF;
826
824
  }
827
825
 
@@ -1626,7 +1624,6 @@ exports[`Single donation renders correctly 1`] = `
1626
1624
  line-height: normal;
1627
1625
  font-family: 'Anton',Impact,sans-serif;
1628
1626
  font-weight: normal;
1629
- text-transform: uppercase;
1630
1627
  color: #FFFFFF;
1631
1628
  }
1632
1629
 
@@ -2520,7 +2517,6 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2520
2517
  line-height: normal;
2521
2518
  font-family: 'Anton',Impact,sans-serif;
2522
2519
  font-weight: normal;
2523
- text-transform: uppercase;
2524
2520
  color: #FFFFFF;
2525
2521
  }
2526
2522
 
@@ -57,8 +57,7 @@ const EmailSignUp = _ref => {
57
57
  tag: "h2",
58
58
  size: "xxl",
59
59
  weight: "400",
60
- family: "Anton",
61
- uppercase: true
60
+ family: "Anton"
62
61
  }, title), !isSubmitted ? /*#__PURE__*/_react.default.createElement(_EmailSignUp.TopCopyWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, topCopy)) : isSubmitSuccessful && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Confetti.default, {
63
62
  trigger: isSubmitSuccessful
64
63
  }), /*#__PURE__*/_react.default.createElement(_EmailSignUp.TopCopyWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, successCopy))), !isSubmitSuccessful && /*#__PURE__*/_react.default.createElement(_EmailSignUp.FormInner, null, /*#__PURE__*/_react.default.createElement(_EmailSignUp.NameWrapper, {
@@ -18,7 +18,6 @@ exports[`renders correctly 1`] = `
18
18
  line-height: normal;
19
19
  font-family: 'Anton',Impact,sans-serif;
20
20
  font-weight: 400;
21
- text-transform: uppercase;
22
21
  }
23
22
 
24
23
  .c1 span {
@@ -53,7 +52,7 @@ exports[`renders correctly 1`] = `
53
52
  text-decoration: none;
54
53
  -webkit-transition: all 0.2s;
55
54
  transition: all 0.2s;
56
- min-height: 2.5rem;
55
+ height: 2.5rem;
57
56
  width: 100%;
58
57
  -webkit-box-pack: center;
59
58
  -webkit-justify-content: center;
@@ -70,7 +70,7 @@ exports[`renders correctly 1`] = `
70
70
  text-decoration: none;
71
71
  -webkit-transition: all 0.2s;
72
72
  transition: all 0.2s;
73
- min-height: 2.5rem;
73
+ height: 2.5rem;
74
74
  width: 100%;
75
75
  -webkit-box-pack: center;
76
76
  -webkit-justify-content: center;
@@ -43,7 +43,6 @@ const ImpactSlider = _ref => {
43
43
  }, /*#__PURE__*/_react.default.createElement(_ImpactSlider.InnerWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
44
44
  tag: "h1",
45
45
  family: "Anton",
46
- uppercase: true,
47
46
  weight: "normal",
48
47
  size: "xl"
49
48
  }, heading), /*#__PURE__*/_react.default.createElement(_ImpactSlider.Copy, null, children), /*#__PURE__*/_react.default.createElement(_ImpactSlider.CurrentAmountCopy, {
@@ -26,7 +26,6 @@ const Moneybuys = _ref => {
26
26
  }), /*#__PURE__*/_react.default.createElement(_ImpactMoneybuys.MoneybuyAmount, {
27
27
  tag: "p",
28
28
  family: "Anton",
29
- uppercase: true,
30
29
  weight: "normal",
31
30
  size: "xl",
32
31
  "data-testid": "moneybuy-amount"
@@ -69,7 +69,6 @@ const WYMDCarousel = _ref => {
69
69
  }, data.headerCopy), /*#__PURE__*/_react.default.createElement(_WYMDCarousel.PeopleHelpedText, {
70
70
  tag: "h1",
71
71
  family: "Anton",
72
- uppercase: true,
73
72
  weight: "normal",
74
73
  color: "red"
75
74
  }, data.peopleHelpedText), /*#__PURE__*/_react.default.createElement(_WYMDCarousel.Including, {
@@ -108,7 +107,6 @@ const WYMDCarousel = _ref => {
108
107
  }, /*#__PURE__*/_react.default.createElement(_WYMDCarousel.AmountWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
109
108
  tag: "h1",
110
109
  family: "Anton",
111
- uppercase: true,
112
110
  weight: "normal",
113
111
  size: "s"
114
112
  }, theseItems[key].amount)), /*#__PURE__*/_react.default.createElement(_WYMDCarousel.CopyWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
@@ -377,7 +377,6 @@ exports[`renders correctly:
377
377
  .c3 {
378
378
  font-family: 'Anton',Impact,sans-serif;
379
379
  font-weight: normal;
380
- text-transform: uppercase;
381
380
  color: #E52630;
382
381
  }
383
382
 
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.49.0",
4
+ "version": "8.49.1",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
@@ -6,7 +6,7 @@ const StyledButton = styled.button`
6
6
  position: relative;
7
7
  text-decoration: none;
8
8
  transition: all 0.2s;
9
- min-height: 2.5rem;
9
+ height: 2.5rem;
10
10
  width: 100%;
11
11
  justify-content: center;
12
12
  align-items: center;
@@ -19,7 +19,7 @@ it('renders a standard styled link correctly', () => {
19
19
  text-decoration: none;
20
20
  -webkit-transition: all 0.2s;
21
21
  transition: all 0.2s;
22
- min-height: 2.5rem;
22
+ height: 2.5rem;
23
23
  width: 100%;
24
24
  -webkit-box-pack: center;
25
25
  -webkit-justify-content: center;
@@ -8,7 +8,7 @@ const buttonStyle = () => css`
8
8
  position: relative;
9
9
  text-decoration: none;
10
10
  transition: all 0.2s;
11
- min-height: 2.5em;
11
+ height: 2.5rem;
12
12
  width: 100%;
13
13
  justify-content: center;
14
14
  align-items: center;
@@ -204,7 +204,7 @@ it('renders link styled as button correctly', () => {
204
204
  text-decoration: none;
205
205
  -webkit-transition: all 0.2s;
206
206
  transition: all 0.2s;
207
- min-height: 2.5em;
207
+ height: 2.5rem;
208
208
  width: 100%;
209
209
  -webkit-box-pack: center;
210
210
  -webkit-justify-content: center;
@@ -179,7 +179,6 @@ const ArticleTeaser = ({
179
179
  tag="h3"
180
180
  height="2rem"
181
181
  weight="normal"
182
- uppercase
183
182
  family={family}
184
183
  >
185
184
  {title}
@@ -60,7 +60,6 @@ it('renders article teaser correctly', () => {
60
60
  font-family: 'Anton',Impact,sans-serif;
61
61
  font-weight: normal;
62
62
  line-height: 2rem;
63
- text-transform: uppercase;
64
63
  }
65
64
 
66
65
  .c10 span {
@@ -362,7 +361,6 @@ it('renders press realese correctly', () => {
362
361
  font-family: 'Anton',Impact,sans-serif;
363
362
  font-weight: normal;
364
363
  line-height: 2rem;
365
- text-transform: uppercase;
366
364
  }
367
365
 
368
366
  .c10 span {
@@ -37,7 +37,7 @@ exports[`renders Column view correctly 1`] = `
37
37
  text-decoration: none;
38
38
  -webkit-transition: all 0.2s;
39
39
  transition: all 0.2s;
40
- min-height: 2.5em;
40
+ height: 2.5rem;
41
41
  width: 100%;
42
42
  -webkit-box-pack: center;
43
43
  -webkit-justify-content: center;
@@ -319,7 +319,7 @@ exports[`renders correctly 1`] = `
319
319
  text-decoration: none;
320
320
  -webkit-transition: all 0.2s;
321
321
  transition: all 0.2s;
322
- min-height: 2.5em;
322
+ height: 2.5rem;
323
323
  width: 100%;
324
324
  -webkit-box-pack: center;
325
325
  -webkit-justify-content: center;
@@ -58,7 +58,7 @@ const Countdown = ({
58
58
  <Text color={color} family="Anton" size="xl">
59
59
  {countdownTime.days}
60
60
  </Text>
61
- <Text color={color} size="xs" uppercase>
61
+ <Text color={color} size="xs">
62
62
  days
63
63
  </Text>
64
64
  </Digits>
@@ -69,7 +69,7 @@ const Countdown = ({
69
69
  <Text color={color} family="Anton" size="xl">
70
70
  {countdownTime.hours}
71
71
  </Text>
72
- <Text color={color} size="xs" uppercase>
72
+ <Text color={color} size="xs">
73
73
  hours
74
74
  </Text>
75
75
  </Digits>
@@ -80,7 +80,7 @@ const Countdown = ({
80
80
  <Text color={color} family="Anton" size="xl">
81
81
  {countdownTime.minutes}
82
82
  </Text>
83
- <Text color={color} size="xs" uppercase>
83
+ <Text color={color} size="xs">
84
84
  minutes
85
85
  </Text>
86
86
  </Digits>
@@ -88,7 +88,7 @@ const Countdown = ({
88
88
  <Text color={color} family="Anton" size="xl">
89
89
  {countdownTime.seconds}
90
90
  </Text>
91
- <Text color={color} size="xs" uppercase>
91
+ <Text color={color} size="xs">
92
92
  seconds
93
93
  </Text>
94
94
  </Digits>
@@ -124,7 +124,6 @@ const TagWrapper = styled.div`
124
124
 
125
125
  const Tag = styled(Text)`
126
126
  position: relative;
127
- text-transform: uppercase;
128
127
  `;
129
128
 
130
129
  const Description = styled.div`
@@ -172,7 +171,6 @@ const Descriptor = ({
172
171
  tag="h3"
173
172
  height="2rem"
174
173
  weight="normal"
175
- uppercase
176
174
  family="Anton"
177
175
  >
178
176
  {title}
@@ -67,7 +67,6 @@ it('renders article teaser correctly', () => {
67
67
  font-family: 'Anton',Impact,sans-serif;
68
68
  font-weight: normal;
69
69
  line-height: 2rem;
70
- text-transform: uppercase;
71
70
  }
72
71
 
73
72
  .c7 span {
@@ -189,7 +188,6 @@ it('renders article teaser correctly', () => {
189
188
 
190
189
  .c11 {
191
190
  position: relative;
192
- text-transform: uppercase;
193
191
  }
194
192
 
195
193
  .c12 {
@@ -42,7 +42,7 @@ const InfoBanner = ({
42
42
  }) => (
43
43
  <Container>
44
44
  <Info>
45
- <Text tag="h3" size="md" uppercase>
45
+ <Text tag="h3" size="md">
46
46
  Project Name
47
47
  </Text>
48
48
  <Text tag="p" size="s">
@@ -50,7 +50,7 @@ const InfoBanner = ({
50
50
  </Text>
51
51
  </Info>
52
52
  <Info>
53
- <Text tag="h3" size="md" uppercase>
53
+ <Text tag="h3" size="md">
54
54
  End Date
55
55
  </Text>
56
56
  <Text tag="p" size="s">
@@ -58,7 +58,7 @@ const InfoBanner = ({
58
58
  </Text>
59
59
  </Info>
60
60
  <Info>
61
- <Text tag="h3" size="md" uppercase>
61
+ <Text tag="h3" size="md">
62
62
  Funding theme
63
63
  </Text>
64
64
  <Text tag="p" size="s">
@@ -68,7 +68,7 @@ const InfoBanner = ({
68
68
  </Text>
69
69
  </Info>
70
70
  <Info>
71
- <Text tag="h3" size="md" uppercase>
71
+ <Text tag="h3" size="md">
72
72
  Amount Awarded
73
73
  </Text>
74
74
  <Text tag="p" size="s">
@@ -82,7 +82,7 @@ const InfoBanner = ({
82
82
  </Text>
83
83
  </Info>
84
84
  <Info>
85
- <Text tag="h3" size="md" uppercase>
85
+ <Text tag="h3" size="md">
86
86
  Start Date
87
87
  </Text>
88
88
  <Text tag="p" size="s">
@@ -90,7 +90,7 @@ const InfoBanner = ({
90
90
  </Text>
91
91
  </Info>
92
92
  <Info>
93
- <Text tag="h3" size="md" uppercase>
93
+ <Text tag="h3" size="md">
94
94
  Beneficiary Country
95
95
  </Text>
96
96
  <Text tag="p" size="s">
@@ -16,7 +16,6 @@ exports[`renders correctly 1`] = `
16
16
  .c2 {
17
17
  font-size: undefined;
18
18
  line-height: normal;
19
- text-transform: uppercase;
20
19
  }
21
20
 
22
21
  .c2 span {
@@ -76,7 +76,7 @@ exports[`renders Promo correctly 1`] = `
76
76
  text-decoration: none;
77
77
  -webkit-transition: all 0.2s;
78
78
  transition: all 0.2s;
79
- min-height: 2.5em;
79
+ height: 2.5rem;
80
80
  width: 100%;
81
81
  -webkit-box-pack: center;
82
82
  -webkit-justify-content: center;
@@ -426,7 +426,7 @@ exports[`renders Promo correctly end position 1`] = `
426
426
  text-decoration: none;
427
427
  -webkit-transition: all 0.2s;
428
428
  transition: all 0.2s;
429
- min-height: 2.5em;
429
+ height: 2.5rem;
430
430
  width: 100%;
431
431
  -webkit-box-pack: center;
432
432
  -webkit-justify-content: center;
@@ -84,10 +84,10 @@ const SearchResult = ({
84
84
  />
85
85
  </ImageWrapper>
86
86
  <CopyWrapper>
87
- <Text size="xs" uppercase>
87
+ <Text size="xs">
88
88
  {`${type ? ` ${type} |` : ''} ${date}`}
89
89
  </Text>
90
- <Title size="xl" tag="h3" uppercase>
90
+ <Title size="xl" tag="h3">
91
91
  {title}
92
92
  </Title>
93
93
  {copy && (
@@ -16,7 +16,6 @@ exports[`renders correctly in minimalist form 1`] = `
16
16
  .c7 {
17
17
  font-size: 0.75rem;
18
18
  line-height: normal;
19
- text-transform: uppercase;
20
19
  }
21
20
 
22
21
  .c7 span {
@@ -39,7 +38,6 @@ exports[`renders correctly in minimalist form 1`] = `
39
38
  .c8 {
40
39
  font-size: 2rem;
41
40
  line-height: normal;
42
- text-transform: uppercase;
43
41
  }
44
42
 
45
43
  .c8 span {
@@ -236,7 +234,6 @@ exports[`renders correctly with copy 1`] = `
236
234
  .c7 {
237
235
  font-size: 0.75rem;
238
236
  line-height: normal;
239
- text-transform: uppercase;
240
237
  }
241
238
 
242
239
  .c7 span {
@@ -259,7 +256,6 @@ exports[`renders correctly with copy 1`] = `
259
256
  .c8 {
260
257
  font-size: 2rem;
261
258
  line-height: normal;
262
- text-transform: uppercase;
263
259
  }
264
260
 
265
261
  .c8 span {
@@ -496,7 +492,6 @@ exports[`renders correctly with date 1`] = `
496
492
  .c7 {
497
493
  font-size: 0.75rem;
498
494
  line-height: normal;
499
- text-transform: uppercase;
500
495
  }
501
496
 
502
497
  .c7 span {
@@ -519,7 +514,6 @@ exports[`renders correctly with date 1`] = `
519
514
  .c8 {
520
515
  font-size: 2rem;
521
516
  line-height: normal;
522
- text-transform: uppercase;
523
517
  }
524
518
 
525
519
  .c8 span {
@@ -716,7 +710,6 @@ exports[`renders correctly with date and type 1`] = `
716
710
  .c7 {
717
711
  font-size: 0.75rem;
718
712
  line-height: normal;
719
- text-transform: uppercase;
720
713
  }
721
714
 
722
715
  .c7 span {
@@ -739,7 +732,6 @@ exports[`renders correctly with date and type 1`] = `
739
732
  .c8 {
740
733
  font-size: 2rem;
741
734
  line-height: normal;
742
- text-transform: uppercase;
743
735
  }
744
736
 
745
737
  .c8 span {
@@ -268,7 +268,7 @@ exports[`renders Single Message with Image correctly 1`] = `
268
268
  text-decoration: none;
269
269
  -webkit-transition: all 0.2s;
270
270
  transition: all 0.2s;
271
- min-height: 2.5em;
271
+ height: 2.5rem;
272
272
  width: 100%;
273
273
  -webkit-box-pack: center;
274
274
  -webkit-justify-content: center;
@@ -829,7 +829,7 @@ exports[`renders Single Message with full width correctly 1`] = `
829
829
  text-decoration: none;
830
830
  -webkit-transition: all 0.2s;
831
831
  transition: all 0.2s;
832
- min-height: 2.5em;
832
+ height: 2.5rem;
833
833
  width: 100%;
834
834
  -webkit-box-pack: center;
835
835
  -webkit-justify-content: center;
@@ -19,7 +19,6 @@ const Container = styled.div`
19
19
 
20
20
  const Subtitle = styled(Text)`
21
21
  letter-spacing: 0.03em;
22
- text-transform: uppercase;
23
22
  `;
24
23
 
25
24
  const Image = styled.div`
@@ -84,7 +84,7 @@ exports[`renders correctly 1`] = `
84
84
  text-decoration: none;
85
85
  -webkit-transition: all 0.2s;
86
86
  transition: all 0.2s;
87
- min-height: 2.5em;
87
+ height: 2.5rem;
88
88
  width: 100%;
89
89
  -webkit-box-pack: center;
90
90
  -webkit-justify-content: center;
@@ -149,7 +149,6 @@ exports[`renders correctly 1`] = `
149
149
  -moz-letter-spacing: 0.03em;
150
150
  -ms-letter-spacing: 0.03em;
151
151
  letter-spacing: 0.03em;
152
- text-transform: uppercase;
153
152
  }
154
153
 
155
154
  .c2 {
@@ -64,7 +64,7 @@ it('renders correctly', () => {
64
64
  text-decoration: none;
65
65
  -webkit-transition: all 0.2s;
66
66
  transition: all 0.2s;
67
- min-height: 2.5em;
67
+ height: 2.5rem;
68
68
  width: 100%;
69
69
  -webkit-box-pack: center;
70
70
  -webkit-justify-content: center;
@@ -129,7 +129,7 @@ const Donate = ({
129
129
  size="big"
130
130
  family="Anton"
131
131
  weight="normal"
132
- uppercase
132
+
133
133
  >
134
134
  {thisTitle}
135
135
  </Text>
@@ -18,7 +18,6 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
18
18
  line-height: normal;
19
19
  font-family: 'Anton',Impact,sans-serif;
20
20
  font-weight: normal;
21
- text-transform: uppercase;
22
21
  color: #FFFFFF;
23
22
  }
24
23
 
@@ -821,7 +820,6 @@ exports[`Monthly donation renders correctly 1`] = `
821
820
  line-height: normal;
822
821
  font-family: 'Anton',Impact,sans-serif;
823
822
  font-weight: normal;
824
- text-transform: uppercase;
825
823
  color: #FFFFFF;
826
824
  }
827
825
 
@@ -1626,7 +1624,6 @@ exports[`Single donation renders correctly 1`] = `
1626
1624
  line-height: normal;
1627
1625
  font-family: 'Anton',Impact,sans-serif;
1628
1626
  font-weight: normal;
1629
- text-transform: uppercase;
1630
1627
  color: #FFFFFF;
1631
1628
  }
1632
1629
 
@@ -2520,7 +2517,6 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2520
2517
  line-height: normal;
2521
2518
  font-family: 'Anton',Impact,sans-serif;
2522
2519
  font-weight: normal;
2523
- text-transform: uppercase;
2524
2520
  color: #FFFFFF;
2525
2521
  }
2526
2522
 
@@ -50,7 +50,7 @@ const EmailSignUp = ({
50
50
  containerPadding={containerPadding}
51
51
  {...rest}
52
52
  >
53
- <Title tag="h2" size="xxl" weight="400" family="Anton" uppercase>
53
+ <Title tag="h2" size="xxl" weight="400" family="Anton">
54
54
  {title}
55
55
  </Title>
56
56
  {!isSubmitted ? (
@@ -18,7 +18,6 @@ exports[`renders correctly 1`] = `
18
18
  line-height: normal;
19
19
  font-family: 'Anton',Impact,sans-serif;
20
20
  font-weight: 400;
21
- text-transform: uppercase;
22
21
  }
23
22
 
24
23
  .c1 span {
@@ -53,7 +52,7 @@ exports[`renders correctly 1`] = `
53
52
  text-decoration: none;
54
53
  -webkit-transition: all 0.2s;
55
54
  transition: all 0.2s;
56
- min-height: 2.5rem;
55
+ height: 2.5rem;
57
56
  width: 100%;
58
57
  -webkit-box-pack: center;
59
58
  -webkit-justify-content: center;
@@ -70,7 +70,7 @@ exports[`renders correctly 1`] = `
70
70
  text-decoration: none;
71
71
  -webkit-transition: all 0.2s;
72
72
  transition: all 0.2s;
73
- min-height: 2.5rem;
73
+ height: 2.5rem;
74
74
  width: 100%;
75
75
  -webkit-box-pack: center;
76
76
  -webkit-justify-content: center;
@@ -30,7 +30,7 @@ const ImpactSlider = ({
30
30
  return (
31
31
  <OuterWrapper backgroundColour={backgroundColour} id={rowID}>
32
32
  <InnerWrapper>
33
- <Text tag="h1" family="Anton" uppercase weight="normal" size="xl">{heading}</Text>
33
+ <Text tag="h1" family="Anton" weight="normal" size="xl">{heading}</Text>
34
34
  <Copy>
35
35
  {children}
36
36
  </Copy>
@@ -15,7 +15,7 @@ const Moneybuys = ({ items, currentAmount, opacityAnimation }) => (
15
15
  <Fragment key={item.poundsPerItem}>
16
16
  <Moneybuy isInactive={isInactive} data-testid={`impact-slider--moneybuy-${index + 1}`}>
17
17
  <MoneybuyImage imageURL={item.imageURL} />
18
- <MoneybuyAmount tag="p" family="Anton" uppercase weight="normal" size="xl" data-testid="moneybuy-amount">{thisAmount}</MoneybuyAmount>
18
+ <MoneybuyAmount tag="p" family="Anton" weight="normal" size="xl" data-testid="moneybuy-amount">{thisAmount}</MoneybuyAmount>
19
19
  <MoneybuyDescription tag="p" size="s" data-testid="moneybuy-description">{item.description}</MoneybuyDescription>
20
20
  </Moneybuy>
21
21
  { index < (items.length - 1) && (
@@ -67,7 +67,7 @@ const WYMDCarousel = ({ data, data: { autoPlay, contentful_id: thisID } }) => {
67
67
  { data.headerCopy}
68
68
  </Heading>
69
69
 
70
- <PeopleHelpedText tag="h1" family="Anton" uppercase weight="normal" color="red">
70
+ <PeopleHelpedText tag="h1" family="Anton" weight="normal" color="red">
71
71
  { data.peopleHelpedText}
72
72
  </PeopleHelpedText>
73
73
 
@@ -111,7 +111,7 @@ const WYMDCarousel = ({ data, data: { autoPlay, contentful_id: thisID } }) => {
111
111
 
112
112
  <div className="all-text-wrapper">
113
113
  <AmountWrapper>
114
- <Text tag="h1" family="Anton" uppercase weight="normal" size="s">
114
+ <Text tag="h1" family="Anton" weight="normal" size="s">
115
115
  {theseItems[key].amount}
116
116
  </Text>
117
117
  </AmountWrapper>
@@ -377,7 +377,6 @@ exports[`renders correctly:
377
377
  .c3 {
378
378
  font-family: 'Anton',Impact,sans-serif;
379
379
  font-weight: normal;
380
- text-transform: uppercase;
381
380
  color: #E52630;
382
381
  }
383
382