xaloc/aurora
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

make text button mode toggle when pressed

Browse Source
This commit is contained in:
Xaloc 2021-08-27 00:34:28 +02:00
parent f7a6b0e30a
commit 132524b1c7
1 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
index.html
View File

@ -28,7 +28,7 @@
<div style="text-align: center;"> <div style="text-align: center;">
<h1><span style='color: purple;'>D</span><span style='color: #FF47EB;'>a</span><span style='color: red;'>t</span><span style='color: #FF6600;'>a</span> <span style='color: orange;'>f</span><span style='color: #FFE200;'>r</span><span style='color: lightgreen;'>o</span><span style='color: darkgreen;'>m</span> <span style='color: turquoise;'>I</span><span style='color: #1ac6ff;'>R</span><span style='color: blue;'>F</span> <span style='color: grey;'>K</span><span style='color: #914724;'>i</span>r<span style='color: #9933ff;'>u</span><span style='color: #ff99cc;'>n</span><span style='color: #811a36;'>a</span></h1> <h1><span style='color: purple;'>D</span><span style='color: #FF47EB;'>a</span><span style='color: red;'>t</span><span style='color: #FF6600;'>a</span> <span style='color: orange;'>f</span><span style='color: #FFE200;'>r</span><span style='color: lightgreen;'>o</span><span style='color: darkgreen;'>m</span> <span style='color: turquoise;'>I</span><span style='color: #1ac6ff;'>R</span><span style='color: blue;'>F</span> <span style='color: grey;'>K</span><span style='color: #914724;'>i</span>r<span style='color: #9933ff;'>u</span><span style='color: #ff99cc;'>n</span><span style='color: #811a36;'>a</span></h1>
<div style="display: inline-block; padding: 10px;"> <div style="display: inline-block; padding: 10px;">
<button onclick="darkMode()" class="button-dark">Light Mode</button> <button id="modeBtn" onclick="darkMode()" class="button-dark">Dark Mode: On</button>
<h3>Latest image from the All Sky camera</h3> <h3>Latest image from the All Sky camera</h3>
<img style='width: 90%;' src='https://www.irf.se/alis/allsky/krn/latest_small.jpeg'> <img style='width: 90%;' src='https://www.irf.se/alis/allsky/krn/latest_small.jpeg'>
</div> </div>
@ -65,7 +65,14 @@
function darkMode() { function darkMode() {
var ele = document.body; var ele = document.body;
ele.classList.toggle("dark"); ele.classList.toggle("dark");
var x = document.getElementById("modeBtn");
if (x.innerHTML === "Dark Mode: Off") {
x.innerHTML = "Dark Mode: On";
} else {
x.innerHTML = "Dark Mode: Off";
}
} }
async function api(){ async function api(){
const res = await fetch('https://www.spaceweather.se/forecast/kp/latest.json'); const res = await fetch('https://www.spaceweather.se/forecast/kp/latest.json');
const data = await res.json(); const data = await res.json();