# @carlosfrontend/dropdownme
## Dynamic User Interface Interactions
### JavaScript Course The Odin Project
This package was developed as an exercise for [The Odin Project](https://www.theodinproject.com/). It's pretty lightweight and allows you to add as many animated dropdown menus as you need.
### HTML
1. The first thing you need is to copy and paste this codeblock container into your body tags:
`index.html`
```html
```
2. Each block with the `.parentContainer` class is a dropdown menu. You can add by copying and pasting as many as you need at you navbar container:
`index.html`
```html
```
### Advice
3. The only **requirement** is **not to change the name of the nav id and the name classes**. You can replace the rest of the text with whatever you want. You can even add more tags with the html tag if you need more elements:
```html
New Item
```
### Javascipt
1. Install it as a dependency in your project with this terminal command:
```console
npm i @carlosfrontend/dropdownme
```
2. Make sure you import it into your project's javascipt file and call the function to animate the dropdown:
`index.js`
```js
import dropDownMe from "@carlosfrontend/dropdownme";
dropDownMe();
```
### Link:
:white_check_mark: [Assigments](https://www.theodinproject.com/lessons/node-path-javascript-dynamic-user-interface-interactions) :blue_book:
:white_check_mark: [Live Preview](https://carlosfrontend.github.io/dropdown-menu-odin-project/) :computer:
Feel free to change the styles as you like.
Happy Coding!! :coffee: :rocket: