diff --git a/public/about.html b/public/about.html
index 81071539db1276cd9d4f4cf751e7716ee186fdd6..a28ee0b744cc53e3ae81810b5e05b47348b3bd98 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,28 +56,39 @@
name="font"
id="font-SylexiadSans"
value="SylexiadSans"
- />Sylexiad Sans</label
+ />Sylexiad Sans</label
>
</li>
<li>
- <label for="font-Lora" class="font-Lora"
+ <label for="font-Ubuntu" class="font-Ubuntu">
+ <input
+ type="radio"
+ name="font"
+ id="font-Ubuntu"
+ value="Ubuntu"
+ checked
+ />Ubuntu</label
+ >
+ </li>
+ <li>
+ <label for="font-serif" class="font-serif"
><input
type="radio"
name="font"
- id="font-Lora"
- value="Lora"
- />Lora</label
+ id="font-serif"
+ value="serif"
+ />serif</label
>
</li>
<li>
- <label for="font-Ubuntu" class="font-Ubuntu">
+ <label for="font-sans" class="font-sans">
<input
type="radio"
name="font"
- id="font-Ubuntu"
- value="Ubuntu"
+ id="font-sans"
+ value="sans"
checked
- />Ubuntu</label
+ />sans-serif</label
>
</li>
</ul>
@@ -130,14 +141,17 @@
</p>
<ul>
<li>
- Atkinson Hyperlegible ist da weil das vorteilhaft für Menschen mit
- Seh-Einschränkungen ist.
+ Atkinson Hyperlegible ist da, weil das vorteilhaft für Menschen
+ mit Seh-Einschränkungen ist,
+ </li>
+ <li>
+ Sylexiad Sans und Open Dyslexic sind da für Menschen mit Dyslexie,
</li>
+ <li>und Ubuntu ist da weil der Designer das so wollte.</li>
<li>
- Sylexiad Sans und Open Dyslexic sind da für Menschen mit Dyslexie.
+ Manche Menschen haben ihre eigenen System-Fonts, dafür gibt es die
+ "serif"- und "sans-serif"-Option.
</li>
- <li>Ubuntu ist da weil der Designer das so wollte</li>
- <li>und Lora, damit es auch einen Serifenfont gibt.</li>
</ul>
</section>
@@ -183,9 +197,10 @@
people who are visually impaired,
</li>
<li>Sylexiad Sans and Open Dyslexic for people with dyslexia,</li>
- <li>Ubuntu because that was the designer's choice</li>
+ <li>and Ubuntu because that was the designer's choice.</li>
<li>
- and Lora to also have a serif font.
+ Some people have their own system fonts, and that is why there is
+ a 'serif' and 'sans-serif' option.
</li>
</ul>
</section>
diff --git a/public/index.html b/public/index.html
index 1a6df08d612c61042f5b3eb8bdaf6a45eeb069a9..eb1e0126731faacbec4e9a95210053a0f00694d0 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,28 +56,39 @@
name="font"
id="font-SylexiadSans"
value="SylexiadSans"
- />Sylexiad Sans</label
+ />Sylexiad Sans</label
>
</li>
<li>
- <label for="font-Lora" class="font-Lora"
+ <label for="font-Ubuntu" class="font-Ubuntu">
+ <input
+ type="radio"
+ name="font"
+ id="font-Ubuntu"
+ value="Ubuntu"
+ checked
+ />Ubuntu</label
+ >
+ </li>
+ <li>
+ <label for="font-serif" class="font-serif"
><input
type="radio"
name="font"
- id="font-Lora"
- value="Lora"
- />Lora</label
+ id="font-serif"
+ value="serif"
+ />serif</label
>
</li>
<li>
- <label for="font-Ubuntu" class="font-Ubuntu">
+ <label for="font-sans" class="font-sans">
<input
type="radio"
name="font"
- id="font-Ubuntu"
- value="Ubuntu"
+ id="font-sans"
+ value="sans"
checked
- />Ubuntu</label
+ />sans-serif</label
>
</li>
</ul>
diff --git a/public/main.js b/public/main.js
index 5f76420dac81246d994b540e0baa9b49a5bc365b..04fc715764a91343e8b751998ca77760711dda06 100644
--- a/public/main.js
+++ b/public/main.js
@@ -15,10 +15,11 @@ const changeFont = event => {
const contentNode = document.getElementsByClassName("fontchange")[0];
contentNode.classList.remove(
"font-SylexiadSans",
- "font-Lora",
"font-AtkinsonHyperlegible",
"font-OpenDyslexicThree",
- "font-Ubuntu"
+ "font-Ubuntu",
+ "font-serif",
+ "font-sans"
);
contentNode.classList.add(`font-${font}`);
window.localStorage.setItem("font", font);
@@ -30,10 +31,11 @@ window.onload = function() {
const contentNode = document.getElementsByClassName("fontchange")[0];
contentNode.classList.remove(
"font-SylexiadSans",
- "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..e121b33084e4e66ed5bc04dfed55f9f2f617f682 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,28 +56,39 @@
name="font"
id="font-SylexiadSans"
value="SylexiadSans"
- />Sylexiad Sans</label
+ />Sylexiad Sans</label
>
</li>
<li>
- <label for="font-Lora" class="font-Lora"
+ <label for="font-Ubuntu" class="font-Ubuntu">
+ <input
+ type="radio"
+ name="font"
+ id="font-Ubuntu"
+ value="Ubuntu"
+ checked
+ />Ubuntu</label
+ >
+ </li>
+ <li>
+ <label for="font-serif" class="font-serif"
><input
type="radio"
name="font"
- id="font-Lora"
- value="Lora"
- />Lora</label
+ id="font-serif"
+ value="serif"
+ />serif</label
>
</li>
<li>
- <label for="font-Ubuntu" class="font-Ubuntu">
+ <label for="font-sans" class="font-sans">
<input
type="radio"
name="font"
- id="font-Ubuntu"
- value="Ubuntu"
+ id="font-sans"
+ value="sans"
checked
- />Ubuntu</label
+ />sans-serif</label
>
</li>
</ul>
diff --git a/public/styles/partials/_font-code.scss b/public/styles/partials/_font-code.scss
index 008fe8d4c79253a8d51929d04012a652e1672702..8610fdd43bcafc18a8890f6101f98fa2dbb41f1f 100644
--- a/public/styles/partials/_font-code.scss
+++ b/public/styles/partials/_font-code.scss
@@ -32,15 +32,6 @@
}
}
-.font-Lora {
- font-family: Lora-Regular, sans-serif;
- font-size: 14.5pt;
- h2,
- .lang {
- font-family: Lora-Bold, serif;
- }
-}
-
.font-AtkinsonHyperlegible {
font-family: AtkinsonHyperlegible-Regular, sans-serif;
font-size: 15.2pt;
@@ -58,3 +49,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..c64c02ff6d1b20ffe650744732a1bcae5e317cfc 100644
--- a/public/styles/style.css
+++ b/public/styles/style.css
@@ -163,15 +163,6 @@
font-family: SylexiadSansMedium-Bold, sans-serif;
}
-.font-Lora {
- font-family: Lora-Regular, sans-serif;
- font-size: 14.5pt;
-}
-.font-Lora h2,
-.font-Lora .lang {
- font-family: Lora-Bold, serif;
-}
-
.font-AtkinsonHyperlegible {
font-family: AtkinsonHyperlegible-Regular, sans-serif;
font-size: 15.2pt;
@@ -190,8 +181,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 +323,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;