@comicrelief/component-library 8.34.3 → 8.34.5

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.
@@ -18,13 +18,18 @@ import Text from '../../Atoms/Text/Text';
18
18
  import Text from '../../Atoms/Text/Text';
19
19
 
20
20
  <Accordion
21
- contentBottomPadding="15px"
21
+ contentBottomPadding="100px"
22
22
  title={
23
23
  <Text family="Anton" size="l" uppercase>
24
24
  I am the title
25
25
  </Text>
26
26
  }
27
27
  >
28
- <Text tag="p">Customised bottom padding here!</Text>
28
+
29
+ <Text tag="p">Customised bottom padding here!</Text>
30
+
31
+ <Text tag="p">
32
+ <a href="https://www.google.com">A plain anchor link, made to resemble a Link component</a>.
33
+ </Text>
29
34
  </Accordion>
30
35
  ```
@@ -127,7 +127,7 @@ const Error = exports.Error = (0, _styledComponents.default)(_Text.default).with
127
127
  const Form = exports.Form = _styledComponents.default.form.withConfig({
128
128
  displayName: "Donatestyle__Form",
129
129
  componentId: "sc-8rjm3t-8"
130
- })(["position:relative;width:100%;background-color:", ";box-shadow:0px 0px 16px rgba(0,0,0,0.15);border-radius:10px;margin-top:", ";h3{margin-top:", ";}input{max-width:100%;margin:0;}input[type='submit']{margin:", " 0;}@media ", "{width:450px;margin-right:auto;margin-left:auto;}"], _ref16 => {
130
+ })(["position:relative;width:100%;background-color:", ";box-shadow:0px 0px 16px rgba(0,0,0,0.15);border-radius:0.5rem;margin-top:", ";h3{margin-top:", ";}input{max-width:100%;margin:0;}input[type='submit']{margin:", " 0;}@media ", "{width:450px;margin-right:auto;margin-left:auto;}"], _ref16 => {
131
131
  let {
132
132
  theme
133
133
  } = _ref16;
@@ -176,7 +176,7 @@ const Label = exports.Label = (0, _styledComponents.default)(_Text.default).with
176
176
  const AmountField = exports.AmountField = (0, _styledComponents.default)(_Input.default).withConfig({
177
177
  displayName: "Donatestyle__AmountField",
178
178
  componentId: "sc-8rjm3t-14"
179
- })(["position:relative;flex-basis:50%;flex-shrink:0;flex-grow:0;font-weight:400;display:block;@media ", "{flex-basis:60%;}span{position:absolute;font-size:20px;top:50%;transform:translateY(-50%);left:0px;font-weight:500;padding:0px 15px;", ";}input{height:48px;border:2px solid ", ";background:", ";border-radius:10px;padding:", " ", " ", " ", ";&:focus{outline:none;border:2px solid ", ";}}"], _ref21 => {
179
+ })(["position:relative;flex-basis:50%;flex-shrink:0;flex-grow:0;font-weight:400;display:block;@media ", "{flex-basis:60%;}span{position:absolute;font-size:20px;top:50%;transform:translateY(-50%);left:0px;font-weight:500;padding:0px 15px;", ";}input{height:48px;border:2px solid ", ";background:", ";border-radius:0.5rem;padding:", " ", " ", " ", ";&:focus{outline:none;border:2px solid ", ";}}"], _ref21 => {
180
180
  let {
181
181
  theme
182
182
  } = _ref21;
@@ -16,7 +16,7 @@ const fadeOpen = (0, _styledComponents.keyframes)(["0%{opacity:0;max-height:0px;
16
16
  const StyledPopUp = _styledComponents.default.div.withConfig({
17
17
  displayName: "PopUpComponent__StyledPopUp",
18
18
  componentId: "sc-1d7imlo-0"
19
- })(["display:grid;overflow:hidden;max-height:350px;opacity:1;animation:0.4s ", " ease;", " background-color:", ";box-shadow:0px 0px 16px rgba(0,0,0,0.15);border-radius:10px;@media ", "{width:450px;margin-right:auto;margin-left:auto;}"], props => props.fadeOpen, props => props.isClosed && (0, _styledComponents.css)(["animation:", "s ", " ease forwards;"], closeDuration, props.fadeClose), _ref => {
19
+ })(["display:grid;overflow:hidden;max-height:350px;opacity:1;animation:0.4s ", " ease;", " background-color:", ";box-shadow:0px 0px 16px rgba(0,0,0,0.15);border-radius:0.5rem;@media ", "{width:450px;margin-right:auto;margin-left:auto;}"], props => props.fadeOpen, props => props.isClosed && (0, _styledComponents.css)(["animation:", "s ", " ease forwards;"], closeDuration, props.fadeClose), _ref => {
20
20
  let {
21
21
  theme
22
22
  } = _ref;
@@ -13,7 +13,7 @@ var _spacing = _interopRequireDefault(require("../../../../theme/shared/spacing"
13
13
  const MoneyBuyButton = (0, _styledComponents.default)(_Input.default).withConfig({
14
14
  displayName: "MoneyBuy__MoneyBuyButton",
15
15
  componentId: "sc-38g5hn-0"
16
- })(["display:block;input{border:none;background-color:", ";color:", ";font-size:", ";font-family:", ";font-weight:normal;border-radius:10px;padding:", ";box-shadow:0px 0px 16px rgba(0,0,0,0.15);height:auto;@media ", "{font-size:", ";padding:", ";}&:focus{border:none;outline:none;box-shadow:inset 0 0 0 4px ", ";}&:active:focus{box-shadow:0px 0px 16px rgba(0,0,0,0.3);}", "}"], _ref => {
16
+ })(["display:block;input{border:none;background-color:", ";color:", ";font-size:", ";font-family:", ";font-weight:normal;border-radius:0.5rem;padding:", ";box-shadow:0px 0px 16px rgba(0,0,0,0.15);height:auto;@media ", "{font-size:", ";padding:", ";}&:focus{border:none;outline:none;box-shadow:inset 0 0 0 4px ", ";}&:active:focus{box-shadow:0px 0px 16px rgba(0,0,0,0.3);}", "}"], _ref => {
17
17
  let {
18
18
  theme
19
19
  } = _ref;
@@ -164,7 +164,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
164
164
  width: 100%;
165
165
  background-color: #FFFFFF;
166
166
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
167
- border-radius: 10px;
167
+ border-radius: 0.5rem;
168
168
  margin-top: 1rem;
169
169
  }
170
170
 
@@ -246,7 +246,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
246
246
  height: 48px;
247
247
  border: 2px solid #969598;
248
248
  background: #F4F3F5;
249
- border-radius: 10px;
249
+ border-radius: 0.5rem;
250
250
  padding: 0.5rem 1rem 0.5rem 2rem;
251
251
  }
252
252
 
@@ -863,7 +863,7 @@ exports[`Monthly donation renders correctly 1`] = `
863
863
  width: 100%;
