@comicrelief/component-library 7.47.0 → 7.48.0

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.
@@ -21,8 +21,6 @@ const Card = _ref => {
21
21
  squaredCorners,
22
22
  smallBreakpointRowLayout,
23
23
  mediumBreakpointRowLayout,
24
- rowTextColor,
25
- columnTextColor,
26
24
  ...rest
27
25
  } = _ref;
28
26
  return /*#__PURE__*/_react.default.createElement(_Card.Container, Object.assign({
@@ -42,9 +40,7 @@ const Card = _ref => {
42
40
  mediumBreakpointRowLayout: mediumBreakpointRowLayout
43
41
  })) : null, children ? /*#__PURE__*/_react.default.createElement(_Card.Copy, {
44
42
  smallBreakpointRowLayout: smallBreakpointRowLayout,
45
- mediumBreakpointRowLayout: mediumBreakpointRowLayout,
46
- rowTextColor: rowTextColor,
47
- columnTextColor: columnTextColor
43
+ mediumBreakpointRowLayout: mediumBreakpointRowLayout
48
44
  }, children) : null);
49
45
  };
50
46
  Card.defaultProps = {
@@ -58,8 +54,6 @@ Card.defaultProps = {
58
54
  height: '100%',
59
55
  squaredCorners: false,
60
56
  smallBreakpointRowLayout: null,
61
- mediumBreakpointRowLayout: null,
62
- rowTextColor: 'black',
63
- columnTextColor: 'black'
57
+ mediumBreakpointRowLayout: null
64
58
  };
65
59
  var _default = exports.default = Card;
@@ -9,8 +9,6 @@ import Link from '../../Atoms/Link/Link';
9
9
  images={defaultData.images}
10
10
  backgroundColor="blue"
11
11
  height="auto"
12
- rowTextColor="purple"
13
- columnTextColor="black"
14
12
  >
15
13
  <Text tag="h3" size="xl">
16
14
  Title
@@ -35,8 +33,6 @@ import Link from '../../Atoms/Link/Link';
35
33
  height="auto"
36
34
  smallBreakpointRowLayout={true}
37
35
  mediumBreakpointRowLayout={false}
38
- rowTextColor="purple"
39
- columnTextColor="black"
40
36
  >
41
37
  <Text tag="h3" size="xl">
42
38
  Title
@@ -61,8 +57,6 @@ import Link from '../../Atoms/Link/Link';
61
57
  height="auto"
62
58
  smallBreakpointRowLayout={false}
63
59
  mediumBreakpointRowLayout={true}
64
- rowTextColor="purple"
65
- columnTextColor="black"
66
60
  >
67
61
  <Text tag="h3" size="xl">
68
62
  Title
@@ -87,8 +81,6 @@ import Link from '../../Atoms/Link/Link';
87
81
  height="auto"
88
82
  smallBreakpointRowLayout={true}
89
83
  mediumBreakpointRowLayout={true}
90
- rowTextColor="purple"
91
- columnTextColor="black"
92
84
  >
93
85
  <Text tag="h3" size="xl">
94
86
  Title
@@ -60,7 +60,7 @@ const Wrapper = exports.Wrapper = _styledComponents.default.div.withConfig({
60
60
  const Copy = exports.Copy = _styledComponents.default.div.withConfig({
61
61
  displayName: "Cardstyle__Copy",
62
62
  componentId: "sc-cxn4co-2"
63
- })(["display:flex;flex-direction:column;padding:", ";", " ", " @media ", "{padding:", ";h1{font-size:2rem;}}@media ", "{color:", ";@media ", "{color:", ";}@media ", "{color:", ";}"], (0, _spacing.default)('l'), _ref8 => {
63
+ })(["display:flex;flex-direction:column;padding:", ";", " ", " @media ", "{padding:", ";h1{font-size:2rem;}}"], (0, _spacing.default)('l'), _ref8 => {
64
64
  let {
65
65
  smallBreakpointRowLayout
66
66
  } = _ref8;
@@ -90,19 +90,4 @@ const Copy = exports.Copy = _styledComponents.default.div.withConfig({
90
90
  theme
91
91
  } = _ref13;
92
92
  return theme.allBreakpoints('L');
93
- }, (0, _spacing.default)('l'), _ref14 => {
94
- let {
95
- theme
96
- } = _ref14;
97
- return theme.allBreakpoints('S');
98
- }, props => props.smallBreakpointRowLayout === true ? "".concat(props.rowTextColor) : "".concat(props.columnTextColor), _ref15 => {
99
- let {
100
- theme
101
- } = _ref15;
102
- return theme.allBreakpoints('M');
103
- }, props => props.mediumBreakpointRowLayout === true ? "".concat(props.rowTextColor) : "".concat(props.columnTextColor), _ref16 => {
104
- let {
105
- theme
106
- } = _ref16;
107
- return theme.allBreakpoints('L');
108
- }, props => props.columnTextColor);
93
+ }, (0, _spacing.default)('l'));
@@ -63,12 +63,6 @@ exports[`renders correctly 1`] = `
63
63
  }
64
64
  }
65
65
 
66
- @media (min-width:0px) {
67
- .c1 {
68
- color: black;
69
- }
70
- }
71
-
72
66
  <div
73
67
  className="c0"
74
68
  >
@@ -148,12 +142,6 @@ exports[`renders correctly 2`] = `
148
142
  }
149
143
  }
