@comicrelief/component-library 8.44.1 → 8.44.3

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

@@ -21,6 +21,11 @@ exports[`renders correctly 1`] = `
   text-transform: uppercase;
 }
 
+.c1 span {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 .c4 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
   font-weight: 400;
@@ -33,6 +38,11 @@ exports[`renders correctly 1`] = `
   line-height: 1.25rem;
 }
 
+.c4 span {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 .c15 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;

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

@@ -44,7 +44,8 @@ const Footer = _ref => {
     overrideallowList: overrideallowList
   }, rest)), showFundraisingRegulatorLogo && /*#__PURE__*/_react.default.createElement(_FundraisingRegulatorLogo.default, null), /*#__PURE__*/_react.default.createElement(_Footer.FooterCopyright, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
     tag: "p",
-    color: "grey"
+    color: "grey",
+    size: "s"
   }, footerCopy)))));
 };
 var _default = exports.default = Footer;

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

@@ -58,7 +58,8 @@ const FooterNav = _ref => {
     role: "navigation"
   }, /*#__PURE__*/_react.default.createElement(_Text.default, {
     id: "footer-menu",
-    tag: "h2"
+    tag: "h2",
+    size: "s"
   }, "Footer navigation"), /*#__PURE__*/_react.default.createElement(_Nav.NavMenu, {
     role: "menubar"
   }, menuGroups.map((group, index) => /*#__PURE__*/_react.default.createElement(_Nav.NavItem, {
@@ -68,7 +69,8 @@ const FooterNav = _ref => {
     isSubMenuOpen: !!isSubMenuOpen[group.id]
   }, !isSmallBreakpoint ? /*#__PURE__*/_react.default.createElement(_Text.default, {
     color: "white",
-    weight: "bold"
+    weight: "bold",
+    size: "s"
   }, group.title) : /*#__PURE__*/_react.default.createElement(_Nav.NavLink, Object.assign({
     href: "#",
     inline: true,
@@ -77,7 +79,8 @@ const FooterNav = _ref => {
     role: "button",
     onClick: toggleSubMenu(group.id)
   }, rest), /*#__PURE__*/_react.default.createElement(_Text.default, {
-    color: "white"
+    color: "white",
+    size: "s"
   }, group.title)), group.links && group.links.length > 0 && /*#__PURE__*/_react.default.createElement(_Nav.SubNavMenu, {
     role: "list",
     "aria-label": group.title,
@@ -95,7 +98,8 @@ const FooterNav = _ref => {
       inline: true,
       role: "menuitem"
     }, rest), /*#__PURE__*/_react.default.createElement(_Text.default, {
-      color: "white"
+      color: "white",
+      size: "s"
     }, child.title)));
   }))))));
 };

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

@@ -13,6 +13,16 @@ exports[`renders correctly 1`] = `
   line-height: 1.5rem;
 }
 
+.c12 {
+  font-size: 1rem;
+  line-height: normal;
+}
+
+.c12 span {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 .c15 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
   font-weight: 400;
@@ -26,10 +36,17 @@ exports[`renders correctly 1`] = `
 }
 
 .c15 {
+  font-size: 1rem;
+  line-height: normal;
   font-weight: bold;
   color: #FFFFFF;
 }
 
+.c15 span {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 .c20 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
   font-weight: 400;
@@ -43,9 +60,16 @@ exports[`renders correctly 1`] = `
 }
 
 .c20 {
+  font-size: 1rem;
+  line-height: normal;
   color: #FFFFFF;
 }
 
+.c20 span {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 .c25 {
   font-family: 'Montserrat',Helvetica,Arial,sans-serif;
   font-weight: 400;
@@ -59,9 +83,16 @@ exports[`renders correctly 1`] = `
 }
 
 .c25 {
+  font-size: 1rem;
+  line-height: normal;
   color: #969598;
 }
 
+.c25 span {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 .c10 {
   object-fit: cover;
   width: 100%;
@@ -739,6 +770,7 @@ exports[`renders correctly 1`] = `
           className="c12"
           color="inherit"
           id="footer-menu"
+          size="s"
         >
           Footer navigation
         </h2>
@@ -753,6 +785,7 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
+              size="s"
             >
               Hear from us
             </span>
@@ -775,6 +808,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Get the newsletter
                   </span>
@@ -794,6 +828,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     How we contact you
                   </span>
@@ -808,6 +843,7 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
+              size="s"
             >
               Get in touch
             </span>
@@ -830,6 +866,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Contact us
                   </span>
@@ -849,6 +886,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Your Gift Aid
                   </span>
@@ -868,6 +906,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     FAQs
                   </span>
@@ -887,6 +926,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Red Nose Day 2019 FAQs
                   </span>
@@ -901,6 +941,7 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
+              size="s"
             >
               About us
             </span>
@@ -923,6 +964,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Mission
                   </span>
@@ -942,6 +984,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Our history
                   </span>
@@ -961,6 +1004,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Finances
                   </span>
@@ -980,6 +1024,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Partners
                   </span>
@@ -999,6 +1044,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Meet the team
                   </span>
@@ -1018,6 +1064,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Sport Relief
                   </span>
@@ -1032,6 +1079,7 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
+              size="s"
             >
               Careers
             </span>
@@ -1054,6 +1102,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Working at Comic Relief
                   </span>
@@ -1073,6 +1122,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Open roles
                   </span>
@@ -1087,6 +1137,7 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
+              size="s"
             >
               News
             </span>
@@ -1109,6 +1160,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     News
                   </span>
@@ -1128,6 +1180,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Press area
                   </span>
@@ -1142,6 +1195,7 @@ exports[`renders correctly 1`] = `
             <span
               className="c15"
               color="white"
+              size="s"
             >
               Legal
             </span>
@@ -1164,6 +1218,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Link comp with both URL and Ref
                   </span>
@@ -1183,6 +1238,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Link comp with only Ref
                   </span>
@@ -1202,6 +1258,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Link comp with only URL
                   </span>
@@ -1226,6 +1283,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Test allowListed external link
                   </span>
@@ -1245,6 +1303,7 @@ exports[`renders correctly 1`] = `
                   <span
                     className="c20"
                     color="white"
+                    size="s"
                   >
                     Test non-allowListed external link
                   </span>
@@ -1265,6 +1324,7 @@ 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>

package/dist/components/Organisms/Header/HeaderNav/HeaderNav.js

@@ -83,7 +83,8 @@ const HeaderNav = _ref => {
     role: "navigation"
   }, /*#__PURE__*/_react.default.createElement(_Text.default, {
     id: "main-menu",
-    tag: "h2"
+    tag: "h2",
+    size: "s"
   }, "Main navigation"), /*#__PURE__*/_react.default.createElement(_HeaderNav.NavMenu, {
     role: "menubar"
   }, theseGroups.map((group, index) => {

package/dist/components/Organisms/Header/Nav/Nav.js

@@ -63,7 +63,8 @@ const MainNav = _ref => {
     role: "navigation"
   }, /*#__PURE__*/_react.default.createElement(_Text.default, {
     id: "main-menu",
-    tag: "h2"
+    tag: "h2",
+    size: "s"
   }, "Main navigation"), /*#__PURE__*/_react.default.createElement(_Nav.NavMenu, {
     role: "menubar"
   }, menuGroups.map((group, index) => {

package/dist/components/Organisms/Header2025/HeaderNav2025/HeaderNav2025.js

@@ -123,7 +123,8 @@ const HeaderNav2025 = _ref => {
     id: "main-nav"
   }, /*#__PURE__*/_react.default.createElement(_Text.default, {
     id: "main-menu",
-    tag: "h2"
+    tag: "h2",
+    size: "s"
   }, "Main navigation"), processedItems &&
   /*#__PURE__*/
   // First level of the navigation (ul tag): Parent

package/dist/components/Organisms/Header2025/HeaderNav2025/HeaderNav2025.style.js

@@ -16,7 +16,7 @@ const transitionDuration = 0.2;
 const NavLinkClass = (0, _styledComponents.default)(_Link.default).withConfig({
   displayName: "HeaderNav2025style__NavLinkClass",
   componentId: "sc-xflhtq-0"
-})(["display:inline-block;border:0;padding:25px;line-height:1rem;height:auto;font-weight:700;width:100%;color:", ";transition:color ", "s ease;text-decoration:none;:hover,:focus,:focus-within{border:0;}@media ", "{:hover,:focus{color:", ";background-color:", ";font-weight:inherit;}:focus-within{background-color:", ";&:hover{background-color:", ";}}}> div{height:auto;transition:transform 0.35s cubic-bezier(0.41,1.64,0.41,0.8);", "}"], _ref => {
+})(["display:inline-block;border:0;padding:25px;line-height:1rem;height:auto;font-weight:700;width:100%;color:", ";transition:color ", "s ease;text-decoration:none;:hover,:focus,:focus-within{border:0;}@media ", "{:hover,:focus{color:", ";background-color:", ";font-weight:700;}:focus-within{background-color:", ";&:hover{background-color:", ";}}}> div{height:auto;transition:transform 0.35s cubic-bezier(0.41,1.64,0.41,0.8);", "}"], _ref => {
   let {
     theme
   } = _ref;

package/dist/components/Organisms/Header2025/HeaderNav2025/HeaderNavItem2025.js

@@ -73,7 +73,9 @@ const HeaderNavItem2025 = _ref => {
       href: thisSubUrl,
       inline: true,
       role: "menuitem"
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, null, child.title)));
+    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+      size: "s"
+    }, child.title)));
   })));
 };
 var _default = exports.default = HeaderNavItem2025;

package/dist/components/Organisms/MarketingPreferencesDS/MarketingPreferencesDSForm.js

@@ -76,7 +76,8 @@ const MarketingPreferencesDSForm = () => {
   } = formMethodsCustom;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
     tag: "p",
-    weight: "bold"
+    weight: "bold",
+    size: "s"
   }, "Our default instance:"), /*#__PURE__*/_react.default.createElement(_reactHookForm.FormProvider, formMethods, /*#__PURE__*/_react.default.createElement("form", {
     onSubmit: handleSubmit(customSubmitHandler),
     noValidate: true
@@ -91,7 +92,8 @@ const MarketingPreferencesDSForm = () => {
     size: "xl"
   }, "- - - - - - - - - - - - - "), /*#__PURE__*/_react.default.createElement(_Text.default, {
     tag: "p",
-    weight: "bold"
+    weight: "bold",
+    size: "s"
   }, "Our customised instance:"), /*#__PURE__*/_react.default.createElement(_reactHookForm.FormProvider, formMethodsCustom, /*#__PURE__*/_react.default.createElement("form", {
     onSubmit: handleSubmitCustom(customSubmitHandler),
     noValidate: true

package/dist/components/Organisms/Membership/Form/Form.js

@@ -122,7 +122,8 @@ const Signup = _ref => {
   return /*#__PURE__*/_react.default.createElement(_Membership2.FormWrapper, null, /*#__PURE__*/_react.default.createElement(_Membership2.Form, {
     onSubmit: e => submitDonation(e, amountDonate, clientID, cartID, mbshipID, donateLink)
   }, /*#__PURE__*/_react.default.createElement(_Membership2.OuterFieldset, null, /*#__PURE__*/_react.default.createElement(_Membership2.Legend, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
-    tag: "h3"
+    tag: "h3",
+    size: "s"
   }, "Choose your monthly donation")), /*#__PURE__*/_react.default.createElement(_Membership2.MoneyBuys, null, MoneyBoxes), /*#__PURE__*/_react.default.createElement(_Membership2.FormFieldset, null, /*#__PURE__*/_react.default.createElement(_Membership2.Label, {
     size: "s",
     weight: "500"

package/dist/components/Organisms/Membership/Membership.js

@@ -43,7 +43,8 @@ const Membership = _ref => {
     size: "l",
     weight: "800"
   }, title), /*#__PURE__*/_react.default.createElement(_Text.default, {
-    tag: "p"
+    tag: "p",
+    size: "s"
   }, subtitle)), /*#__PURE__*/_react.default.createElement(_Form.default, {
     data: data,
     otherDescription: otherDescription,