ColormaticStudios/colormaticwebsite
Archived
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Properly responsive & centered navbar

Browse Source
This commit is contained in:
Zakarya
2024-07-24 17:38:59 -07:00
parent 5332c422a1
commit 4f48980a50
2 changed files with 67 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
component/navbar.html
View File

@ -1,11 +1,18 @@
<nav>
<ul>
<li><a href="/" class="title">Colormatic</a></li>
</ul>
<img src="/img/colormatic_logo.svg">
<ul>
<li><a href="/zakarya">Zakarya</a></li>
<li><a href="https://github.com/ColormaticStudios" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/about">About</a></li>
</ul>
<script>
var menu = document.getElementById("menu");
function toggle_nav_menu() {
menu.classList.toggle("responsive-hidden")
}
</script>
<a href="/" class="title nav-left">Colormatic</a>
<img src="/img/colormatic_logo.svg" class="nav-center">
<div class="nav-right inline">
<ul id="menu" class="responsive-hidden">
<li><a href="/zakarya">Zakarya</a></li>
<li><a href="https://github.com/ColormaticStudios" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/about">About</a></li>
</ul>
<button onclick="toggle_nav_menu();" class="responsive-button"><img src="https://icons.getbootstrap.com/assets/icons/list.svg"></button>
</div>
</nav>