150
144
 
151
- @media (min-width:0px) {
152
- .c1 {
153
- color: black;
154
- }
155
- }
156
-
157
145
  <div
158
146
  className="c0"
159
147
  >
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": "7.47.0",
4
+ "version": "7.48.0",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
@@ -15,8 +15,6 @@ const Card = ({
15
15
  squaredCorners,
16
16
  smallBreakpointRowLayout,
17
17
  mediumBreakpointRowLayout,
18
- rowTextColor,
19
- columnTextColor,
20
18
  ...rest
21
19
  }) => (
22
20
  <Container
@@ -46,8 +44,6 @@ const Card = ({
46
44
  <Copy
47
45
  smallBreakpointRowLayout={smallBreakpointRowLayout}
48
46
  mediumBreakpointRowLayout={mediumBreakpointRowLayout}
49
- rowTextColor={rowTextColor}
50
- columnTextColor={columnTextColor}
51
47
  >
52
48
  {children}
53
49
  </Copy>
@@ -66,9 +62,7 @@ Card.propTypes = {
66
62
  children: PropTypes.node,
67
63
  squaredCorners: PropTypes.bool,
68
64
  smallBreakpointRowLayout: PropTypes.bool,
69
- mediumBreakpointRowLayout: PropTypes.bool,
70
- rowTextColor: PropTypes.string,
71
- columnTextColor: PropTypes.string
65
+ mediumBreakpointRowLayout: PropTypes.bool
72
66
  };
73
67
 
74
68
  Card.defaultProps = {
@@ -82,9 +76,7 @@ Card.defaultProps = {
82
76
  height: '100%',
83
77
  squaredCorners: false,
84
78
  smallBreakpointRowLayout: null,
85
- mediumBreakpointRowLayout: null,
86
- rowTextColor: 'black',
87
- columnTextColor: 'black'
79
+ mediumBreakpointRowLayout: null
88
80
  };
89
81
 
90
82
  export default Card;
@@ -9,8 +9,6 @@ import Link from '../../Atoms/Link/Link';
9
9
  images={defaultData.images}
10
10
  backgroundColor="blue"
11
11
  height="auto"
12
- rowTextColor="purple"
13
- columnTextColor="black"
14
12
  >
15
13
  <Text tag="h3" size="xl">
16
14
  Title
@@ -35,8 +33,6 @@ import Link from '../../Atoms/Link/Link';
35
33
  height="auto"
36
34
  smallBreakpointRowLayout={true}
37
35
  mediumBreakpointRowLayout={false}
38
- rowTextColor="purple"
39
- columnTextColor="black"
40
36
  >
41
37
  <Text tag="h3" size="xl">
42
38
  Title
@@ -61,8 +57,6 @@ import Link from '../../Atoms/Link/Link';
61
57
  height="auto"
62
58
  smallBreakpointRowLayout={false}
63
59
  mediumBreakpointRowLayout={true}
64
- rowTextColor="purple"
65
- columnTextColor="black"
66
60
  >
67
61
  <Text tag="h3" size="xl">
68
62
  Title
@@ -87,8 +81,6 @@ import Link from '../../Atoms/Link/Link';
87
81
  height="auto"
88
82
  smallBreakpointRowLayout={true}
89
83
  mediumBreakpointRowLayout={true}
90
- rowTextColor="purple"
91
- columnTextColor="black"
92
84
  >
93
85
  <Text tag="h3" size="xl">
94
86
  Title
@@ -74,22 +74,6 @@ const Copy = styled.div`
74
74
  font-size: 2rem;
75
75
  }
76
76
  }
77
-
78
- /* Setting colors based on row (transparent background) vs column view */
79
- @media ${({ theme }) => theme.allBreakpoints('S')} {
80
- color: ${props => ((props.smallBreakpointRowLayout === true)
81
- ? `${props.rowTextColor}`
82
- : `${props.columnTextColor}`
83
- )};
84
- @media ${({ theme }) => theme.allBreakpoints('M')} {
85
- color: ${props => ((props.mediumBreakpointRowLayout === true)
86
- ? `${props.rowTextColor}`
87
- : `${props.columnTextColor}`
88
- )};
89
- }
90
- @media ${({ theme }) => theme.allBreakpoints('L')} {
91
- color: ${props => props.columnTextColor};
92
- }
93
77
  `;
94
78
 
95
79
  export { Container, Wrapper, Copy };
@@ -63,12 +63,6 @@ exports[`renders correctly 1`] = `
63
63
  }
64
64
  }
65
65
 
66
- @media (min-width:0px) {
67
- .c1 {
68
- color: black;
69
- }
70
- }
71
-
72
66
  <div
73
67
  className="c0"
74
68
  >
@@ -148,12 +142,6 @@ exports[`renders correctly 2`] = `
148
142
  }
149
143
  }
150
144
 
151
- @media (min-width:0px) {
152
- .c1 {
153
- color: black;
154
- }
155
- }
156
-
157
145
  <div
158
146
  className="c0"
159
147
  >