@comicrelief/component-library 8.0.2 → 8.1.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.
@@ -31,7 +31,7 @@ const Item = styled.div`
31
31
 
32
32
  <div>
33
33
  <Text tag="h3" family="Anton" uppercase color="black" size="l">
34
- Primary
34
+ Primary (CR Theme)
35
35
  </Text>
36
36
  <Grid>
37
37
  <Item>
@@ -277,7 +277,7 @@ const Item = styled.div`
277
277
  </Item>
278
278
  </Grid>
279
279
  <Text tag="h3" family="Anton" uppercase color="black" size="l">
280
- Accent Colours
280
+ Accent Colours (CR Theme)
281
281
  </Text>
282
282
  <Text tag="h3" color="black" size="xs">
283
283
  Used for highlighted actions and content
@@ -319,5 +319,22 @@ const Item = styled.div`
319
319
  </Card>
320
320
  </Item>
321
321
  </Grid>
322
+
323
+ <Text tag="h3" family="Anton" uppercase color="black" size="l">
324
+ Additional Colours (CR Theme)
325
+ </Text>
326
+ <Text tag="h3" color="black" size="xs">
327
+ Currently, just one new colour used exclusively in the Donate widget on CRcom and the 2024 Donate build
328
+ </Text>
329
+ <Grid>
330
+ <Item>
331
+ <Card backgroundColor="blue_donate" height="auto">
332
+ <Text tag="h3" color="white" size="xs">
333
+ Blue Donate
334
+ </Text>
335
+ <Text tag="p" color="white">#2042AD</Text>
336
+ </Card>
337
+ </Item>
338
+ </Grid>
322
339
  </div>;
323
340
  ```
@@ -8,6 +8,7 @@ const colors = {
8
8
  black: '#000000',
9
9
  blue: '#0565D1',
10
10
  blue_dark: '#274084',
11
+ blue_donate: '#2042AD',
11
12
  blue_light: '#BECCF9',
12
13
  blue_royal: '#6489FC',
13
14
  coral: '#F9686D',
@@ -9,6 +9,7 @@ const colors = {
9
9
  black_dark: '#030e1a',
10
10
  blue: '#223c59',
11
11
  blue_dark: '#3a4972',
12
+ blue_donate: '#2042AD',
12
13
  blue_light: '#274084',
13
14
  blue_royal: '#6489FC',
14
15
  coral: '#FF6F61',
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.0.2",
4
+ "version": "8.1.0",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
@@ -31,7 +31,7 @@ const Item = styled.div`
31
31
 
32
32
  <div>
33
33
  <Text tag="h3" family="Anton" uppercase color="black" size="l">
34
- Primary
34
+ Primary (CR Theme)
35
35
  </Text>
36
36
  <Grid>
37
37
  <Item>
@@ -277,7 +277,7 @@ const Item = styled.div`
277
277
  </Item>
278
278
  </Grid>
279
279
  <Text tag="h3" family="Anton" uppercase color="black" size="l">
280
- Accent Colours
280
+ Accent Colours (CR Theme)
281
281
  </Text>
282
282
  <Text tag="h3" color="black" size="xs">
283
283
  Used for highlighted actions and content
@@ -319,5 +319,22 @@ const Item = styled.div`
319
319
  </Card>
320
320
  </Item>
321
321
  </Grid>
322
+
323
+ <Text tag="h3" family="Anton" uppercase color="black" size="l">
324
+ Additional Colours (CR Theme)
325
+ </Text>
326
+ <Text tag="h3" color="black" size="xs">
327
+ Currently, just one new colour used exclusively in the Donate widget on CRcom and the 2024 Donate build
328
+ </Text>
329
+ <Grid>
330
+ <Item>
331
+ <Card backgroundColor="blue_donate" height="auto">
332
+ <Text tag="h3" color="white" size="xs">
333
+ Blue Donate
334
+ </Text>
335
+ <Text tag="p" color="white">#2042AD</Text>
336
+ </Card>
337
+ </Item>
338
+ </Grid>
322
339
  </div>;
323
340
  ```
@@ -2,6 +2,7 @@ const colors = {
2
2
  black: '#000000',
3
3
  blue: '#0565D1',
4
4
  blue_dark: '#274084',
5
+ blue_donate: '#2042AD',
5
6
  blue_light: '#BECCF9',
6
7
  blue_royal: '#6489FC',
7
8
  coral: '#F9686D',
@@ -3,6 +3,7 @@ const colors = {
3
3
  black_dark: '#030e1a',
4
4
  blue: '#223c59',
5
5
  blue_dark: '#3a4972',
6
+ blue_donate: '#2042AD',
6
7
  blue_light: '#274084',
7
8
  blue_royal: '#6489FC',
8
9
  coral: '#FF6F61',