864
864
  background-color: #FFFFFF;
865
865
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
866
- border-radius: 10px;
866
+ border-radius: 0.5rem;
867
867
  margin-top: 1rem;
868
868
  }
869
869
 
@@ -949,7 +949,7 @@ exports[`Monthly donation renders correctly 1`] = `
949
949
  height: 48px;
950
950
  border: 2px solid #969598;
951
951
  background: #F4F3F5;
952
- border-radius: 10px;
952
+ border-radius: 0.5rem;
953
953
  padding: 0.5rem 1rem 0.5rem 2rem;
954
954
  }
955
955
 
@@ -1481,7 +1481,7 @@ exports[`Single donation renders correctly 1`] = `
1481
1481
  font-size: 1.5rem;
1482
1482
  font-family: 'Anton',Impact,sans-serif;
1483
1483
  font-weight: normal;
1484
- border-radius: 10px;
1484
+ border-radius: 0.5rem;
1485
1485
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
1486
1486
  height: auto;
1487
1487
  }
@@ -1507,7 +1507,7 @@ exports[`Single donation renders correctly 1`] = `
1507
1507
  font-size: 1.5rem;
1508
1508
  font-family: 'Anton',Impact,sans-serif;
1509
1509
  font-weight: normal;
1510
- border-radius: 10px;
1510
+ border-radius: 0.5rem;
1511
1511
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
1512
1512
  height: auto;
1513
1513
  background-color: #2042AD;
@@ -1588,7 +1588,7 @@ exports[`Single donation renders correctly 1`] = `
1588
1588
  width: 100%;
