Easy Navbar
Package to have a responsive and manageable navbar in less than 3 minutes ⚡️
How to use?
Installation
npm install @raphy73/easynavbar
Import JS
import { easyNavbar } from '@raphy73/easynavbar';
easyNavbar();
Import CSS
@import 'YOUR_ORIGIN_PATH/node_modules/@raphy73/easynavbar/dist/style.css';
Create a Json file and manage your navbar
You can add your primary color, your logo and manage all the pages. Here is an example:
{
"color": "#6F9CEB",
"logo": "/your-logo.png",
"pages": [
{
"name": "Home",
"link": "#",
"openNewTab": false
},
{
"name": "About",
"link": "#",
"openNewTab": false
},
{
"name": "Work",
"link": "#",
"openNewTab": false
},
{
"name": "Location",
"link": "https://maps.app.goo.gl/y52F3WjMsjiFwk5b7",
"openNewTab": true
}
]
}
Finally... Display the navbar in your HTML 👏
<nav id="easyNavbar" data-json="/your-custom-json-file.json"></nav>
How to Contribute?
If you want to contribute code, follow these steps:
-
Fork the repository to your GitHub account.
-
Clone the forked repository to your local machine.
git clone https://github.com/your-username/your-project.git
-
Create a new branch for your changes.
git checkout -b feature/your-feature
-
Make your changes and commit them with a clear and concise commit message.
git commit -m "Add your feature"
-
Push your changes to your forked repository.
git push origin feature/your-feature
-
Open a pull request on the Pull Requests page, providing a detailed description of your changes.
Thank you for contributing to Easy Navbar! 🚀