@comicrelief/component-library 8.43.0 → 8.44.0

package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap

@@ -2,43 +2,72 @@
 
 exports[`"Single Giving, No Money Buys, with overridden manual input value" renders correctly 1`] = `
 .c4 {
-  color: #FFFFFF;
-  font-size: 4rem;
-  line-height: 4rem;
+  font-family: 'Anton',Impact,sans-serif;
+  font-weight: 400;
   text-transform: uppercase;
-  font-weight: normal;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+}
+
+.c4 {
+  font-size: 4rem;
+  line-height: normal;
   font-family: 'Anton',Impact,sans-serif;
-  -webkit-letter-spacing: 0.03rem;
-  -moz-letter-spacing: 0.03rem;
-  -ms-letter-spacing: 0.03rem;
-  letter-spacing: 0.03rem;
+  font-weight: normal;
+  text-transform: uppercase;
+  color: #FFFFFF;
 }
 
 .c5 {
-  color: #FFFFFF;
-  font-size: 1.25rem;
-  line-height: 1.25rem;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
   text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
+}
+
+.c5 {
+  font-size: 1.25rem;
   line-height: normal;
+  color: #FFFFFF;
+}
+
+.c16 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
   font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c16 {
   font-size: 1.5rem;
-  line-height: 1.5rem;
-  text-transform: inherit;
-  font-weight: bold;
   line-height: normal;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: bold;
 }
 
 .c20 {
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  line-height: normal;
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c18 {
@@ -56,7 +85,15 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
 
 .c21 {
   margin-bottom: 0.5rem;
-  font-weight: normal;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c22 {
@@ -98,7 +135,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
   border-radius: 0.5rem;
   font-size: inherit;
   z-index: 2;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-family: inherit;
 }
 
 .c24:focus {
@@ -425,9 +462,73 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
   box-shadow: inset 0 0 0 4px #2042AD;
 }
 
+@media (min-width:740px) {
+  .c4 {
+    font-size: 1.875rem;
+    line-height: 1.875rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c4 {
+    font-size: 2rem;
+    line-height: 2rem;
+  }
+}
+
 @media (min-width:740px) {
   .c5 {
-    font-size: 1.25rem;
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c5 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c16 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c16 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c20 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c20 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c21 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c21 {
+    font-size: 1rem;
+    line-height: 1.25rem;
   }
 }
 
@@ -637,7 +738,6 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
                     "__html": "£",
                   }
                 }
-                size="s"
               />
               <div
                 className="c22"
@@ -692,52 +792,90 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
 
 exports[`Monthly donation renders correctly 1`] = `
 .c4 {
-  color: #FFFFFF;
-  font-size: 4rem;
-  line-height: 4rem;
+  font-family: 'Anton',Impact,sans-serif;
+  font-weight: 400;
   text-transform: uppercase;
-  font-weight: normal;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+}
+
+.c4 {
+  font-size: 4rem;
+  line-height: normal;
   font-family: 'Anton',Impact,sans-serif;
-  -webkit-letter-spacing: 0.03rem;
-  -moz-letter-spacing: 0.03rem;
-  -ms-letter-spacing: 0.03rem;
-  letter-spacing: 0.03rem;
+  font-weight: normal;
+  text-transform: uppercase;
+  color: #FFFFFF;
 }
 
 .c5 {
-  color: #FFFFFF;
-  font-size: 1.25rem;
-  line-height: 1.25rem;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
   text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
+}
+
+.c5 {
+  font-size: 1.25rem;
   line-height: normal;
+  color: #FFFFFF;
+}
+
+.c15 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
   font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c15 {
   font-size: 1.5rem;
-  line-height: 1.5rem;
-  text-transform: inherit;
-  font-weight: bold;
   line-height: normal;
+  font-weight: bold;
+}
+
+.c17 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c17 {
   font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  font-weight: 500;
   line-height: normal;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 500;
 }
 
 .c21 {
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  line-height: normal;
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c19 {
@@ -755,7 +893,15 @@ exports[`Monthly donation renders correctly 1`] = `
 
 .c22 {
   margin-bottom: 0.5rem;
-  font-weight: normal;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c23 {
@@ -797,7 +943,7 @@ exports[`Monthly donation renders correctly 1`] = `
   border-radius: 0.5rem;
   font-size: inherit;
   z-index: 2;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-family: inherit;
 }
 
 .c25:focus {
@@ -1089,9 +1235,87 @@ exports[`Monthly donation renders correctly 1`] = `
   box-shadow: inset 0 0 0 4px #2042AD;
 }
 
+@media (min-width:740px) {
+  .c4 {
+    font-size: 1.875rem;
+    line-height: 1.875rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c4 {
+    font-size: 2rem;
+    line-height: 2rem;
+  }
+}
+
 @media (min-width:740px) {
   .c5 {
-    font-size: 1.25rem;
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c5 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c15 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c15 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c17 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c17 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c21 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c21 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c22 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c22 {
+    font-size: 1rem;
+    line-height: 1.25rem;
   }
 }
 
@@ -1304,7 +1528,6 @@ exports[`Monthly donation renders correctly 1`] = `
                     "__html": "£",
                   }
                 }
-                size="s"
               />
               <div
                 className="c23"
@@ -1358,52 +1581,90 @@ exports[`Monthly donation renders correctly 1`] = `
 
 exports[`Single donation renders correctly 1`] = `
 .c4 {
-  color: #FFFFFF;
-  font-size: 4rem;
-  line-height: 4rem;
+  font-family: 'Anton',Impact,sans-serif;
+  font-weight: 400;
   text-transform: uppercase;
-  font-weight: normal;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+}
+
+.c4 {
+  font-size: 4rem;
+  line-height: normal;
   font-family: 'Anton',Impact,sans-serif;
-  -webkit-letter-spacing: 0.03rem;
-  -moz-letter-spacing: 0.03rem;
-  -ms-letter-spacing: 0.03rem;
-  letter-spacing: 0.03rem;
+  font-weight: normal;
+  text-transform: uppercase;
+  color: #FFFFFF;
 }
 
 .c5 {
-  color: #FFFFFF;
-  font-size: 1.25rem;
-  line-height: 1.25rem;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
   text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
+}
+
+.c5 {
+  font-size: 1.25rem;
   line-height: normal;
+  color: #FFFFFF;
+}
+
+.c10 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
   font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c10 {
   font-size: 1.5rem;
-  line-height: 1.5rem;
-  text-transform: inherit;
-  font-weight: bold;
   line-height: normal;
+  font-weight: bold;
+}
+
+.c21 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c21 {
   font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  font-weight: 500;
   line-height: normal;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 500;
 }
 
 .c14 {
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  line-height: normal;
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c12 {
@@ -1421,7 +1682,15 @@ exports[`Single donation renders correctly 1`] = `
 
 .c15 {
   margin-bottom: 0.5rem;
-  font-weight: normal;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c16 {
@@ -1463,7 +1732,7 @@ exports[`Single donation renders correctly 1`] = `
   border-radius: 0.5rem;
   font-size: inherit;
   z-index: 2;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-family: inherit;
 }
 
 .c18:focus {
@@ -1741,9 +2010,87 @@ exports[`Single donation renders correctly 1`] = `
   background-color: #961D35;
 }
 
+@media (min-width:740px) {
+  .c4 {
+    font-size: 1.875rem;
+    line-height: 1.875rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c4 {
+    font-size: 2rem;
+    line-height: 2rem;
+  }
+}
+
 @media (min-width:740px) {
   .c5 {
-    font-size: 1.25rem;
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c5 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c10 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c10 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c21 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c21 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c14 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c14 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c15 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c15 {
+    font-size: 1rem;
+    line-height: 1.25rem;
   }
 }
 
@@ -1939,7 +2286,6 @@ exports[`Single donation renders correctly 1`] = `
                     "__html": "",
                   }
                 }
-                size="s"
               />
               <div
                 className="c16"
@@ -1977,7 +2323,6 @@ exports[`Single donation renders correctly 1`] = `
                     "__html": "",
                   }
                 }
-                size="s"
               />
               <div
                 className="c16"
@@ -2015,7 +2360,6 @@ exports[`Single donation renders correctly 1`] = `
                     "__html": "",
                   }
                 }
-                size="s"
               />
               <div
                 className="c16"
@@ -2064,7 +2408,6 @@ exports[`Single donation renders correctly 1`] = `
                     "__html": "£",
                   }
                 }
-                size="s"
               />
               <div
                 className="c16"
@@ -2119,43 +2462,72 @@ exports[`Single donation renders correctly 1`] = `
 
 exports[`Single donation with no Money Buys renders correctly 1`] = `
 .c4 {
-  color: #FFFFFF;
-  font-size: 4rem;
-  line-height: 4rem;
+  font-family: 'Anton',Impact,sans-serif;
+  font-weight: 400;
   text-transform: uppercase;
-  font-weight: normal;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+}
+
+.c4 {
+  font-size: 4rem;
+  line-height: normal;
   font-family: 'Anton',Impact,sans-serif;
-  -webkit-letter-spacing: 0.03rem;
-  -moz-letter-spacing: 0.03rem;
-  -ms-letter-spacing: 0.03rem;
-  letter-spacing: 0.03rem;
+  font-weight: normal;
+  text-transform: uppercase;
+  color: #FFFFFF;
 }
 
 .c5 {
-  color: #FFFFFF;
-  font-size: 1.25rem;
-  line-height: 1.25rem;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
   text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
+}
+
+.c5 {
+  font-size: 1.25rem;
   line-height: normal;
+  color: #FFFFFF;
+}
+
+.c10 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
   font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c10 {
   font-size: 1.5rem;
-  line-height: 1.5rem;
-  text-transform: inherit;
-  font-weight: bold;
   line-height: normal;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: bold;
 }
 
 .c14 {
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  line-height: normal;
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c12 {
@@ -2173,7 +2545,15 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
 
 .c15 {
   margin-bottom: 0.5rem;
-  font-weight: normal;
+  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-weight: 400;
+  text-transform: inherit;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1rem;
+  line-height: 1.25rem;
 }
 
 .c16 {
@@ -2215,7 +2595,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
   border-radius: 0.5rem;
   font-size: inherit;
   z-index: 2;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-family: inherit;
 }
 
 .c18:focus {
@@ -2403,9 +2783,73 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
   background-color: #961D35;
 }
 
+@media (min-width:740px) {
+  .c4 {
+    font-size: 1.875rem;
+    line-height: 1.875rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c4 {
+    font-size: 2rem;
+    line-height: 2rem;
+  }
+}
+
 @media (min-width:740px) {
   .c5 {
-    font-size: 1.25rem;
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c5 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c10 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c10 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c14 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c14 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c15 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c15 {
+    font-size: 1rem;
+    line-height: 1.25rem;
   }
 }
 
@@ -2561,7 +3005,6 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
                     "__html": "£",
                   }
                 }
-                size="s"
               />
               <div
                 className="c16"