commit f4ebe92672dc0beccb45daf3d3f9a5bd2387b82e parent fa3f598e60650e698f26164ea9f51b0b2082e132 Author: breadcat <breadcat@users.noreply.github.com> Date: Tue, 11 Nov 2025 22:15:57 +0000 Responsive nav bar CSS Only show icons when space is limited Diffstat:
| M | static/style.css | | | 8 | ++++++++ |
1 file changed, 8 insertions(+), 0 deletions(-)
diff --git a/static/style.css b/static/style.css @@ -30,6 +30,14 @@ div#search-container form {border-left:1px solid gray} div#search-container form input{border:1px solid gray;margin: 8px;padding:8px;outline: none; box-sizing: border-box} div#search-container form input:focus{border:1px solid white;background-color:#3a3a3a} +/* responsive nav bar */ +@media (max-width: 600px) { + nav ul li a span, nav ul li strong {display: none;} + nav ul li a svg {display: inline-block; margin: 0 auto; width: 1.8rem; } + nav ul li a {padding: 0.8rem; text-align: center;} + div#search-container form input {width: 80px; padding: 6px; margin: 6px; } + } + /* fix whitespace in nav */ nav ul { font-size: 0; } nav ul li { font-size: 1rem; }