1589
1589
  background-color: #FFFFFF;
1590
1590
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
1591
- border-radius: 10px;
1591
+ border-radius: 0.5rem;
1592
1592
  margin-top: 1rem;
1593
1593
  }
1594
1594
 
@@ -1701,7 +1701,7 @@ exports[`Single donation renders correctly 1`] = `
1701
1701
  height: 48px;
1702
1702
  border: 2px solid #969598;
1703
1703
  background: #F4F3F5;
1704
- border-radius: 10px;
1704
+ border-radius: 0.5rem;
1705
1705
  padding: 0.5rem 1rem 0.5rem 2rem;
1706
1706
  }
1707
1707
 
@@ -2281,7 +2281,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2281
2281
  width: 100%;
2282
2282
  background-color: #FFFFFF;
2283
2283
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
2284
- border-radius: 10px;
2284
+ border-radius: 0.5rem;
2285
2285
  margin-top: 1rem;
2286
2286
  }
2287
2287
 
@@ -2363,7 +2363,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2363
2363
  height: 48px;
2364
2364
  border: 2px solid #969598;
2365
2365
  background: #F4F3F5;
2366
- border-radius: 10px;
2366
+ border-radius: 0.5rem;
2367
2367
  padding: 0.5rem 1rem 0.5rem 2rem;
2368
2368
  }
2369
2369
 
@@ -20,7 +20,7 @@ const MoneybuyWrapper = exports.MoneybuyWrapper = _styledComponents.default.div.
20
20
  const Moneybuy = exports.Moneybuy = _styledComponents.default.div.withConfig({
21
21
  displayName: "ImpactMoneybuysstyle__Moneybuy",
22
22
  componentId: "sc-1lsmpzi-1"
23
- })(["display:inherit;width:100%;padding:8px 20px;height:auto;background-color:white;border-radius:10px;border:1px solid ", ";position:relative;flex-direction:row;align-items:center;justify-content:flex-start;opacity:1;", " @media ", "{width:70%;padding:8px 40px;}@media ", "{padding:20px 14px;flex-direction:column;width:18%;max-height:none;}"], props => props.theme.color('black'), props => props.isInactive && (0, _styledComponents.css)(["opacity:0.5;"]), _ref2 => {
23
+ })(["display:inherit;width:100%;padding:8px 20px;height:auto;background-color:white;border-radius:0.5rem;border:1px solid ", ";position:relative;flex-direction:row;align-items:center;justify-content:flex-start;opacity:1;", " @media ", "{width:70%;padding:8px 40px;}@media ", "{padding:20px 14px;flex-direction:column;width:18%;max-height:none;}"], props => props.theme.color('black'), props => props.isInactive && (0, _styledComponents.css)(["opacity:0.5;"]), _ref2 => {
24
24
  let {
25
25
  theme
26
26
  } = _ref2;
@@ -13,7 +13,7 @@ const sizeMultiplier = 1.4;
13
13
  const StyledRangerSlider = exports.StyledRangerSlider = (0, _styledComponents.default)(_reactRangeSliderInput.default).withConfig({
14
14
  displayName: "Sliderstyle__StyledRangerSlider",
15
15
  componentId: "sc-pyds3x-0"
16
- })(["background:white;height:16px;border-radius:16px;border:1px solid ", ";.range-slider__range{height:14px;border-radius:10px;background-color:", ";z-index:2;}.range-slider__thumb[data-upper]{&:after{background-color:white;width:", "px;height:", "px;content:\"\";position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;border-radius:50%;border:", "px solid ", ";transition-property:width,height,border-width;transition-duration:0.15s;}&:hover{&:after{width:", "px;height:", "px;border-width:", "px;}}}.range-slider__thumb[data-lower]{width:0;}"], props => props.theme.color('black'), props => props.theme.color('red'), thumbSize, thumbSize, outlineSize, props => props.theme.color('red'), thumbSize * sizeMultiplier, thumbSize * sizeMultiplier, outlineSize);
16
+ })(["background:white;height:16px;border-radius:1rem;border:1px solid ", ";.range-slider__range{height:14px;border-radius:0.5rem;background-color:", ";z-index:2;}.range-slider__thumb[data-upper]{&:after{background-color:white;width:", "px;height:", "px;content:\"\";position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;border-radius:50%;border:", "px solid ", ";transition-property:width,height,border-width;transition-duration:0.15s;}&:hover{&:after{width:", "px;height:", "px;border-width:", "px;}}}.range-slider__thumb[data-lower]{width:0;}"], props => props.theme.color('black'), props => props.theme.color('red'), thumbSize, thumbSize, outlineSize, props => props.theme.color('red'), thumbSize * sizeMultiplier, thumbSize * sizeMultiplier, outlineSize);
17
17
  const SliderWrapper = exports.SliderWrapper = _styledComponents.default.div.withConfig({
18
18
  displayName: "Sliderstyle__SliderWrapper",
19
19
  componentId: "sc-pyds3x-1"
@@ -51,7 +51,7 @@ const FormField = exports.FormField = _styledComponents.default.div.withConfig({
51
51
  theme,
52
52
  isError
53
53
  } = _ref2;
54
- return (0, _styledComponents.css)(["position:relative;margin-bottom:", ";width:100%;display:flex;flex-direction:column;padding:", ";background-color:", ";transition:background-color 0.3s,color 0.3s;border-radius:10px;border:1px solid ", ";&.selected{background-color:", ";&:hover{background-color:", ";border-color:", ";}span.icon-mp_permissionEmail{background-image:url(", ");}span.icon-mp_permissionPhone{background-image:url(", ");}span.icon-mp_permissionPost{background-image:url(", ");}span.icon-mp_permissionSMS{background-image:url(", ");}> div{label,> span{color:", ";}}}label{position:relative;margin-bottom:0;width:100%;color:", ";font-weight:600;display:flex;justify-content:space-between;}h3{position:relative;margin-bottom:", ";&:before{position:absolute;top:0;left:0;width:24px;height:24px;content:'';}}"], (0, _spacing.default)('md'), (0, _spacing.default)('m'), theme.color('grey_light'), theme.color('grey'), isError ? theme.color('red') : theme.color('blue_donate'), isError ? theme.color('red_dark') : theme.color('blue_donate'), theme.color('grey_4'), _EmailWhite.default, _PhoneWhite.default, _PostWhite.default, _TextWhite.default, theme.color('white'), theme.color('black'), (0, _spacing.default)('md'));
54
+ return (0, _styledComponents.css)(["position:relative;margin-bottom:", ";width:100%;display:flex;flex-direction:column;padding:", ";background-color:", ";transition:background-color 0.3s,color 0.3s;border-radius:0.5rem;border:1px solid ", ";&.selected{background-color:", ";&:hover{background-color:", ";border-color:", ";}span.icon-mp_permissionEmail{background-image:url(", ");}span.icon-mp_permissionPhone{background-image:url(", ");}span.icon-mp_permissionPost{background-image:url(", ");}span.icon-mp_permissionSMS{background-image:url(", ");}> div{label,> span{color:", ";}}}label{position:relative;margin-bottom:0;width:100%;color:", ";font-weight:600;display:flex;justify-content:space-between;}h3{position:relative;margin-bottom:", ";&:before{position:absolute;top:0;left:0;width:24px;height:24px;content:'';}}"], (0, _spacing.default)('md'), (0, _spacing.default)('m'), theme.color('grey_light'), theme.color('grey'), isError ? theme.color('red') : theme.color('blue_donate'), isError ? theme.color('red_dark') : theme.color('blue_donate'), theme.color('grey_4'), _EmailWhite.default, _PhoneWhite.default, _PostWhite.default, _TextWhite.default, theme.color('white'), theme.color('black'), (0, _spacing.default)('md'));
55
55
  });
56
56
  const CheckContainer = exports.CheckContainer = _styledComponents.default.div.withConfig({
57
57
  displayName: "MarketingPreferencesDSstyle__CheckContainer",
@@ -74,7 +74,7 @@ const CheckLabel = exports.CheckLabel = _styledComponents.default.label.withConf
74
74
  const CheckInput = exports.CheckInput = _styledComponents.default.input.withConfig({
75
75
  displayName: "MarketingPreferencesDSstyle__CheckInput",
76
76
  componentId: "sc-68n85q-8"
77
- })(["font-size:", ";display:block;box-sizing:border-box;opacity:0;position:absolute;width:100%;height:100%;left:0;top:0;margin:0;border:1px solid ", ";+ span{width:30px;height:30px;background-color:", ";border:1px solid ", ";float:left;border-radius:8px;}:checked + span{background:url(", ") no-repeat center ", ";background-size:contain;}"], _ref5 => {
77
+ })(["font-size:", ";display:block;box-sizing:border-box;opacity:0;position:absolute;width:100%;height:100%;left:0;top:0;margin:0;border:1px solid ", ";+ span{width:30px;height:30px;background-color:", ";border:1px solid ", ";float:left;border-radius:0.5rem;}:checked + span{background:url(", ") no-repeat center ", ";background-size:contain;}"], _ref5 => {
78
78
  let {
79
79
  theme
80
80
  } = _ref5;
@@ -23,7 +23,7 @@ const Item = styled.div`
23
23
  div {
24
24
  width: 160px;
25
25
  height: 160px;
26
- border-radius: 10px;
26
+ border-radius: 0.5rem;
27
27
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
28
28
  justify-content: flex-end;
29
29
  }
@@ -141,3 +141,11 @@ table td {
141
141
  opacity: 0;
142
142
  filter: blur(5px);
143
143
  }
144
+
145
+ a {
146
+ color: inherit;
147
+ }
148
+
149
+ a:hover, a:focus {
150
+ text-decoration: none;
151
+ }
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.34.3",
4
+ "version": "8.34.5",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
@@ -18,13 +18,18 @@ import Text from '../../Atoms/Text/Text';
18
18
  import Text from '../../Atoms/Text/Text';
19
19
 
20
20
  <Accordion
21
- contentBottomPadding="15px"
21
+ contentBottomPadding="100px"
22
22
  title={
23
23
  <Text family="Anton" size="l" uppercase>
24
24
  I am the title
25
25
  </Text>
26
26
  }
27
27
  >
28
- <Text tag="p">Customised bottom padding here!</Text>
28
+
29
+ <Text tag="p">Customised bottom padding here!</Text>
30
+
31
+ <Text tag="p">
32
+ <a href="https://www.google.com">A plain anchor link, made to resemble a Link component</a>.
33
+ </Text>
29
34
  </Accordion>
30
35
  ```
@@ -102,7 +102,7 @@ const Form = styled.form`
102
102
  width: 100%;
103
103
  background-color: ${({ theme }) => theme.color('white')};
104
104
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.15);
105
- border-radius: 10px;
105
+ border-radius: 0.5rem;
106
106
  margin-top: ${spacing('md')};
107
107
 
108
108
  h3 {
@@ -202,7 +202,7 @@ const AmountField = styled(Input)`
202
202
  height: 48px;
203
203
  border: 2px solid ${({ theme }) => theme.color('grey')};
204
204
  background: ${({ theme }) => theme.color('grey_light')};
205
- border-radius: 10px;
205
+ border-radius: 0.5rem;
206
206
  padding: ${spacing('sm')} ${spacing('md')} ${spacing('sm')} ${spacing('l')};
207
207
  &:focus {
208
208
  outline: none;
@@ -43,7 +43,7 @@ const StyledPopUp = styled.div`
43
43
  `}
44
44
  background-color: ${({ theme }) => theme.color('blue_light')};
45
45
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.15);
46
- border-radius: 10px;
46
+ border-radius: 0.5rem;
47
47
 
48
48
  @media ${({ theme }) => theme.allBreakpoints('M')} {
49
49
  width: 450px;
@@ -14,7 +14,7 @@ const MoneyBuyButton = styled(Input)`
14
14
  font-size: ${({ theme }) => theme.fontSize('l')};
15
15
  font-family: ${({ theme }) => theme.fontFamilies('Anton')};
16
16
  font-weight: normal;
17
- border-radius: 10px;
17
+ border-radius: 0.5rem;
18
18
  padding: ${spacing('s')};
19
19
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.15);
20
20
  height: auto;
@@ -164,7 +164,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
164
164
  width: 100%;
165
165
  background-color: #FFFFFF;
166
166
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
167
- border-radius: 10px;
167
+ border-radius: 0.5rem;
168
168
  margin-top: 1rem;
169
169
  }
170
170
 
@@ -246,7 +246,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
246
246
  height: 48px;
247
247
  border: 2px solid #969598;
248
248
  background: #F4F3F5;
249
- border-radius: 10px;
249
+ border-radius: 0.5rem;
250
250
  padding: 0.5rem 1rem 0.5rem 2rem;
251
251
  }
252
252
 
@@ -863,7 +863,7 @@ exports[`Monthly donation renders correctly 1`] = `
863
863
  width: 100%;
864
864
  background-color: #FFFFFF;
865
865
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
866
- border-radius: 10px;
866
+ border-radius: 0.5rem;
867
867
  margin-top: 1rem;
868
868
  }
869
869
 
@@ -949,7 +949,7 @@ exports[`Monthly donation renders correctly 1`] = `
949
949
  height: 48px;
950
950
  border: 2px solid #969598;
951
951
  background: #F4F3F5;
952
- border-radius: 10px;
952
+ border-radius: 0.5rem;
953
953
  padding: 0.5rem 1rem 0.5rem 2rem;
954
954
  }
955
955
 
@@ -1481,7 +1481,7 @@ exports[`Single donation renders correctly 1`] = `
1481
1481
  font-size: 1.5rem;
1482
1482
  font-family: 'Anton',Impact,sans-serif;
1483
1483
  font-weight: normal;
1484
- border-radius: 10px;
1484
+ border-radius: 0.5rem;
1485
1485
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
1486
1486
  height: auto;
1487
1487
  }
@@ -1507,7 +1507,7 @@ exports[`Single donation renders correctly 1`] = `
1507
1507
  font-size: 1.5rem;
1508
1508
  font-family: 'Anton',Impact,sans-serif;
1509
1509
  font-weight: normal;
1510
- border-radius: 10px;
1510
+ border-radius: 0.5rem;
1511
1511
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
1512
1512
  height: auto;
1513
1513
  background-color: #2042AD;
