Navbar - GiacomoLaw/quickly GitHub Wiki

Quickly features a powerful navbar, which is responsive on mobile.

Table of Contents

Installation
Usage

Installation

For the navbar to work, you need both the CSS:

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/giacomolaw/[email protected]/dist/main.min.css">

And the JavaScript to collapse and open the navbar.

<script src="https://cdn.jsdelivr.net/gh/giacomolaw/[email protected]/dist/script.min.js"></script>

You'll also need Font Awesome for the icon to work.

Usage

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.

⚠️ **GitHub.com Fallback** ⚠️