Removed basalt and made the sidebar an iframe to make my life easier
This commit is contained in:
parent
00f2bfdf4a
commit
82d9268002
14
darkmode.js
14
darkmode.js
|
|
@ -1,3 +1,5 @@
|
|||
var iframe = document.getElementById('iframe');
|
||||
|
||||
// Check if a dark mode cookie exists, and apply dark mode if it does
|
||||
if (getCookie("darkMode") === "true") {
|
||||
applyDarkMode();
|
||||
|
|
@ -28,10 +30,22 @@
|
|||
|
||||
function applyDarkMode() {
|
||||
document.body.classList.add("dark-mode");
|
||||
|
||||
iframe.onload = function() {
|
||||
// The iframe has loaded, now you can access its content
|
||||
iframe.contentWindow.document.body.classList.add("dark-mode");
|
||||
};
|
||||
iframe.contentWindow.document.body.classList.add("dark-mode");
|
||||
}
|
||||
|
||||
function applyLightMode() {
|
||||
document.body.classList.remove("dark-mode");
|
||||
|
||||
iframe.onload = function() {
|
||||
// The iframe has loaded, now you can access its content
|
||||
iframe.contentWindow.document.body.classList.remove("dark-mode");
|
||||
};
|
||||
iframe.contentWindow.document.body.classList.remove("dark-mode");
|
||||
}
|
||||
|
||||
// Helper functions for handling cookies
|
||||
|
|
|
|||
|
|
@ -13,30 +13,7 @@
|
|||
<button id="sidebutton" onclick="toggleDarkMode()" style="top: 48px;">
|
||||
<img class="darkmodeicon" alt="Toggle Dark Mode" src="/assets/img/moon.svg">
|
||||
</div>
|
||||
<div class="sidebar">
|
||||
<img src="/assets/img/hectabit.svg">
|
||||
<h1>Main Website</h1>
|
||||
<ul>
|
||||
<li><a href="https://hectabit.org/">Home</a></li>
|
||||
<li><a href="https://hectabit.org/donate">Donate</a></li>
|
||||
<li><a href="https://hectabit.org/halloffame">Hall of fame</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Software</h1>
|
||||
<ul>
|
||||
<li><a href="https://notes.hectabit.org" target="_blank">Notes</a></li>
|
||||
<li><a href="https://evolutionos.hectabit.org/" target="_blank">EvolutionOS</a></li>
|
||||
<li><a href="https://basalt.hectabit.org" target="_blank">Basalt Linux</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Services</h1>
|
||||
<ul>
|
||||
<li><a href="https://centrifuge.hectabit.org" target="_blank">Centrifuge</a></li>
|
||||
<li><a href="https://matrix.to/#/#devel:hectabit.org" target="_blank">Matrix</a></li>
|
||||
<li><a href="https://mail.hectabit.org" target="_blank">Mail</a></li>
|
||||
</ul>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
</div>
|
||||
<iframe src="/sidebar.html" class="sidecontainer" id="iframe"></iframe>
|
||||
<div class="content">
|
||||
<h1>Warning! The following page contains nonfree elements!</h1>
|
||||
<div class="spacer"></div>
|
||||
|
|
|
|||
|
|
@ -13,30 +13,7 @@
|
|||
<button id="sidebutton" onclick="toggleDarkMode()" style="top: 48px;">
|
||||
<img class="darkmodeicon" alt="Toggle Dark Mode" src="/assets/img/moon.svg">
|
||||
</div>
|
||||
<div class="sidebar">
|
||||
<img src="/assets/img/hectabit.svg">
|
||||
<h1>Main Website</h1>
|
||||
<ul>
|
||||
<li><a href="https://hectabit.org/">Home</a></li>
|
||||
<li><a href="https://hectabit.org/donate">Donate</a></li>
|
||||
<li><a href="https://hectabit.org/halloffame">Hall of fame</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Software</h1>
|
||||
<ul>
|
||||
<li><a href="https://notes.hectabit.org" target="_blank">Notes</a></li>
|
||||
<li><a href="https://evolutionos.hectabit.org/" target="_blank">EvolutionOS</a></li>
|
||||
<li><a href="https://basalt.hectabit.org" target="_blank">Basalt Linux</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Services</h1>
|
||||
<ul>
|
||||
<li><a href="https://centrifuge.hectabit.org" target="_blank">Centrifuge</a></li>
|
||||
<li><a href="https://matrix.to/#/#devel:hectabit.org" target="_blank">Matrix</a></li>
|
||||
<li><a href="https://mail.hectabit.org" target="_blank">Mail</a></li>
|
||||
</ul>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
</div>
|
||||
<iframe src="/sidebar.html" class="sidecontainer" id="iframe"></iframe>
|
||||
<div class="content">
|
||||
<h1>Welcome to HectaBit's Hall of fame!</h1>
|
||||
<li><h1>This is a hall of fame for all of the (amazing) members of HectaBit!</h1></li>
|
||||
|
|
|
|||
|
|
@ -51,6 +51,14 @@ body {
|
|||
}
|
||||
|
||||
/* Sidebar styles */
|
||||
.sidecontainer {
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 310px;
|
||||
border: medium;
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
border-radius: 10px;
|
||||
transition: all 0.3s ease;
|
||||
|
|
@ -179,6 +187,10 @@ button:hover {
|
|||
transform: translateX(-295px);
|
||||
}
|
||||
|
||||
.sidecontainer.hidden {
|
||||
transform: translateX(-295px);
|
||||
}
|
||||
|
||||
.content.expanded + .sidebar.hidden {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
|
|
|||
26
index.html
26
index.html
|
|
@ -13,31 +13,7 @@
|
|||
<button id="sidebutton" onclick="toggleDarkMode()" style="top: 48px;">
|
||||
<img class="darkmodeicon" alt="Toggle Dark Mode" src="/assets/img/moon.svg">
|
||||
</div>
|
||||
<div class="sidebar">
|
||||
<img src="/assets/img/hectabit.svg">
|
||||
<h1>Main Website</h1>
|
||||
<ul>
|
||||
<li><a href="https://hectabit.org/">Home</a></li>
|
||||
<li><a href="https://hectabit.org/donate">Donate</a></li>
|
||||
<li><a href="https://hectabit.org/halloffame">Hall of fame</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Software</h1>
|
||||
<ul>
|
||||
<li><a href="https://notes.hectabit.org" target="_blank">Notes</a></li>
|
||||
<li><a href="https://evolutionos.hectabit.org/" target="_blank">EvolutionOS</a></li>
|
||||
<li><a href="https://basalt.hectabit.org" target="_blank">Basalt Linux</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Services</h1>
|
||||
<ul>
|
||||
<li><a href="https://centrifuge.hectabit.org" target="_blank">Centrifuge</a></li>
|
||||
<li><a href="https://matrix.to/#/#devel:hectabit.org" target="_blank">Matrix</a></li>
|
||||
<li><a href="https://mail.hectabit.org" target="_blank">Mail</a></li>
|
||||
</ul>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
</div>
|
||||
|
||||
<iframe src="/sidebar.html" class="sidecontainer" id="iframe"></iframe>
|
||||
<div class="content">
|
||||
<h1>Welcome to HectaBit homepage!</h1>
|
||||
<div class="spacer"></div>
|
||||
|
|
|
|||
|
|
@ -13,30 +13,7 @@
|
|||
<button id="sidebutton" onclick="toggleDarkMode()" style="top: 48px;">
|
||||
<img class="darkmodeicon" alt="Toggle Dark Mode" src="/assets/img/moon.svg">
|
||||
</div>
|
||||
<div class="sidebar">
|
||||
<img src="/assets/img/hectabit.svg">
|
||||
<h1>Main Website</h1>
|
||||
<ul>
|
||||
<li><a href="https://hectabit.org/">Home</a></li>
|
||||
<li><a href="https://hectabit.org/donate">Donate</a></li>
|
||||
<li><a href="https://hectabit.org/halloffame">Hall of fame</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Software</h1>
|
||||
<ul>
|
||||
<li><a href="https://notes.hectabit.org" target="_blank">Notes</a></li>
|
||||
<li><a href="https://evolutionos.hectabit.org/" target="_blank">EvolutionOS</a></li>
|
||||
<li><a href="https://basalt.hectabit.org" target="_blank">Basalt Linux</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Services</h1>
|
||||
<ul>
|
||||
<li><a href="https://centrifuge.hectabit.org" target="_blank">Centrifuge</a></li>
|
||||
<li><a href="https://matrix.to/#/#devel:hectabit.org" target="_blank">Matrix</a></li>
|
||||
<li><a href="https://mail.hectabit.org" target="_blank">Mail</a></li>
|
||||
</ul>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
</div>
|
||||
<iframe src="/sidebar.html" class="sidecontainer" id="iframe"></iframe>
|
||||
<div class="content">
|
||||
<h1>Donate</h1>
|
||||
<div class="spacer"></div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,29 @@
|
|||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="hectabitstyles.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="sidebar">
|
||||
<img src="/assets/img/hectabit.svg">
|
||||
<h1>Main Website</h1>
|
||||
<ul>
|
||||
<li><a href="https://hectabit.org/" target="_top">Home</a></li>
|
||||
<li><a href="https://hectabit.org/donate" target="_top">Donate</a></li>
|
||||
<li><a href="https://hectabit.org/halloffame" target="_top">Hall of fame</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Software</h1>
|
||||
<ul>
|
||||
<li><a href="https://notes.hectabit.org" target="_blank">Notes</a></li>
|
||||
<li><a href="https://evolutionos.hectabit.org/" target="_blank">EvolutionOS</a></li>
|
||||
</ul>
|
||||
<h1>HectaBit Services</h1>
|
||||
<ul>
|
||||
<li><a href="https://centrifuge.hectabit.org" target="_blank">Centrifuge</a></li>
|
||||
<li><a href="https://matrix.to/#/#devel:hectabit.org" target="_blank">Matrix</a></li>
|
||||
<li><a href="https://mail.hectabit.org" target="_blank">Mail</a></li>
|
||||
</ul>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
<div class="spacer"></div>
|
||||
</body>
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
document.getElementById("sidebutton").addEventListener("click", function() {
|
||||
var sidebar = document.querySelector(".sidebar");
|
||||
var sidecontainer = document.querySelector(".sidecontainer");
|
||||
var content = document.querySelector(".content");
|
||||
var closebar = document.querySelector(".closebar");
|
||||
closebar.classList.toggle("expanded");
|
||||
sidebar.classList.toggle("hidden");
|
||||
sidecontainer.classList.toggle("hidden");
|
||||
content.classList.toggle("expanded");
|
||||
});
|
||||
|
|
|
|||
Reference in New Issue