ayo/blog
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: better variable and ID names

Browse source
This commit is contained in:
Ayo 2024-01-26 10:47:17 +01:00
parent b847b6dce5
commit 328657fedc
1 changed files with 10 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
_includes/message.html
View file

@ -16,7 +16,7 @@
work. work.
</p> </p>
<div id="hide-message-btn" style="display: none"> <div id="hidden-message-wrapper" style="display: none">
<p> <p>
There may be some topics that pop up more than others. There may be some topics that pop up more than others.
<a href="/technology">Technology</a> posts are mostly about web <a href="/technology">Technology</a> posts are mostly about web
@ -41,24 +41,24 @@
<p>~ <em>Ayo Ayco</em></p> <p>~ <em>Ayo Ayco</em></p>
</div> </div>
<button <button
id="read-message-btn" id="show-btn"
style="cursor: pointer; display: none" style="cursor: pointer; display: none"
onclick="toggleMessage()" onclick="toggleMessage()"
> >
Read the full message &raquo; Read the full message &raquo;
</button> </button>
<script> <script>
var x = document.getElementById("hide-message-btn"); var hiddenMessage = document.getElementById("hidden-message-wrapper");
var y = document.getElementById("read-message-btn"); var showButton = document.getElementById("show-btn");
y.style.display = "block"; // only show when JS enabled showButton.style.display = "block"; // only show when JS enabled
function toggleMessage() { function toggleMessage() {
if (x.style.display === "none") { if (hiddenMessage.style.display === "none") {
x.style.display = "block"; hiddenMessage.style.display = "block";
y.innerHTML = "&laquo; Read less..."; showButton.innerHTML = "&laquo; Read less...";
} else { } else {
x.style.display = "none"; hiddenMessage.style.display = "none";
y.innerHTML = "Read the full message &raquo;"; showButton.innerHTML = "Read the full message &raquo;";
window.scrollTo(0, 0); window.scrollTo(0, 0);
} }
} }