@@ -1588,7 +1588,7 @@ exports[`Single donation renders correctly 1`] = `
1588
1588
  width: 100%;
1589
1589
  background-color: #FFFFFF;
1590
1590
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
1591
- border-radius: 10px;
1591
+ border-radius: 0.5rem;
1592
1592
  margin-top: 1rem;
1593
1593
  }
1594
1594
 
@@ -1701,7 +1701,7 @@ exports[`Single donation renders correctly 1`] = `
1701
1701
  height: 48px;
1702
1702
  border: 2px solid #969598;
1703
1703
  background: #F4F3F5;
1704
- border-radius: 10px;
1704
+ border-radius: 0.5rem;
1705
1705
  padding: 0.5rem 1rem 0.5rem 2rem;
1706
1706
  }
1707
1707
 
@@ -2281,7 +2281,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2281
2281
  width: 100%;
2282
2282
  background-color: #FFFFFF;
2283
2283
  box-shadow: 0px 0px 16px rgba(0,0,0,0.15);
2284
- border-radius: 10px;
2284
+ border-radius: 0.5rem;
2285
2285
  margin-top: 1rem;
2286
2286
  }
2287
2287
 
@@ -2363,7 +2363,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2363
2363
  height: 48px;
2364
2364
  border: 2px solid #969598;
2365
2365
  background: #F4F3F5;
2366
- border-radius: 10px;
2366
+ border-radius: 0.5rem;
2367
2367
  padding: 0.5rem 1rem 0.5rem 2rem;
2368
2368
  }
2369
2369
 
@@ -22,7 +22,7 @@ const Moneybuy = styled.div`
22
22
  padding: 8px 20px;
23
23
  height: auto;
24
24
  background-color: white;
25
- border-radius: 10px;
25
+ border-radius: 0.5rem;
26
26
  border: 1px solid ${props => props.theme.color('black')};
27
27
  position: relative;
28
28
  flex-direction: row;
@@ -8,12 +8,12 @@ const sizeMultiplier = 1.4;
8
8
  const StyledRangerSlider = styled(RangeSlider)`
9
9
  background: white;
10
10
  height: 16px;
11
- border-radius: 16px;
11
+ border-radius: 1rem;
12
12
  border: 1px solid ${props => props.theme.color('black')};
13
13
 
14
14
  .range-slider__range {
15
15
  height: 14px;
16
- border-radius: 10px;
16
+ border-radius: 0.5rem;
17
17
  background-color: ${props => props.theme.color('red')};
18
18
  z-index: 2;
19
19
  }
@@ -84,7 +84,7 @@ const FormField = styled.div`${({ theme, isError }) => css`
84
84
  padding: ${spacing('m')};
85
85
  background-color: ${theme.color('grey_light')};
86
86
  transition: background-color 0.3s, color 0.3s;
87
- border-radius: 10px;
87
+ border-radius: 0.5rem;
88
88
  border: 1px solid ${theme.color('grey')};
89
89
 
90
90
  &.selected {
@@ -179,7 +179,7 @@ const CheckInput = styled.input`
179
179
  background-color: ${({ theme }) => theme.color('white')};
180
180
  border: 1px solid ${({ theme }) => theme.color('grey')};
181
181
  float: left;
182
- border-radius: 8px;
182
+ border-radius: 0.5rem;
183
183
  }
184
184
  :checked + span {
185
185
  background: url(${checkBoxIcon}) no-repeat center ${({ theme }) => theme.color('white')};
@@ -23,7 +23,7 @@ const Item = styled.div`
23
23
  div {
24
24
  width: 160px;
25
25
  height: 160px;
26
- border-radius: 10px;
26
+ border-radius: 0.5rem;
27
27
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
28
28
  justify-content: flex-end;
29
29
  }
@@ -141,3 +141,11 @@ table td {
141
141
  opacity: 0;
142
142
  filter: blur(5px);
143
143
  }
144
+
145
+ a {
146
+ color: inherit;
147
+ }
148
+
149
+ a:hover, a:focus {
150
+ text-decoration: none;
151
+ }