Widget:FryasFontPicker: Difference between revisions
Appearance
Created page with "<select id="fryas_font_picker"> <option value="latin">Latin</option> <option value="standskrift">Standskrift</option> <option value="wagumskrift">Wagumskrift</option> </select> <script> var lang_picker = document.getElementById("fryas_font_picker"); lang_picker.addEventListener((event) => { switch (lang_picker.value) { case "latin": lang_picker.classList.remove("standskrift"); lang_picker.classList.remove("wagumskrift"); break; case "sta..." |
No edit summary |
||
| Line 1: | Line 1: | ||
< | <div id="fryas_font_picker"> | ||
<div class="label">Choose a Fryas font:</div> | |||
<select class="picker"> | |||
<option value="latin">Latin</option> | <option value="latin">Latin</option> | ||
<option value="standskrift">Standskrift</option> | <option value="standskrift">Standskrift</option> | ||
<option value="wagumskrift">Wagumskrift</option> | <option value="wagumskrift">Wagumskrift</option> | ||
</select> | </select> | ||
</div> | |||
<script> | <script> | ||
var lang_picker = document. | var lang_picker = document.querySelector("#fryas_font_picker > .picker"); | ||
lang_picker.addEventListener((event) => { | lang_picker.addEventListener((event) => { | ||
var fryas_text = document.getElementById("fryas_text"); | |||
switch (lang_picker.value) { | switch (lang_picker.value) { | ||
case "latin": | case "latin": | ||
fryas_text.classList.remove("standskrift"); | |||
fryas_text.classList.remove("wagumskrift"); | |||
break; | break; | ||
case "standskrift": | case "standskrift": | ||
fryas_text.classList.add("standskrift"); | |||
fryas_text.classList.remove("wagumskrift"); | |||
break; | break; | ||
case "wagumskrift": | case "wagumskrift": | ||
fryas_text.classList.remove("standskrift"); | |||
fryas_text.classList.add("wagumskrift"); | |||
break; | break; | ||
} | } | ||
Revision as of 09:40, 2 June 2023
Choose a Fryas font:
<select class="picker">
<option value="latin">Latin</option> <option value="standskrift">Standskrift</option> <option value="wagumskrift">Wagumskrift</option>
</select>
<script> var lang_picker = document.querySelector("#fryas_font_picker > .picker"); lang_picker.addEventListener((event) => {
var fryas_text = document.getElementById("fryas_text");
switch (lang_picker.value) {
case "latin":
fryas_text.classList.remove("standskrift");
fryas_text.classList.remove("wagumskrift");
break;
case "standskrift":
fryas_text.classList.add("standskrift");
fryas_text.classList.remove("wagumskrift");
break;
case "wagumskrift":
fryas_text.classList.remove("standskrift");
fryas_text.classList.add("wagumskrift");
break;
}
localStorage.setItem("preferred_fryas_font", lang_picker.value);
}); var pref_font = localStorage.getItem("preferred_fryas_font") if (pref_font != null) {
lang_picker.value = pref_font;
} </script>