diff --git a/public/about.html b/public/about.html
index 81071539db1276cd9d4f4cf751e7716ee186fdd6..75f898682d6531a82affcd5c331b788bf334572a 100644
--- a/public/about.html
+++ b/public/about.html
@@ -33,7 +33,7 @@
name="font"
id="font-AtkinsonHyperlegible"
value="AtkinsonHyperlegible"
- />Atkinson Hyperlegible</label
+ />Atkinson Hyperlegible</label
>
</li>
<li>
@@ -46,7 +46,7 @@
name="font"
id="font-OpenDyslexicThree"
value="OpenDyslexicThree"
- />Open Dyslexic</label
+ />Open Dyslexic</label
>
</li>
<li>
@@ -56,7 +56,7 @@
name="font"
id="font-SylexiadSans"
value="SylexiadSans"
- />Sylexiad Sans</label
+ />Sylexiad Sans</label
>
</li>
<li>
@@ -80,6 +80,27 @@
/>Ubuntu</label
>
</li>
+ <li>
+ <label for="font-serif" class="font-serif"
+ ><input
+ type="radio"
+ name="font"
+ id="font-serif"
+ value="serif"
+ />serif</label
+ >
+ </li>
+ <li>
+ <label for="font-sans" class="font-sans">
+ <input
+ type="radio"
+ name="font"
+ id="font-sans"
+ value="sans"
+ checked
+ />sans-serif</label
+ >
+ </li>
</ul>
</fieldset>
</div>
diff --git a/public/index.html b/public/index.html
index 1a6df08d612c61042f5b3eb8bdaf6a45eeb069a9..08bca5a4cad7446c49e9c640b9625ccaf760c2c1 100644
--- a/public/index.html
+++ b/public/index.html
@@ -33,7 +33,7 @@
name="font"
id="font-AtkinsonHyperlegible"
value="AtkinsonHyperlegible"
- />Atkinson Hyperlegible</label
+ />Atkinson Hyperlegible</label
>
</li>
<li>
@@ -46,7 +46,7 @@
name="font"
id="font-OpenDyslexicThree"
value="OpenDyslexicThree"
- />Open Dyslexic</label
+ />Open Dyslexic</label
>
</li>
<li>
@@ -56,7 +56,7 @@
name="font"
id="font-SylexiadSans"
value="SylexiadSans"
- />Sylexiad Sans</label
+ />Sylexiad Sans</label
>
</li>
<li>
@@ -80,6 +80,27 @@
/>Ubuntu</label
>
</li>
+ <li>
+ <label for="font-serif" class="font-serif"
+ ><input
+ type="radio"
+ name="font"
+ id="font-serif"
+ value="serif"
+ />serif</label
+ >
+ </li>
+ <li>
+ <label for="font-sans" class="font-sans">
+ <input
+ type="radio"
+ name="font"
+ id="font-sans"
+ value="sans"
+ checked
+ />sans-serif</label
+ >
+ </li>
</ul>
</fieldset>
</div>
diff --git a/public/main.js b/public/main.js
index 5f76420dac81246d994b540e0baa9b49a5bc365b..2ea31d5546de6aa4b938beabedc0164ebd4860f6 100644
--- a/public/main.js
+++ b/public/main.js
@@ -18,7 +18,9 @@ const changeFont = event => {
"font-Lora",
"font-AtkinsonHyperlegible",
"font-OpenDyslexicThree",
- "font-Ubuntu"
+ "font-Ubuntu",
+ "font-serif",
+ "font-sans"
);
contentNode.classList.add(`font-${font}`);
window.localStorage.setItem("font", font);
@@ -33,7 +35,9 @@ window.onload = function() {
"font-Lora",
"font-AtkinsonHyperlegible",
"font-OpenDyslexicThree",
- "font-Ubuntu"
+ "font-Ubuntu",
+ "font-serif",
+ "font-sans"
);
contentNode.classList.add(`font-${previousFont}`);
console.log("Previously selected font: ", previousFont);
diff --git a/public/speakersdesk.html b/public/speakersdesk.html
index 44f29d0fd8ab8c34b7fa2cf683cf98955046bbe9..55833ccc49ecbc8c7e1e9337e312d328a41f4b4c 100644
--- a/public/speakersdesk.html
+++ b/public/speakersdesk.html
@@ -33,7 +33,7 @@
name="font"
id="font-AtkinsonHyperlegible"
value="AtkinsonHyperlegible"
- />Atkinson Hyperlegible</label
+ />Atkinson Hyperlegible</label
>
</li>
<li>
@@ -46,7 +46,7 @@
name="font"
id="font-OpenDyslexicThree"
value="OpenDyslexicThree"
- />Open Dyslexic</label
+ />Open Dyslexic</label
>
</li>
<li>
@@ -56,7 +56,7 @@
name="font"
id="font-SylexiadSans"
value="SylexiadSans"
- />Sylexiad Sans</label
+ />Sylexiad Sans</label
>
</li>
<li>
@@ -80,6 +80,27 @@
/>Ubuntu</label
>
</li>
+ <li>
+ <label for="font-serif" class="font-serif"
+ ><input
+ type="radio"
+ name="font"
+ id="font-serif"
+ value="serif"
+ />serif</label
+ >
+ </li>
+ <li>
+ <label for="font-sans" class="font-sans">
+ <input
+ type="radio"
+ name="font"
+ id="font-sans"
+ value="sans"
+ checked
+ />sans-serif</label
+ >
+ </li>
</ul>
</fieldset>
</div>
diff --git a/public/styles/partials/_font-code.scss b/public/styles/partials/_font-code.scss
index 008fe8d4c79253a8d51929d04012a652e1672702..0359768701b2b029ed0079e9170bc5213efd576a 100644
--- a/public/styles/partials/_font-code.scss
+++ b/public/styles/partials/_font-code.scss
@@ -58,3 +58,21 @@
font-family: OpenDyslexicThree-Bold, sans-serif;
}
}
+
+.font-serif {
+ font-family: serif;
+ h2,
+ .lang {
+ font-family: serif;
+ font-weight: bold;
+ }
+}
+
+.font-sans {
+ font-family: sans-serif;
+ h2,
+ .lang {
+ font-family: sans-serif;
+ font-weight: bold;
+ }
+}
diff --git a/public/styles/style.css b/public/styles/style.css
index ae21bd580bbfa98cd6ee23524e09a05a5be45752..d09806d65d977a86f9c96c6c142196a88bff15d3 100644
--- a/public/styles/style.css
+++ b/public/styles/style.css
@@ -190,8 +190,25 @@
font-family: OpenDyslexicThree-Bold, sans-serif;
}
+.font-serif {
+ font-family: serif;
+}
+.font-serif h2,
+.font-serif .lang {
+ font-family: serif;
+ font-weight: bold;
+}
+
+.font-sans {
+ font-family: sans-serif;
+}
+.font-sans h2,
+.font-sans .lang {
+ font-family: sans-serif;
+ font-weight: bold;
+}
+
body {
- font-family: "Ubuntu Regular", sans-serif;
font-size: 13pt;
line-height: 1.45em;
margin: 0 auto;
@@ -315,15 +332,15 @@ footer {
border: 1px solid #6600ea;
}
#font-selection ul {
- -moz-columns: 3 130pt;
- columns: 3 130pt;
+ -moz-columns: 3 150pt;
+ columns: 3 150pt;
margin: 0;
padding: 0;
border: 0;
background: #efefef;
}
#font-selection li {
- min-width: 12em;
+ min-width: 13em;
list-style: none;
line-height: 0;
height: 22pt;
diff --git a/public/styles/style.scss b/public/styles/style.scss
index 26c5f4c2ecaae78416886a8c5bad6e0d6019511c..eff3ea85c4589c9df255213f2dabdebfd8bec387 100644
--- a/public/styles/style.scss
+++ b/public/styles/style.scss
@@ -3,7 +3,6 @@
@use 'partials/_font-code';
body {
- font-family: "Ubuntu Regular", sans-serif;
font-size: 13pt;
line-height: 1.45em;
margin: 0 auto;
@@ -118,15 +117,15 @@ footer {
border-radius: 15px;
border: 1px solid #6600ea;
ul {
- -moz-columns: 3 130pt;
- columns: 3 130pt;
+ -moz-columns: 3 150pt;
+ columns: 3 150pt;
margin: 0;
padding: 0;
border: 0;
background: #efefef;
}
li {
- min-width: 12em;
+ min-width: 13em;
list-style: none;
line-height: 0;
height: 22pt;