remove dependency on JS for menu and theme toggle

This commit is contained in:
recanman 2023-10-15 16:40:48 -07:00
parent 706171b42e
commit ffa3d1aacf
9 changed files with 111 additions and 122 deletions

View file

@ -1,12 +1,4 @@
<header id="header">
<div class="action-container action-container--left">
<!-- Dark Mode Button -->
<label class="switch">
<input type="checkbox">
<span class="slider round"></span>
</label>
</div>
<a href="{{ site.baseurl }}">
<img class="logo" src="{{ "/img/revuo-monero-logo.png" | prepend: site.baseurl | replace: '//', '/' }}" alt="Revuo Monero Logo">
</a>

View file

@ -0,0 +1,4 @@
<input class="nojs-toggle" id="menu-toggle" type="checkbox" name="menu-toggle">
<label {% if site.reverse == true %}id="nav-menu-left"{% else %}id="nav-menu"{% endif %} for="menu-toggle" class="menu-toggle">
<div id="menu"></div>
</label>

View file

@ -1,11 +1,6 @@
<nav {% if site.reverse == true %}id="nav-left"{% else %}id="nav"{% endif %}>
<div id="nav-list">
<div class="nav-actions">
<!-- Dark Mode Button -->
<label class="switch">
<input type="checkbox">
<span class="slider round"></span>
</label>
<a class="icon" href="https://revuo-xmr.com/support/" target="_blank"><img src="/img/donate.png" alt="Donate" title="Donate" /></a>
<a class="icon" href="/atom.xml" target="_blank"><img src="/img/rss_1.png" alt="ATOM Feed" title="ATOM Feed" /></a>
</div>

View file

@ -0,0 +1,5 @@
<!-- Unfortunately, targeting the parent is not a thing in CSS. This is a workaround. -->
<input class="nojs-toggle" id="theme-switcher" type="checkbox" name="theme-switcher">
<label class="switch" for="theme-switcher" id="main-theme-switcher">
<span class="slider round"></span>
</label>