Update web/templates/base.html

This commit is contained in:
Joshua Laymon 2025-08-20 01:53:40 +00:00
parent fa9ec34a90
commit 26fd78ed81

View File

@ -39,7 +39,7 @@
.mobile-menu[hidden]{ display:none; }
@media (max-width:700px){
.desktop-nav { display:none; } /* hide the right-side buttons on phones */
.desktop-nav { display:none; }
.hamburger{
display:inline-flex;
@ -49,14 +49,13 @@
border-radius:10px;
background:var(--btn-bg);
cursor:pointer;
/* stack the bars so it looks like a proper hamburger */
flex-direction: column;
gap: 4px;
}
.hamburger span{
display:block;
width:20px; height:2px;
margin:0; /* no vertical margin; spacing comes from gap */
margin:0;
background:var(--nav-ink);
border-radius:2px;
}
@ -109,7 +108,6 @@
<a class="version-link" href="https://git.lan/joshlaymon/Illustrations/wiki" title="Release notes">{{ APP_VERSION }}</a>
</div>
<!-- existing nav, unchanged; we just add "desktop-nav" -->
<div class="nav-right desktop-nav">
<a class="nav-btn" href="{% url 'search' %}">Search</a>
<a class="btn btn-success" href="{% url 'entry_add' %}">+ New Entry</a>
@ -120,7 +118,7 @@
{% endif %}
{% if user.is_authenticated %}
<!-- USER MENU: username button that opens Settings + Logout -->
<!-- USER MENU -->
<div class="user-dropdown">
<button id="userMenuBtn" class="user-chip" aria-haspopup="true" aria-expanded="false">
{{ user.username }}
@ -138,13 +136,11 @@
{% endif %}
</div>
<!-- new: hamburger button (only shows on small screens via CSS) -->
<button id="hamburger" class="hamburger" aria-label="Open menu" aria-controls="mobileMenu" aria-expanded="false">
<span></span><span></span><span></span>
</button>
</div>
<!-- new: mobile dropdown (hidden by default) -->
<div id="mobileMenu" class="mobile-menu" hidden>
<nav class="mobile-menu-inner" role="menu">
<a class="mobile-link" href="{% url 'search' %}" role="menuitem">Search</a>
@ -156,7 +152,6 @@
{% endif %}
{% if user.is_authenticated %}
<!-- USER MENU (mobile): show Settings + Logout in the slideout -->
<div class="mobile-user">Signed in: {{ user.username }}</div>
<a class="mobile-link" href="{% url 'settings_home' %}" role="menuitem">Settings</a>
<form method="post" action="{% url 'logout' %}" role="menuitem">{% csrf_token %}
@ -185,7 +180,6 @@
{% block extra_body %}{% endblock %}
<!-- tiny toggles -->
<script>
(function () {
/* mobile hamburger */