@ongov/ontario-design-system-component-library 5.0.0 → 6.0.0-alpha.1

package/src/components/ontario-radio-buttons/ontario-radio-buttons.scss

@@ -54,7 +54,7 @@ $ontario-input-offset: math.div((globalVariables.$touch-target-size - $ontario-r
 	cursor: pointer;
 	color: colours.$ontario-colour-black;
 	display: inline-block;
-	font-family: fonts.$ontario-font-raleway;
+	font-family: fonts.$ontario-font-raleway-modified;
 	font-size: fontSizes.$ontario-font-size-standard-body-text;
 	font-weight: fontWeights.$ontario-font-weights-bold;
 	line-height: globalVariables.$line-height-default;

package/www/build/ontario-design-system-components.css

@@ -19,7 +19,7 @@ h1,
 	text-rendering: optimizeLegibility;
 	margin-bottom: 1rem;
 	font-feature-settings: normal;
-	font-family: 'Raleway', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	font-family: 'Raleway Modified', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }
 h1 > .ontario-label--heading,
 .ontario-fieldset__legend--large h1,
@@ -781,8 +781,9 @@ h6,
 		url('../../../fonts/courier-prime-400/courier-prime-400.woff2') format('woff2'),
 		url('../../../fonts/courier-prime-400/courier-prime-400.otf') format('opentype'),
 		url('../../../fonts/courier-prime-400/courier-prime-400.ttf') format('truetype'),
+		local('Courier Prime Regular'),
 		local('Courier Prime'),
-		local('Courier-prime-regular');
+		local('CourierPrime-Regular');
 }
 @font-face {
 	font-family: 'Courier Prime';
@@ -794,7 +795,8 @@ h6,
 		url('../../../fonts/courier-prime-400--italic/courier-prime-400--italic.otf') format('opentype'),
 		url('../../../fonts/courier-prime-400--italic/courier-prime-400--italic.ttf') format('truetype'),
 		local('Courier Prime Italic'),
-		local('Courier-prime-italic');
+		local('Courier Prime'),
+		local('CourierPrime-Italic');
 }
 @font-face {
 	font-family: 'Courier Prime';
@@ -806,7 +808,8 @@ h6,
 		url('../../../fonts/courier-prime-700/courier-prime-700.otf') format('opentype'),
 		url('../../../fonts/courier-prime-700/courier-prime-700.ttf') format('truetype'),
 		local('Courier Prime Bold'),
-		local('Courier-prime-bold');
+		local('Courier Prime'),
+		local('CourierPrime-Bold');
 }
 @font-face {
 	font-family: 'Courier Prime';
@@ -818,7 +821,8 @@ h6,
 		url('../../../fonts/courier-prime-700--italic/courier-prime-700--italic.otf') format('opentype'),
 		url('../../../fonts/courier-prime-700--italic/courier-prime-700--italic.ttf') format('truetype'),
 		local('Courier Prime Bold Italic'),
-		local('Courier-prime-bold-italic');
+		local('Courier Prime'),
+		local('CourierPrime-BoldItalic');
 }
 @font-face {
 	font-family: 'Open Sans';
@@ -830,7 +834,8 @@ h6,
 		url('../../../fonts/open-sans-300/open-sans-300.otf') format('opentype'),
 		url('../../../fonts/open-sans-300/open-sans-300.ttf') format('truetype'),
 		local('Open Sans Light'),
-		local('Open-Sans-300');
+		local('Open Sans Light'),
+		local('OpenSans-Light');
 }
 @font-face {
 	font-family: 'Open Sans';
@@ -842,7 +847,8 @@ h6,
 		url('../../../fonts/open-sans-300--italic/open-sans-300--italic.otf') format('opentype'),
 		url('../../../fonts/open-sans-300--italic/open-sans-300--italic.ttf') format('truetype'),
 		local('Open Sans Light Italic'),
-		local('Open-Sans-300-italic');
+		local('Open Sans Light'),
+		local('OpenSans-LightItalic');
 }
 @font-face {
 	font-family: 'Open Sans';
@@ -853,8 +859,48 @@ h6,
 		url('../../../fonts/open-sans-400/open-sans-400.woff2') format('woff2'),
 		url('../../../fonts/open-sans-400/open-sans-400.otf') format('opentype'),
 		url('../../../fonts/open-sans-400/open-sans-400.ttf') format('truetype'),
+		local('Open Sans Regular'),
+		local('Open Sans'),
+		local('OpenSans-Regular');
+}
+@font-face {
+	font-family: 'Open Sans';
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/open-sans-400--italic/open-sans-400--italic.woff2') format('woff2'),
+		url('../../../fonts/open-sans-400--italic/open-sans-400--italic.otf') format('opentype'),
+		url('../../../fonts/open-sans-400--italic/open-sans-400--italic.ttf') format('truetype'),
+		local('Open Sans Italic'),
 		local('Open Sans'),
-		local('Open-Sans-regular');
+		local('OpenSans-Italic');
+}
+@font-face {
+	font-family: 'Open Sans';
+	font-weight: 500;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/open-sans-500/open-sans-500.woff2') format('woff2'),
+		url('../../../fonts/open-sans-500/open-sans-500.otf') format('opentype'),
+		url('../../../fonts/open-sans-500/open-sans-500.ttf') format('truetype'),
+		local('Open Sans Medium'),
+		local('Open Sans Medium'),
+		local('OpenSans-Medium');
+}
+@font-face {
+	font-family: 'Open Sans';
+	font-weight: 500;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/open-sans-500--italic/open-sans-500--italic.woff2') format('woff2'),
+		url('../../../fonts/open-sans-500--italic/open-sans-500--italic.otf') format('opentype'),
+		url('../../../fonts/open-sans-500--italic/open-sans-500--italic.ttf') format('truetype'),
+		local('Open Sans Medium Italic'),
+		local('Open Sans Medium'),
+		local('OpenSans-MediumItalic');
 }
 @font-face {
 	font-family: 'Open Sans';
@@ -865,31 +911,35 @@ h6,
 		url('../../../fonts/open-sans-600/open-sans-600.woff2') format('woff2'),
 		url('../../../fonts/open-sans-600/open-sans-600.otf') format('opentype'),
 		url('../../../fonts/open-sans-600/open-sans-600.ttf') format('truetype'),
-		local('Open Sans Semibold'),
-		local('Open-Sans-600');
+		local('Open Sans SemiBold'),
+		local('Open Sans SemiBold'),
+		local('OpenSans-SemiBold');
 }
 @font-face {
 	font-family: 'Open Sans';
-	font-weight: 400;
+	font-weight: 600;
 	font-style: italic;
 	font-display: swap;
 	src:
-		url('../../../fonts/open-sans-400--italic/open-sans-400--italic.woff2') format('woff2'),
-		url('../../../fonts/open-sans-400--italic/open-sans-400--italic.otf') format('opentype'),
-		url('../../../fonts/open-sans-400--italic/open-sans-400--italic.ttf') format('truetype'),
-		local('Open Sans Italic'),
-		local('Open-Sans-italic');
+		url('../../../fonts/open-sans-600--italic/open-sans-600--italic.woff2') format('woff2'),
+		url('../../../fonts/open-sans-600--italic/open-sans-600--italic.otf') format('opentype'),
+		url('../../../fonts/open-sans-600--italic/open-sans-600--italic.ttf') format('truetype'),
+		local('Open Sans SemiBold Italic'),
+		local('Open Sans SemiBold'),
+		local('OpenSans-SemiBoldItalic');
 }
 @font-face {
 	font-family: 'Open Sans';
 	font-weight: 700;
+	font-style: normal;
 	font-display: swap;
 	src:
 		url('../../../fonts/open-sans-700/open-sans-700.woff2') format('woff2'),
 		url('../../../fonts/open-sans-700/open-sans-700.otf') format('opentype'),
 		url('../../../fonts/open-sans-700/open-sans-700.ttf') format('truetype'),
 		local('Open Sans Bold'),
-		local('Open-Sans-700');
+		local('Open Sans'),
+		local('OpenSans-Bold');
 }
 @font-face {
 	font-family: 'Open Sans';
@@ -901,10 +951,89 @@ h6,
 		url('../../../fonts/open-sans-700--italic/open-sans-700--italic.otf') format('opentype'),
 		url('../../../fonts/open-sans-700--italic/open-sans-700--italic.ttf') format('truetype'),
 		local('Open Sans Bold Italic'),
-		local('Open-Sans-bold-italic');
+		local('Open Sans'),
+		local('OpenSans-BoldItalic');
+}
+@font-face {
+	font-family: 'Open Sans';
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/open-sans-800/open-sans-800.woff2') format('woff2'),
+		url('../../../fonts/open-sans-800/open-sans-800.otf') format('opentype'),
+		url('../../../fonts/open-sans-800/open-sans-800.ttf') format('truetype'),
+		local('Open Sans ExtraBold'),
+		local('Open Sans ExtraBold'),
+		local('OpenSans-ExtraBold');
+}
+@font-face {
+	font-family: 'Open Sans';
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/open-sans-800--italic/open-sans-800--italic.woff2') format('woff2'),
+		url('../../../fonts/open-sans-800--italic/open-sans-800--italic.otf') format('opentype'),
+		url('../../../fonts/open-sans-800--italic/open-sans-800--italic.ttf') format('truetype'),
+		local('Open Sans ExtraBold Italic'),
+		local('Open Sans ExtraBold'),
+		local('OpenSans-ExtraBoldItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 100;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-100/raleway-modified-100.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-100/raleway-modified-100.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-100/raleway-modified-100.ttf') format('truetype'),
+		local('Raleway Modified Thin'),
+		local('Raleway Modified'),
+		local('RalewayModified-Thin');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 100;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-100--italic/raleway-modified-100--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-100--italic/raleway-modified-100--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-100--italic/raleway-modified-100--italic.ttf') format('truetype'),
+		local('Raleway Modified Thin Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-ThinItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 200;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-200/raleway-modified-200.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-200/raleway-modified-200.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-200/raleway-modified-200.ttf') format('truetype'),
+		local('Raleway Modified ExtraLight'),
+		local('Raleway Modified'),
+		local('RalewayModified-ExtraLight');
 }
 @font-face {
-	font-family: 'Raleway';
+	font-family: 'Raleway Modified';
+	font-weight: 200;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-200--italic/raleway-modified-200--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-200--italic/raleway-modified-200--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-200--italic/raleway-modified-200--italic.ttf') format('truetype'),
+		local('Raleway Modified ExtraLight Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-ExtraLightItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
 	font-weight: 300;
 	font-style: normal;
 	font-display: swap;
@@ -912,11 +1041,12 @@ h6,
 		url('../../../fonts/raleway-modified-300/raleway-modified-300.woff2') format('woff2'),
 		url('../../../fonts/raleway-modified-300/raleway-modified-300.otf') format('opentype'),
 		url('../../../fonts/raleway-modified-300/raleway-modified-300.ttf') format('truetype'),
-		local('Raleway Light'),
-		local('Raleway-300');
+		local('Raleway Modified Light'),
+		local('Raleway Modified'),
+		local('RalewayModified-Light');
 }
 @font-face {
-	font-family: 'Raleway';
+	font-family: 'Raleway Modified';
 	font-weight: 300;
 	font-style: italic;
 	font-display: swap;
@@ -924,11 +1054,12 @@ h6,
 		url('../../../fonts/raleway-modified-300--italic/raleway-modified-300--italic.woff2') format('woff2'),
 		url('../../../fonts/raleway-modified-300--italic/raleway-modified-300--italic.otf') format('opentype'),
 		url('../../../fonts/raleway-modified-300--italic/raleway-modified-300--italic.ttf') format('truetype'),
-		local('Raleway Light Italic'),
-		local('Raleway-300-italic');
+		local('Raleway Modified Light Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-LightItalic');
 }
 @font-face {
-	font-family: 'Raleway';
+	font-family: 'Raleway Modified';
 	font-weight: 400;
 	font-style: normal;
 	font-display: swap;
@@ -936,11 +1067,51 @@ h6,
 		url('../../../fonts/raleway-modified-400/raleway-modified-400.woff2') format('woff2'),
 		url('../../../fonts/raleway-modified-400/raleway-modified-400.otf') format('opentype'),
 		url('../../../fonts/raleway-modified-400/raleway-modified-400.ttf') format('truetype'),
-		local('Raleway'),
-		local('Raleway-400');
+		local('Raleway Modified Regular'),
+		local('Raleway Modified'),
+		local('RalewayModified-Regular');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-400--italic/raleway-modified-400--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-400--italic/raleway-modified-400--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-400--italic/raleway-modified-400--italic.ttf') format('truetype'),
+		local('Raleway Modified Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-Italic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 500;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-500/raleway-modified-500.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-500/raleway-modified-500.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-500/raleway-modified-500.ttf') format('truetype'),
+		local('Raleway Modified Medium'),
+		local('Raleway Modified'),
+		local('RalewayModified-Medium');
 }
 @font-face {
-	font-family: 'Raleway';
+	font-family: 'Raleway Modified';
+	font-weight: 500;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-500--italic/raleway-modified-500--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-500--italic/raleway-modified-500--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-500--italic/raleway-modified-500--italic.ttf') format('truetype'),
+		local('Raleway Modified Medium Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-MediumItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
 	font-weight: 600;
 	font-style: normal;
 	font-display: swap;
@@ -948,11 +1119,25 @@ h6,
 		url('../../../fonts/raleway-modified-600/raleway-modified-600.woff2') format('woff2'),
 		url('../../../fonts/raleway-modified-600/raleway-modified-600.otf') format('opentype'),
 		url('../../../fonts/raleway-modified-600/raleway-modified-600.ttf') format('truetype'),
-		local('Raleway SemiBold'),
-		local('Raleway-600');
+		local('Raleway Modified SemiBold'),
+		local('Raleway Modified'),
+		local('RalewayModified-SemiBold');
 }
 @font-face {
-	font-family: 'Raleway';
+	font-family: 'Raleway Modified';
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-600--italic/raleway-modified-600--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-600--italic/raleway-modified-600--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-600--italic/raleway-modified-600--italic.ttf') format('truetype'),
+		local('Raleway Modified SemiBold Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-SemiBoldItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
 	font-weight: 700;
 	font-style: normal;
 	font-display: swap;
@@ -960,8 +1145,74 @@ h6,
 		url('../../../fonts/raleway-modified-700/raleway-modified-700.woff2') format('woff2'),
 		url('../../../fonts/raleway-modified-700/raleway-modified-700.otf') format('opentype'),
 		url('../../../fonts/raleway-modified-700/raleway-modified-700.ttf') format('truetype'),
-		local('Raleway Bold'),
-		local('Raleway-700');
+		local('Raleway Modified Bold'),
+		local('Raleway Modified'),
+		local('RalewayModified-Bold');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-700--italic/raleway-modified-700--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-700--italic/raleway-modified-700--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-700--italic/raleway-modified-700--italic.ttf') format('truetype'),
+		local('Raleway Modified Bold Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-BoldItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-800/raleway-modified-800.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-800/raleway-modified-800.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-800/raleway-modified-800.ttf') format('truetype'),
+		local('Raleway Modified ExtraBold'),
+		local('Raleway Modified'),
+		local('RalewayModified-ExtraBold');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-800--italic/raleway-modified-800--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-800--italic/raleway-modified-800--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-800--italic/raleway-modified-800--italic.ttf') format('truetype'),
+		local('Raleway Modified ExtraBold Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-ExtraBoldItalic');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 900;
+	font-style: normal;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-900/raleway-modified-900.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-900/raleway-modified-900.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-900/raleway-modified-900.ttf') format('truetype'),
+		local('Raleway Modified Black'),
+		local('Raleway Modified'),
+		local('RalewayModified-Black');
+}
+@font-face {
+	font-family: 'Raleway Modified';
+	font-weight: 900;
+	font-style: italic;
+	font-display: swap;
+	src:
+		url('../../../fonts/raleway-modified-900--italic/raleway-modified-900--italic.woff2') format('woff2'),
+		url('../../../fonts/raleway-modified-900--italic/raleway-modified-900--italic.otf') format('opentype'),
+		url('../../../fonts/raleway-modified-900--italic/raleway-modified-900--italic.ttf') format('truetype'),
+		local('Raleway Modified Black Italic'),
+		local('Raleway Modified'),
+		local('RalewayModified-BlackItalic');
 }
 html {
 	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
@@ -2592,7 +2843,7 @@ p + ol {
 }
 .ontario-fieldset__legend {
 	color: #1a1a1a;
-	font-family: 'Raleway', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	font-family: 'Raleway Modified', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 	font-size: 1.1875rem;
 	font-weight: 700;
 	margin: 0 0 1rem 0;
@@ -2649,7 +2900,7 @@ p + ol {
 .ontario-label {
 	cursor: pointer;
 	color: #1a1a1a;
-	font-family: 'Raleway', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	font-family: 'Raleway Modified', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 	font-size: 1.1875rem;
 	font-weight: 700;
 	line-height: 1.5;