@comicrelief/component-library 8.43.0 → 8.44.0

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

@@ -2,23 +2,35 @@
 
 exports[`renders correctly 1`] = `
 .c1 {
-  font-size: 3rem;
-  line-height: 3rem;
-  text-transform: uppercase;
+  font-family: 'Anton',Impact,sans-serif;
   font-weight: 400;
+  text-transform: uppercase;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+}
+
+.c1 {
+  font-size: 3rem;
+  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: 400;
+  text-transform: uppercase;
 }
 
 .c4 {
-  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;
 }
 
 .c15 {
@@ -76,7 +88,15 @@ exports[`renders correctly 1`] = `
 
 .c10 {
   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;
 }
 
 .c11 {
@@ -118,7 +138,7 @@ exports[`renders correctly 1`] = `
   border-radius: 0.5rem;
   font-size: inherit;
   z-index: 2;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-family: inherit;
 }
 
 .c13:focus {
@@ -220,6 +240,34 @@ exports[`renders correctly 1`] = `
   margin-bottom: 1.5rem;
 }
 
+@media (min-width:740px) {
+  .c1 {
+    font-size: 1.875rem;
+    line-height: 1.875rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c1 {
+    font-size: 2rem;
+    line-height: 2rem;
+  }
+}
+
+@media (min-width:740px) {
+  .c4 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c4 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
 @media (min-width:740px) {
   .c15 {
     width: auto;
@@ -234,6 +282,20 @@ exports[`renders correctly 1`] = `
   }
 }
 
+@media (min-width:740px) {
+  .c10 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c10 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
 @media (min-width:740px) {
 
 }
@@ -281,7 +343,6 @@ exports[`renders correctly 1`] = `
       <span
         className="c4"
         color="inherit"
-        size="s"
       >
         <div
           className="c5"
@@ -311,7 +372,6 @@ exports[`renders correctly 1`] = `
                 "__html": "First Name",
               }
             }
-            size="s"
           />
           <div
             className="c11"
@@ -348,7 +408,6 @@ exports[`renders correctly 1`] = `
                 "__html": "Last Name",
               }
             }
-            size="s"
           />
           <div
             className="c11"
@@ -386,7 +445,6 @@ exports[`renders correctly 1`] = `
               "__html": "Email Address",
             }
           }
-          size="s"
         />
         <div
           className="c11"
@@ -423,7 +481,6 @@ exports[`renders correctly 1`] = `
           <span
             className="c4"
             color="inherit"
-            size="s"
           >
             Subscribe
           </span>
@@ -439,7 +496,6 @@ exports[`renders correctly 1`] = `
       <span
         className="c4"
         color="inherit"
-        size="s"
       >
         <div
           className="c5"

package/dist/components/Organisms/Footer/Nav/Nav.style.js

@@ -123,7 +123,7 @@ const NavLink = exports.NavLink = (0, _styledComponents.default)(NavLinkClass).w
 const NavItem = exports.NavItem = _styledComponents.default.li.withConfig({
   displayName: "Navstyle__NavItem",
   componentId: "sc-uzf5hs-7"
-})(["position:relative;font-weight:700;margin:0;margin-bottom:1rem;@media ", "{flex:0 0 30%;margin:0;}@media ", "{flex:0 0 calc(25% - 1rem);margin-right:1rem;margin-bottom:1rem;> span{padding:0;}}a{width:auto;padding:0;height:auto;position:relative;background-color:inherit;font-size:19px;line-height:40px;font-weight:800;@media ", "{font-size:20px;line-height:40px;}&:after{content:'\\2303';position:absolute;font-family:Arial;margin-left:4px;overflow:hidden;line-height:19px;font-size:23px;color:", ";font-weight:100;transition:transform 0.2s ease;transform:", ";top:", ";right:-25px;}@media ", "{cursor:default;display:inline;&:after{content:none;}}}"], _ref12 => {
+})(["position:relative;font-weight:700;margin:0;margin-bottom:1rem;@media ", "{flex:0 0 30%;margin:0;}@media ", "{flex:0 0 calc(25% - 1rem);margin-right:1rem;margin-bottom:1rem;> span{padding:0;}}a{width:auto;padding:0;height:auto;position:relative;background-color:inherit;font-size:19px;line-height:40px;font-weight:700;@media ", "{font-size:20px;line-height:40px;}&:after{content:'\\2303';position:absolute;font-family:Arial;margin-left:4px;overflow:hidden;line-height:19px;font-size:23px;color:", ";font-weight:100;transition:transform 0.2s ease;transform:", ";top:", ";right:-25px;}@media ", "{cursor:default;display:inline;&:after{content:none;}}}"], _ref12 => {
   let {
     theme
   } = _ref12;

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

@@ -2,38 +2,64 @@
 
 exports[`renders correctly 1`] = `
 .c12 {
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
+  font-family: 'Anton',Impact,sans-serif;
+  font-weight: 400;
+  text-transform: uppercase;
+  -webkit-letter-spacing: 0;
+  -moz-letter-spacing: 0;
+  -ms-letter-spacing: 0;
+  letter-spacing: 0;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
 }
 
 .c15 {
-  color: #FFFFFF;
-  font-size: 1rem;
-  line-height: 1rem;
+  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-weight: bold;
-  line-height: normal;
+  color: #FFFFFF;
+}
+
+.c20 {
   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;
 }
 
 .c20 {
   color: #FFFFFF;
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  line-height: normal;
+}
+
+.c25 {
   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;
 }
 
 .c25 {
   color: #969598;
-  font-size: 1rem;
-  line-height: 1rem;
-  text-transform: inherit;
-  line-height: normal;
-  font-family: 'Montserrat',Helvetica,Arial,sans-serif;
 }
 
 .c10 {
@@ -258,7 +284,7 @@ exports[`renders correctly 1`] = `
   background-color: inherit;
   font-size: 19px;
   line-height: 40px;
-  font-weight: 800;
+  font-weight: 700;
 }
 
 .c14 a:after {
@@ -338,6 +364,62 @@ exports[`renders correctly 1`] = `
   border: 0;
 }
 
+@media (min-width:740px) {
+  .c12 {
+    font-size: 1.875rem;
+    line-height: 1.875rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c12 {
+    font-size: 2rem;
+    line-height: 2rem;
+  }
+}
+
+@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) {
+  .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) {
+  .c25 {
+    font-size: 1rem;
+    line-height: 1.25rem;
+  }
+}
+
+@media (min-width:1024px) {
+  .c25 {
+    font-size: 1.125rem;
+    line-height: 1.375rem;
+  }
+}
+
 @media (min-width:1150px) {
   .c9 {
     width: 72px;
@@ -657,7 +739,6 @@ exports[`renders correctly 1`] = `
           className="c12"
           color="inherit"
           id="footer-menu"
-          size="s"
         >
           Footer navigation
         </h2>
@@ -672,7 +753,6 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
-              size="s"
             >
               Hear from us
             </span>
@@ -695,7 +775,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Get the newsletter
                   </span>
@@ -715,7 +794,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     How we contact you
                   </span>
@@ -730,7 +808,6 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
-              size="s"
             >
               Get in touch
             </span>
@@ -753,7 +830,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Contact us
                   </span>
@@ -773,7 +849,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Your Gift Aid
                   </span>
@@ -793,7 +868,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     FAQs
                   </span>
@@ -813,7 +887,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Red Nose Day 2019 FAQs
                   </span>
@@ -828,7 +901,6 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
-              size="s"
             >
               About us
             </span>
@@ -851,7 +923,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Mission
                   </span>
@@ -871,7 +942,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Our history
                   </span>
@@ -891,7 +961,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Finances
                   </span>
@@ -911,7 +980,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Partners
                   </span>
@@ -931,7 +999,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Meet the team
                   </span>
@@ -951,7 +1018,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Sport Relief
                   </span>
@@ -966,7 +1032,6 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
-              size="s"
             >
               Careers
             </span>
@@ -989,7 +1054,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Working at Comic Relief
                   </span>
@@ -1009,7 +1073,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Open roles
                   </span>
@@ -1024,7 +1087,6 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
-              size="s"
             >
               News
             </span>
@@ -1047,7 +1109,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     News
                   </span>
@@ -1067,7 +1128,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Press area
                   </span>
@@ -1082,7 +1142,6 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
-              size="s"
             >
               Legal
             </span>
@@ -1105,7 +1164,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Link comp with both URL and Ref
                   </span>
@@ -1125,7 +1183,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Link comp with only Ref
                   </span>
@@ -1145,7 +1202,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Link comp with only URL
                   </span>
@@ -1170,7 +1226,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Test allowListed external link
                   </span>
@@ -1190,7 +1245,6 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
-                    size="s"
                   >
                     Test non-allowListed external link
                   </span>
@@ -1211,7 +1265,6 @@ exports[`renders correctly 1`] = `
         <p
           className="c25"
           color="grey"
-          size="s"
         >
           Comic Relief is the trading name of Charity Projects, a registered charity in England and Wales (326568) and Scotland (SC039730), which is a company limited by guarantee registered in England and Wales (01806414). Registered address: 6th Floor, The White Chapel Building, 10 Whitechapel High Street, London, E1 8QS.
         </p>