New color theme

src/assets/scripts/scripts.js

@@ -23,28 +23,6 @@ const onLoad = () => {
 		setTimeout(() => {
 			if (!window.Cookies || !window.FontFaceObserver) return;
 
-			// Handle Fonts
-			const fontRaleway = new FontFaceObserver("raleway"),
-				fontUnbounded = new FontFaceObserver("unbounded");
-			Promise.all([
-				fontRaleway.load(null, 5000),
-				fontUnbounded.load(null, 6000),
-			])
-				.then(() => {
-					if (
-						document.documentElement.className.indexOf(
-							"js-hasFontsLoaded"
-						) == -1
-					) {
-						document.documentElement.className +=
-							" js-hasFontsLoaded";
-					}
-					Cookies.set("fonts_loaded", true);
-				})
-				.catch((err) => {
-					console.log("Error!", err);
-				});
-
 			// Lazy-Load Media
 			if (typeof loadMedia === "function") {
 				loadMedia(".js-lazyLoader", null, true);

src/assets/styles/fonts.css

@@ -1,49 +1,49 @@
 @font-face {
 	font-family: "raleway";
-	src: url("/fonts/raleway/raleway-regular-webfont.woff2") format("woff2"),
-		url("/fonts/raleway/raleway-regular-webfont.woff") format("woff"),
-		url("/fonts/raleway/raleway-regular-webfont.ttf") format("truetype"),
-		url("/fonts/raleway/raleway-regular-webfont.eot");
+	src: local("Raleway"),
+		url("/fonts/raleway/raleway-regular-webfont.woff2") format("woff2"),
+		url("/fonts/raleway/raleway-regular-webfont.woff") format("woff");
 	font-weight: 400;
 	font-style: normal;
+	font-display: swap;
 }
 
 @font-face {
 	font-family: "raleway";
-	src: url("/fonts/raleway/raleway-italic-webfont.woff2") format("woff2"),
-		url("/fonts/raleway/raleway-italic-webfont.woff") format("woff"),
-		url("/fonts/raleway/raleway-italic-webfont.ttf") format("truetype"),
-		url("/fonts/raleway/raleway-italic-webfont.eot");
-	font-weight: 400;
-	font-style: italic;
-}
-
-@font-face {
-	font-family: "raleway";
-	src: url("/fonts/raleway/raleway-bold-webfont.woff2") format("woff2"),
-		url("/fonts/raleway/raleway-bold-webfont.woff") format("woff"),
-		url("/fonts/raleway/raleway-bold-webfont.ttf") format("truetype"),
-		url("/fonts/raleway/raleway-bold-webfont.eot");
+	src: local("Raleway Bold"), local("Raleway-Bold"),
+		url("/fonts/raleway/raleway-bold-webfont.woff2") format("woff2"),
+		url("/fonts/raleway/raleway-bold-webfont.woff") format("woff");
 	font-weight: 700;
 	font-style: normal;
+	font-display: swap;
 }
 
 @font-face {
 	font-family: "raleway";
-	src: url("/fonts/raleway/raleway-bolditalic-webfont.woff2") format("woff2"),
-		url("/fonts/raleway/raleway-bolditalic-webfont.woff") format("woff"),
-		url("/fonts/raleway/raleway-bolditalic-webfont.ttf") format("truetype"),
-		url("/fonts/raleway/raleway-bolditalic-webfont.eot");
+	src: local("Raleway Italic"), local("Raleway-Italic"),
+		url("/fonts/raleway/raleway-italic-webfont.woff2") format("woff2"),
+		url("/fonts/raleway/raleway-italic-webfont.woff") format("woff");
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+}
+
+@font-face {
+	font-family: "raleway";
+	src: local("Raleway Bold Italic"), local("Raleway-BoldItalic"),
+		url("/fonts/raleway/raleway-bolditalic-webfont.woff2") format("woff2"),
+		url("/fonts/raleway/raleway-bolditalic-webfont.woff") format("woff");
 	font-weight: 700;
 	font-style: italic;
+	font-display: swap;
 }
 
 @font-face {
 	font-family: "unbounded";
-	src: url("/fonts/unbounded/unbounded-medium-webfont.woff2") format("woff2"),
-		url("/fonts/unbounded/unbounded-medium-webfont.woff") format("woff"),
-		url("/fonts/unbounded/unbounded-medium-webfont.ttf") format("truetype"),
-		url("/fonts/unbounded/unbounded-medium-webfont.eot");
+	src: local("Unbounded"),
+		url("/fonts/unbounded/unbounded-medium-webfont.woff2") format("woff2"),
+		url("/fonts/unbounded/unbounded-medium-webfont.woff") format("woff");
 	font-weight: 500;
 	font-style: normal;
+	font-display: swap;
 }