@comicrelief/component-library 8.47.4 → 8.48.0

package/src/components/Molecules/CTAMultiCard/example_data.json

@@ -0,0 +1,107 @@
+{
+  "__typename": "ContentfulParagraphCardsDs",
+  "title": "test cards 6",
+  "backgroundColour": "Transparent",
+  "layout": "3 columns",
+  "columnsOnMd": false,
+  "paddingOptions": "Both Off",
+  "carouselOfCards": false,
+  "cards": [
+        {
+          "id": "fd8ef3fc-7d0d-531b-b2d2-9ac5f40d3d14",
+          "title": "Full Card Oooh Chilly",
+          "backgroundColour": "White",
+          "link": "/test",
+          "linkLabel": "test go",
+          "image": {
+            "description": "",
+            "gatsbyImageData": {
+              "images": {
+                "sources": [
+                  {
+                    "srcSet": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&q=80&fm=webp 678w",
+                    "sizes": "100vw",
+                    "type": "image/webp"
+                  }
+                ],
+                "fallback": {
+                  "src": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&fl=progressive&q=80&fm=jpg",
+                  "srcSet": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&fl=progressive&q=80&fm=jpg 678w",
+                  "sizes": "100vw"
+                }
+              },
+              "layout": "fullWidth",
+              "width": 1,
+              "height": 0.7389380530973452,
+              "placeholder": {
+                "fallback": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAPABQDASIAAhEBAxEB/8QAGAAAAwEBAAAAAAAAAAAAAAAAAAcIBAb/xAAjEAACAgIBBAIDAAAAAAAAAAABAgMEABEGBRIhMQdBE1Fh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAgT/xAAaEQADAQADAAAAAAAAAAAAAAAAAQIDERIT/9oADAMBAAIRAxEAPwBzRcrjVY+0tonyT41nG8y+SLFTkgpQTVFpoqiRZGHc2/egf4RrMM12OHpNi3LsrAjO2vsKCcQtvkbTW570sMUt6xphJKnd+Ma9A78ZRWcS+SWNLpNMqAdQidVaSxErEA6ZgCNj9YZNPTOTpJW7+ovdlnLHyjgAD6GGPug+bP/Z"
+              }
+            }
+          }
+        },
+        {
+          "id": "fd8ef3fc-7d0d-531b-b2d2-9ac5f40d3d14-2",
+          "title": "Full Card Oooh Chilly",
+          "backgroundColour": "White",
+          "link": "/test",
+          "linkLabel": "test go",
+          "image": {
+            "description": "",
+            "gatsbyImageData": {
+              "images": {
+                "sources": [
+                  {
+                    "srcSet": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&q=80&fm=webp 678w",
+                    "sizes": "100vw",
+                    "type": "image/webp"
+                  }
+                ],
+                "fallback": {
+                  "src": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&fl=progressive&q=80&fm=jpg",
+                  "srcSet": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&fl=progressive&q=80&fm=jpg 678w",
+                  "sizes": "100vw"
+                }
+              },
+              "layout": "fullWidth",
+              "width": 1,
+              "height": 0.7389380530973452,
+              "placeholder": {
+                "fallback": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAPABQDASIAAhEBAxEB/8QAGAAAAwEBAAAAAAAAAAAAAAAAAAcIBAb/xAAjEAACAgIBBAIDAAAAAAAAAAABAgMEABEGBRIhMQdBE1Fh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAgT/xAAaEQADAQADAAAAAAAAAAAAAAAAAQIDERIT/9oADAMBAAIRAxEAPwBzRcrjVY+0tonyT41nG8y+SLFTkgpQTVFpoqiRZGHc2/egf4RrMM12OHpNi3LsrAjO2vsKCcQtvkbTW570sMUt6xphJKnd+Ma9A78ZRWcS+SWNLpNMqAdQidVaSxErEA6ZgCNj9YZNPTOTpJW7+ovdlnLHyjgAD6GGPug+bP/Z"
+              }
+            }
+          }
+        },
+        {
+          "id": "fd8ef3fc-7d0d-531b-b2d2-9ac5f40d3d14-3",
+          "title": "Full Card Oooh Chilly",
+          "backgroundColour": "White",
+          "link": "/test",
+          "linkLabel": "test go",
+          "image": {
+            "description": "",
+            "gatsbyImageData": {
+              "images": {
+                "sources": [
+                  {
+                    "srcSet": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&q=80&fm=webp 678w",
+                    "sizes": "100vw",
+                    "type": "image/webp"
+                  }
+                ],
+                "fallback": {
+                  "src": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&fl=progressive&q=80&fm=jpg",
+                  "srcSet": "https://images.ctfassets.net/zsfivwzfgl3t/4VsIykPLHDNkNCT9djGrX/c8f1e4cb5c6bda5a7b77f18501e9304d/challenge-1.jpg?w=678&h=501&fl=progressive&q=80&fm=jpg 678w",
+                  "sizes": "100vw"
+                }
+              },
+              "layout": "fullWidth",
+              "width": 1,
+              "height": 0.7389380530973452,
+              "placeholder": {
+                "fallback": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAPABQDASIAAhEBAxEB/8QAGAAAAwEBAAAAAAAAAAAAAAAAAAcIBAb/xAAjEAACAgIBBAIDAAAAAAAAAAABAgMEABEGBRIhMQdBE1Fh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAgT/xAAaEQADAQADAAAAAAAAAAAAAAAAAQIDERIT/9oADAMBAAIRAxEAPwBzRcrjVY+0tonyT41nG8y+SLFTkgpQTVFpoqiRZGHc2/egf4RrMM12OHpNi3LsrAjO2vsKCcQtvkbTW570sMUt6xphJKnd+Ma9A78ZRWcS+SWNLpNMqAdQidVaSxErEA6ZgCNj9YZNPTOTpJW7+ovdlnLHyjgAD6GGPug+bP/Z"
+              }
+            }
+          }
+        }
+      ]
+}

package/src/components/Molecules/CardDs/CardDs.md

@@ -1,5 +1,5 @@
 # CardDs
-## Image and CTA are clickable and links user through to full content
+## Image and CTA are clickable and links user through to full content. Note that this component can now be considered legacy, as it is superseded by CTAMultiCard.
 
 ### CardDs:  Image, Text & Link
 ```js

package/src/components/Molecules/HeroBanner/HeroBanner.js

@@ -5,7 +5,7 @@ import Text from '../../Atoms/Text/Text';
 import Link from '../../Atoms/Link/Link';
 import variants from './_variants';
 import { CtaArrow } from '../../Atoms/Icons/index';
-import altCtaUnderline from './assets/alt_cta_underline.svg';
+import altCtaUnderline from '../../../theme/shared/assets/alt_cta_underline.svg';
 import './local-preview-layout-fixes.css';
 
 import {

package/src/index.js

@@ -38,6 +38,7 @@ export { default as InfoBanner } from './components/Molecules/InfoBanner/InfoBan
 export { default as SingleMessage } from './components/Molecules/SingleMessage/SingleMessage';
 export { default as Card } from './components/Molecules/Card/Card';
 export { default as CardDs } from './components/Molecules/CardDs/CardDs';
+export { default as CTAMultiCard } from './components/Molecules/CTAMultiCard/CTAMultiCard';
 export { default as Box } from './components/Molecules/Box/Box';
 export { default as ArticleTeaser } from './components/Molecules/ArticleTeaser/ArticleTeaser';
 export { default as Header } from './components/Organisms/Header/Header';

package/src/{components/Molecules/HeroBanner → theme/shared}/assets/alt_cta_underline.svg

@@ -1,3 +1,4 @@
 <svg width="198" height="4" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M16.8487 0.0995634C18.4146 -0.0553036 21.4342 0.00794268 23.0951 0.0426774C23.1256 0.0432472 23.156 0.0438168 23.1865 0.0443864C23.5807 0.0526142 23.9536 0.0547516 24.3905 0.0570819C25.4322 0.0626388 26.8397 0.0701852 29.7773 0.1689C30.632 0.165263 31.4869 0.163285 32.3416 0.163285C41.572 0.163287 50.8024 0.29205 60.0328 0.446249C60.1494 0.445454 60.268 0.444635 60.3878 0.443808C62.7029 0.427827 65.5737 0.408052 67.3774 0.46456C69.6707 0.536405 71.2283 0.603072 72.5075 0.660609C79.839 0.784683 87.1706 0.895552 94.5021 0.941376C96.7999 0.955737 99.098 0.963592 101.396 0.963593C103.512 0.963593 105.628 0.958676 107.744 0.949433C108.977 0.915729 110.148 0.875687 111.235 0.838591C112.761 0.786463 114.12 0.74017 115.243 0.725063C117.948 0.68867 121.016 0.74611 123.295 0.788785C123.667 0.795759 124.019 0.802363 124.344 0.808073C126.153 0.786935 127.963 0.764306 129.773 0.741177C129.894 0.754045 130.015 0.767463 130.139 0.781217C131.684 0.952869 133.582 0.950669 136.571 0.947479C137.872 0.946091 139.38 0.944586 141.156 0.957001C142.3 0.965001 142.888 1.03306 143.368 1.0886C143.51 1.10493 143.642 1.1202 143.776 1.13254C144.236 1.17481 144.721 1.12913 145.293 1.07517C146.036 1.00516 146.926 0.92108 148.103 0.997041C151.854 1.23908 153.506 1.07487 154.756 0.950654C155.123 0.914216 155.455 0.881293 155.796 0.863005C156.899 0.803725 158.471 0.86246 159.659 0.943085C160.601 1.00702 162.486 0.943636 163.915 0.863005C164.456 0.832517 165.186 0.831751 166.047 0.831022C166.938 0.830269 167.969 0.829583 169.072 0.795377C171.858 0.708937 173.339 0.66704 174.529 0.633509C174.869 0.623949 175.185 0.615244 175.501 0.606165C176.499 0.577475 177.737 0.553839 178.991 0.529991C180.492 0.501453 182.015 0.472475 183.173 0.433798C186.177 0.47473 189.18 0.525369 192.183 0.575891C193.726 0.60212 195.206 0.749846 196.297 0.993379C197.387 1.23711 198 1.55491 198 1.88426C198 2.21363 197.387 2.53141 196.297 2.77515C195.206 3.01868 193.726 3.16665 192.183 3.19288C189.076 3.24516 185.968 3.29747 182.86 3.33913C179.074 3.38986 175.288 3.42482 171.502 3.42482C168.854 3.42482 166.205 3.41697 163.557 3.40285C163.284 3.40139 163.012 3.39979 162.739 3.39821C160.514 3.47931 158.294 3.55307 156.729 3.57936C155.437 3.60107 154.496 3.55779 153.689 3.52077C153.134 3.49529 152.643 3.47275 152.146 3.47634C151.879 3.47826 151.514 3.48327 151.075 3.48928C149.28 3.51382 146.231 3.55547 143.45 3.47634C142.216 3.44122 140.782 3.37201 139.414 3.30592C137.457 3.21143 135.632 3.12335 134.71 3.1504C133.092 3.19794 131.237 3.1577 129.598 3.12208C128.034 3.0881 126.666 3.05843 125.888 3.11329C124.959 3.17888 124.166 3.15214 122.988 3.11256C122.171 3.0851 121.168 3.05159 119.804 3.03809C118.23 3.02252 117.117 2.97657 116.17 2.93751C114.838 2.88252 113.836 2.84119 112.343 2.91724C110.683 3.00174 108.949 3.05551 107.583 3.02882C106.961 3.01666 106.25 3.01961 105.509 3.02271C104.529 3.02682 103.498 3.03106 102.557 3.00074C101.781 2.97575 101.14 2.91181 100.573 2.85523C100.396 2.83758 100.226 2.82073 100.061 2.80591C99.4434 2.80673 98.8255 2.80793 98.2077 2.80982C98.1076 2.82011 98.0025 2.83151 97.8927 2.84327C97.3419 2.90229 96.6646 2.97468 95.8262 3.01075C94.4992 3.06783 93.3347 3.03209 92.1063 2.99415C91.1499 2.96461 90.1548 2.93378 89.014 2.94483C88.2362 2.95237 87.3504 2.97851 86.4724 3.0044C85.1684 3.04286 83.8806 3.0807 82.9859 3.05665C82.6507 3.04763 82.3625 3.00748 82.0773 2.96754C82.076 2.96729 82.0748 2.96705 82.0735 2.9668C82.0541 2.96409 82.0347 2.96145 82.0153 2.95875C79.8363 2.98934 77.6571 3.02307 75.4781 3.0586C75.2893 3.06892 75.0985 3.0791 74.9094 3.08912C73.9854 3.13809 73.0876 3.18565 72.5022 3.25319C71.8678 3.32639 70.2728 3.36896 68.592 3.41383C67.4913 3.44322 66.3532 3.47357 65.4242 3.51418C64.8811 3.53791 64.3659 3.49654 63.8358 3.45387C63.3412 3.41407 62.8334 3.37322 62.2783 3.38332C62.0003 3.38838 61.7 3.40552 61.3795 3.42384C61.0974 3.43998 60.7991 3.45707 60.4867 3.46755C60.1965 3.47725 59.5503 3.45471 58.7216 3.42604C58.2095 3.40832 57.6276 3.38831 57.0168 3.37184C55.4026 3.39762 53.788 3.42235 52.1738 3.44533C51.837 3.4816 51.5448 3.52869 51.3135 3.58913C51.1475 3.6325 51.0062 3.68433 50.8611 3.73733C50.6636 3.80944 50.4592 3.88396 50.1775 3.94339C49.9574 3.98982 49.6977 4.00832 49.5234 3.98904C49.4422 3.98005 49.3799 3.9631 49.3233 3.94778C49.2584 3.93023 49.2006 3.91462 49.1299 3.91506C49.079 3.91542 49.0259 3.92785 48.9607 3.9429C48.8566 3.96693 48.7211 3.99795 48.5151 3.99905C47.7482 4.00315 46.8765 3.99323 46.0226 3.98343C45.073 3.97253 44.1448 3.96196 43.4054 3.97122C42.577 3.9816 41.3966 3.93545 40.2142 3.88943C39.3894 3.85733 38.5633 3.82539 37.8546 3.81228C37.1602 3.79944 36.437 3.82497 35.7367 3.84988C34.8962 3.87978 34.0877 3.90866 33.4006 3.86819C33.2616 3.85997 33.0891 3.80993 32.8726 3.74734C32.7192 3.70297 32.5426 3.65225 32.3416 3.60549C31.467 3.60549 30.5923 3.60343 29.7177 3.59963C29.6869 3.60642 29.6551 3.61333 29.6233 3.62038C29.6228 3.62054 29.6223 3.62071 29.6217 3.62087C28.9034 3.78008 27.9204 3.99786 26.5393 3.86794C26.1883 3.83492 25.9673 3.77392 25.7682 3.71902C25.5726 3.6651 25.3978 3.61685 25.142 3.60671C24.8514 3.59522 24.5084 3.62833 24.1344 3.66433C23.6093 3.71488 23.0228 3.77136 22.4342 3.71877C22.394 3.71518 22.3508 3.71124 22.3058 3.7073C21.8792 3.66989 21.2477 3.61455 20.6192 3.50319C18.7547 3.47346 16.8899 3.43865 15.0254 3.40065C11.9174 3.3373 8.80877 3.26507 5.70108 3.19288C4.18915 3.15735 2.73913 3.0057 1.66999 2.76294C0.600791 2.51984 0 2.20742 0 1.88426C8.923e-05 1.56114 0.600871 1.24891 1.66999 1.00583C2.73913 0.763056 4.18909 0.611426 5.70108 0.575891C8.16655 0.518618 10.6328 0.461263 13.0986 0.408407C13.2278 0.401696 13.3576 0.395205 13.4868 0.389119C14.448 0.343838 15.3399 0.252889 16.2324 0.16182C16.4374 0.140902 16.6428 0.119938 16.8487 0.0995634Z" fill="#E52630"/>
 </svg>
+