Skip to content

Repository files navigation

top-bar.css

A top bar navigation pattern.

npmtravisdownloads

Install

npm install top-bar.css

Usage

<!DOCTYPE html><html><head>
...
<linkrel="stylesheet" href="path/to/top-bar.css">
...
</head><body>
...
<navclass="top-bar"><ahref="#" class="top-bar-title">site title</a><ahref="#" class="top-bar-link">some nav link</a><ahref="#" class="top-bar-link">another one</a><ahref="#" class="top-bar-link current-page">current page</a><divclass="top-bar-right"><ahref="#" class="top-bar-link">this one's on the right</a></div></nav>
...
</body></html>

Everything is scoped to .top-bar.

Compatible with css-via-npm workflows.

Sass

You can also use this as a Sass library.

@import'../node_modules/top-bar.css/source/top-bar';

You can set the font family like so:

$top-bar-family: 'Comic Sans';
@import'../node_modules/top-bar.css/source/top-bar';

License

ISC

About

🎩 A top bar navigation pattern.

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages