toggle font button
This commit is contained in:
parent
c5bbdd194c
commit
e52ea0c3e6
@ -1,4 +1,5 @@
|
||||
</main>
|
||||
<script src="main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
@ -6,7 +6,33 @@
|
||||
<title>avg convo</title>
|
||||
<link href="text_analysis.css" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<style id="style-heonian" disabled>
|
||||
.convo-heonian {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.convo-roman {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<style id="style-roman">
|
||||
.convo-heonian {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.convo-roman {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>
|
||||
<style>
|
||||
#font-button {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</noscript>
|
||||
<p class="button" id="font-button">toggle font</p>
|
||||
<main>
|
28
main.js
28
main.js
@ -5,13 +5,17 @@
|
||||
|
||||
let words = {}
|
||||
|
||||
let currentFont = "r";
|
||||
|
||||
function init() {
|
||||
createWordList();
|
||||
injectWords();
|
||||
document.querySelector("#popup-container").addEventListener("click", () => {
|
||||
document.querySelector("#popup-container").style.opacity = 0;
|
||||
document.querySelector("#popup-container").style.pointerEvents = "none";
|
||||
})
|
||||
// createWordList();
|
||||
// injectWords();
|
||||
// document.querySelector("#popup-container").addEventListener("click", () => {
|
||||
// document.querySelector("#popup-container").style.opacity = 0;
|
||||
// document.querySelector("#popup-container").style.pointerEvents = "none";
|
||||
// })
|
||||
// above are commented out until wordlist is added~
|
||||
document.querySelector("#font-button").addEventListener("click", () => {fontButton();});
|
||||
}
|
||||
|
||||
function showPopup(word) {
|
||||
@ -68,6 +72,18 @@ function injectWords() {
|
||||
});
|
||||
}
|
||||
|
||||
function fontButton() {
|
||||
if (currentFont == "r") {
|
||||
document.querySelector("#style-heonian").disabled = false;
|
||||
document.querySelector("#style-roman").disabled = true;
|
||||
currentFont = "h";
|
||||
} else {
|
||||
document.querySelector("#style-heonian").disabled = true;
|
||||
document.querySelector("#style-roman").disabled = false;
|
||||
currentFont = "r";
|
||||
}
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
init();
|
||||
}
|
27
test.html
27
test.html
@ -6,9 +6,35 @@
|
||||
<title>avg convo</title>
|
||||
<link href="text_analysis.css" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<style id="style-heonian" disabled>
|
||||
.convo-heonian {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.convo-roman {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<style id="style-roman">
|
||||
.convo-heonian {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.convo-roman {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>
|
||||
<style>
|
||||
#font-button {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</noscript>
|
||||
<p class="button" id="font-button">toggle font</p>
|
||||
<main>
|
||||
<div class="convo-container">
|
||||
<div class="convo">
|
||||
@ -378,6 +404,7 @@ relfur chu arilaen dedaka'nya.
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<script src="main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
@ -162,4 +162,12 @@ main {
|
||||
|
||||
data-swap {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.button {
|
||||
text-decoration: underline;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
Loading…
Reference in New Issue
Block a user