diff --git a/assets/main.css b/assets/main.css index bf1b52d..dee86a3 100644 --- a/assets/main.css +++ b/assets/main.css @@ -134,18 +134,75 @@ img { margin: 0; } +/*Container for menu button */ +.menu-button-container { + display: none; + height: 100%; + width: auto; + cursor: pointer; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.sidebar-popup { + display: none; +} + +#menu-toggle { + display: none; +} + @media (max-width: 1024px) { - .container { + + .menu-button-container { + display: block; + flex-direction: row; + } + + .sidebar-popup { + display: block; + } + + .sidebar-svg { + display: none; + } + + .menu { flex-direction: column; + justify-content: center; + align-items: center; + background: var(--bg); + } + + #menu-toggle ~ .menu li { + height: 0; + margin: 0; + padding: 0; + border: 0; + display: none; + } + + #menu-toggle:checked ~ .menu li { + border: 1px solid var(--fg); + height: auto; + padding: 0.5em; + display: block; + } + + .menu > li { + margin: 0; + padding: 0.5em 0; + width: auto; + } + + .menu > li:not(:last-child) { + border-bottom: 1px solid #444; } .sidebar { - width: 100%; height: auto; - position: static; - } - - .sidebar ul li { - display: inline-block; + width: auto; + justify-content: center; } } diff --git a/templates/base.html b/templates/base.html index bc28eae..50aec81 100644 --- a/templates/base.html +++ b/templates/base.html @@ -11,7 +11,7 @@
+
{% block content %}{% endblock %}
diff --git a/templates/books.html b/templates/books.html index d8bae5f..da23ceb 100755 --- a/templates/books.html +++ b/templates/books.html @@ -14,11 +14,12 @@

Currently Reading

- Look to Windward - Ian Banks + A Prayer for the Crown Shy - Becky Chambers

Read so far in 2025