mirror of
https://github.com/dtinth/comic-mono-font.git
synced 2026-02-21 22:43:59 +00:00
Add style preview button functionality
This commit is contained in:
62
index.js
Normal file
62
index.js
Normal file
@@ -0,0 +1,62 @@
|
||||
const exampleTextClasses = document.getElementById("exampleText").classList;
|
||||
|
||||
const seriousButton = document
|
||||
.getElementById("seriousButton")
|
||||
.addEventListener("click", function () {
|
||||
exampleTextClasses.add("serious");
|
||||
exampleTextClasses.remove("seriousItalic");
|
||||
exampleTextClasses.remove("seriousBold");
|
||||
exampleTextClasses.remove("seriousBoldItalic");
|
||||
exampleTextClasses.remove("seriousLight");
|
||||
exampleTextClasses.remove("seriousLightItalic");
|
||||
});
|
||||
const seriousItalicButton = document
|
||||
.getElementById("seriousItalicButton")
|
||||
.addEventListener("click", function () {
|
||||
exampleTextClasses.remove("serious");
|
||||
exampleTextClasses.add("seriousItalic");
|
||||
exampleTextClasses.remove("seriousBold");
|
||||
exampleTextClasses.remove("seriousBoldItalic");
|
||||
exampleTextClasses.remove("seriousLight");
|
||||
exampleTextClasses.remove("seriousLightItalic");
|
||||
});
|
||||
const seriousBoldButton = document
|
||||
.getElementById("seriousBoldButton")
|
||||
.addEventListener("click", function () {
|
||||
exampleTextClasses.remove("serious");
|
||||
exampleTextClasses.remove("seriousItalic");
|
||||
exampleTextClasses.add("seriousBold");
|
||||
exampleTextClasses.remove("seriousBoldItalic");
|
||||
exampleTextClasses.remove("seriousLight");
|
||||
exampleTextClasses.remove("seriousLightItalic");
|
||||
});
|
||||
const seriousBoldItalicButton = document
|
||||
.getElementById("seriousBoldItalicButton")
|
||||
.addEventListener("click", function () {
|
||||
exampleTextClasses.remove("serious");
|
||||
exampleTextClasses.remove("seriousItalic");
|
||||
exampleTextClasses.remove("seriousBold");
|
||||
exampleTextClasses.add("seriousBoldItalic");
|
||||
exampleTextClasses.remove("seriousLight");
|
||||
exampleTextClasses.remove("seriousLightItalic");
|
||||
});
|
||||
const seriousLightButton = document
|
||||
.getElementById("seriousLightButton")
|
||||
.addEventListener("click", function () {
|
||||
exampleTextClasses.remove("serious");
|
||||
exampleTextClasses.remove("seriousItalic");
|
||||
exampleTextClasses.remove("seriousBold");
|
||||
exampleTextClasses.remove("seriousBoldItalic");
|
||||
exampleTextClasses.add("seriousLight");
|
||||
exampleTextClasses.remove("seriousLightItalic");
|
||||
});
|
||||
const seriousLightItalicButton = document
|
||||
.getElementById("seriousLightItalicButton")
|
||||
.addEventListener("click", function () {
|
||||
exampleTextClasses.remove("serious");
|
||||
exampleTextClasses.remove("seriousItalic");
|
||||
exampleTextClasses.remove("seriousBold");
|
||||
exampleTextClasses.remove("seriousBoldItalic");
|
||||
exampleTextClasses.remove("seriousLight");
|
||||
exampleTextClasses.add("seriousLightItalic");
|
||||
});
|
||||
Reference in New Issue
Block a user