-
Notifications
You must be signed in to change notification settings - Fork 0
Navbar
Giacomo Lawrance edited this page Apr 5, 2019
·
1 revision
Quickly features a powerful navbar, which is responsive on mobile.
For the navbar to work, you need both the CSS:
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/giacomolaw/quickly@0.0.1/dist/main.min.css">
And the JavaScript to collapse and open the navbar.
<script src="https://cdn.jsdelivr.net/gh/giacomolaw/quickly@0.0.1/dist/script.min.js"></script>
You'll also need Font Awesome for the icon to work.
Using the navbar is simple.
<div class="nav" id="nav">
<a href="#" class="active">Home</a>
<a href='https://github.com/giacomolaw/quickly' target="_blank">View on GitHub</a>
<a href="https://github.com/GiacomoLaw/quickly/blob/master/README.md" target="_blank">About</a>
<a href="https://github.com/GiacomoLaw/quickly/blob/master/README.md#Installation" target="_blank">Install</a>
<a href="javascript:void(0);" class="icon" onclick="navtoggle()">
<i class="fa fa-bars"></i>
</a>
</div>
Simply wrap you links in the nav
div like the above example. If you want to use the dark mode, you can do so by adding the nav-dark
after nav
.
If you want a link to show as active, append the active
class to that link.