allow sans headlines to be larger

Author: cemms1

dotcom-rendering/src/components/CardHeadline.tsx

@@ -16,10 +16,16 @@ import {
 	textSans15,
 	textSans17,
 	textSans20,
+	textSans24,
+	textSans28,
+	textSans34,
 	textSansBold12,
 	textSansBold15,
 	textSansBold17,
 	textSansBold20,
+	textSansBold24,
+	textSansBold28,
+	textSansBold34,
 	until,
 } from '@guardian/source/foundations';
 import { Link, SvgExternal } from '@guardian/source/react-components';
@@ -102,12 +108,12 @@ const fontFamilies = {
 	 * Line height for sans style headlines for labs is overridden to match that of other headlines (1.15)
 	 */
 	textSansBold: {
-		xxxlarge: `${textSansBold20}\n\tline-height: 1.15;\n`,
-		xxlarge: `${textSansBold20}\n\tline-height: 1.15;\n`,
-		xlarge: `${textSansBold20}\n\tline-height: 1.15;\n`,
-		large: `${textSansBold20}\n\tline-height: 1.15;\n`,
-		medium: `${textSansBold20}\n\tline-height: 1.15;\n`,
-		small: `${textSansBold20}\n\tline-height: 1.15;\n`,
+		xxxlarge: `${textSansBold34}\n\tline-height: 1.15;\n`,
+		xxlarge: `${textSansBold34}\n\tline-height: 1.15;\n`,
+		xlarge: `${textSansBold34}\n\tline-height: 1.15;\n`,
+		large: `${textSansBold34}\n\tline-height: 1.15;\n`,
+		medium: `${textSansBold28}\n\tline-height: 1.15;\n`,
+		small: `${textSansBold24}\n\tline-height: 1.15;\n`,
 		xsmall: `${textSansBold20}\n\tline-height: 1.15;\n`,
 		xxsmall: `${textSansBold17}\n\tline-height: 1.15;\n`,
 		xxxsmall: `${textSansBold15}\n\tline-height: 1.15;\n`,
@@ -118,12 +124,12 @@ const fontFamilies = {
 	 * Line height for sans style headlines for labs is overridden to match that of other headlines (1.15)
 	 */
 	textSans: {
-		xxxlarge: `${textSans20}\n\tline-height: 1.15;\n`,
-		xxlarge: `${textSans20}\n\tline-height: 1.15;\n`,
-		xlarge: `${textSans20}\n\tline-height: 1.15;\n`,
-		large: `${textSans20}\n\tline-height: 1.15;\n`,
-		medium: `${textSans20}\n\tline-height: 1.15;\n`,
-		small: `${textSans20}\n\tline-height: 1.15;\n`,
+		xxxlarge: `${textSans34}\n\tline-height: 1.15;\n`,
+		xxlarge: `${textSans34}\n\tline-height: 1.15;\n`,
+		xlarge: `${textSans34}\n\tline-height: 1.15;\n`,
+		large: `${textSans34}\n\tline-height: 1.15;\n`,
+		medium: `${textSans28}\n\tline-height: 1.15;\n`,
+		small: `${textSans24}\n\tline-height: 1.15;\n`,
 		xsmall: `${textSans20}\n\tline-height: 1.15;\n`,
 		xxsmall: `${textSans17}\n\tline-height: 1.15;\n`,
 		xxxsmall: `${textSans15}\n\tline-height: 1.15;\n`,