Some edits to improve open dyslexic font script

_includes/head.html

@@ -81,5 +81,5 @@
 	<script src="{{ '/site/assets/vendor/leaflet@1.6.0/leaflet.js' | static_url }}"></script>
 
 	<!-- OpenDyslexic script -->
-	<script src="{{ '/assets/js/special_font.js' | relative_url }}"></script>
+	<script src="{{ '/assets/js/dyslexic_font.js' | relative_url }}"></script>
 </head>

assets/_sass/modules/_dyslexic_font.scss

+@font-face {
+	font-family: OpenDyslexic;
+	src: url('https://static.poul.org/site/assets/fonts/opendyslexic/compiled/OpenDyslexic-Regular.otf') format('opentype');
+}
+
+@font-face {
+	font-family: OpenDyslexic;
+	font-weight: bold;
+	src: url('https://static.poul.org/site/assets/fonts/opendyslexic/compiled/OpenDyslexic-Bold.otf') format('opentype');
+}
+
+@font-face {
+	font-family: OpenDyslexic;
+	font-style: italic;
+	src: url('https://static.poul.org/site/assets/fonts/opendyslexic/compiled/OpenDyslexic-Italic.otf') format('opentype');
+}
+
+.opendyslexic {
+	&, p, a, span, h1, h2, h3 {
+		font-family: 'OpenDyslexic' !important;
+	}
+}
\ No newline at end of file

assets/_sass/pages/_coding_gym.scss

@@ -28,7 +28,6 @@
 		font-size: 1em;
 		padding: 20px;
 		line-height: 1;
-		font-family: sans-serif;
 		text-align: center;
 
 		> div {

assets/_sass/partials/_typography.scss

@@ -12,7 +12,6 @@ body {
 
 h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
 	margin: .5rem 0 1.5rem;
-	font-family: $sans-serif;
 }
 
 // Headings

assets/css/style.scss

@@ -28,6 +28,7 @@
 @import "modules/post";
 @import "modules/hq_map";
 @import "modules/bits";
+@import "modules/dyslexic_font";
 
 // Layout
 @import "layout/layout";

assets/js/dyslexic_font.js

+"use strict";
+
+document.addEventListener('DOMContentLoaded', () => {
+    document.querySelector("#fix-open-dyslexic-link").addEventListener("click", (e) => {
+        e.preventDefault();
+
+        if (document.body.classList.contains("opendyslexic")) {
+            document.body.classList.remove("opendyslexic");
+            document.getElementById('fix-open-dyslexic-link').innerHTML = 'Enable futuristic font'
+        } else {
+            document.body.classList.add("opendyslexic");
+            document.getElementById('fix-open-dyslexic-link').innerHTML = 'Disable futuristic font'
+        }
+    });
+});
\ No newline at end of file

assets/js/special_font.js

----
----
-"use strict";
-
-const font_path_regular = "{{ 'site/assets/fonts/opendyslexic/compiled/OpenDyslexic-Regular.otf' | static_url }}";
-const font_path_bold = "{{ 'site/assets/fonts/opendyslexic/compiled/OpenDyslexic-Bold.otf' | static_url }}";
-const font_path_italic = "{{ 'site/assets/fonts/opendyslexic/compiled/OpenDyslexic-Italic.otf' | static_url }}";
-
-var __opendyslexic_loaded = false;
-
-document.addEventListener('DOMContentLoaded', () => {
-    document.querySelector("#fix-open-dyslexic-link").addEventListener("click", () => {
-        if (!__opendyslexic_loaded) {
-            let od_font = document.createElement('style');
-
-            od_font.appendChild(document.createTextNode(
-                // font-face
-                `@font-face { font-family: OpenDyslexic; src: url('${font_path_regular}') format('opentype'); }\n`
-                + `@font-face { font-family: OpenDyslexic; font-weight: bold; src: url('${font_path_bold}') format('opentype'); }\n`
-                + `@font-face { font-family: OpenDyslexic; font-style: italic; src: url('${font_path_italic}') format('opentype'); }\n`
-
-                // class rule
-                + ".opendyslexic, .opendyslexic p, .opendyslexic a, .opendyslexic span, .opendyslexic div" +
-                ".opendyslexic h1, .opendyslexic h2 , .opendyslexic h3 { font-family: 'OpenDyslexic' !important }"
-            ));
-            document.getElementsByTagName("head")[0].appendChild(od_font);
-            __opendyslexic_loaded = true
-        }
-
-        if (document.body.classList.contains("opendyslexic")) {
-            document.body.classList.remove("opendyslexic");
-            document.getElementById('fix-open-dyslexic-link').innerHTML = 'Enable futuristic font'
-        } else {
-            document.body.classList.add("opendyslexic");
-            document.getElementById('fix-open-dyslexic-link').innerHTML = 'Disable futuristic font'
-        }
-    });
-});
\ No newline at end of file