open-index/open-npm huggingface dataset:
npm package: @geedmo/yamm
Description: Yet another megamenu for Bootstrap
Author: @geedmo
Latest version: 4.0.1

# Yamm

![Version](https://img.shields.io/badge/version-4.0.0-blue.svg?cacheSeconds=2592000)
[![Documentation](https://img.shields.io/badge/documentation-yes-brightgreen.svg)](https://github.com/geedmo/yamm#readme)
[![Maintenance](https://img.shields.io/badge/Maintained%3F-yes-green.svg)](https://github.com/geedmo/yamm/graphs/commit-activity)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://github.com/geedmo/yamm/blob/master/LICENSE)

> This is *Yet another megamenu for [Bootstrap 4](http://getbootstrap.com/)*.

Lightweight and pure CSS megamenu that uses the standard navbar markup and the fluid grid system classes from Bootstrap 4. Work for fixed and responsive layout and has the facility to include (almost) any Bootstrap elements.

### [Demo](http://geedmo.github.io/yamm/)

## Install

- Install with [npm](https://www.npmjs.com/): `npm install @geedmo/yamm --save`
- Install with [yarn](https://yarnpkg.com/): `yarn add @geedmo/yamm`

## Basic usage

- CDN `https://cdn.jsdelivr.net/gh/geedmo/yamm@4.0.0/dist/yamm.min.css`
- ES6 import:  `import "@geedmo/yamm";`
- SCSS import: `@import "@geedmo/yamm/src/yamm.scss";`
- LESS import: `@import "@geedmo/yamm/src/yamm.less";`
- STYL import: `@import "@geedmo/yamm/src/yamm"`

## Documentation

Being a pretty small repository there's no separate documentation. You can find more usage instructions and examples by checking the [Demo](http://geedmo.github.io/yamm) and the source code.

## Bugs and feature requests

Please first read the [issue guidelines](https://github.com/geedmo/yamm/blob/master/.github/CONTRIBUTING.md) and search for existing and closed issues. If your problem or idea is not addressed yet, [please open a new issue](https://github.com/geedmo/yamm/issues/new).

## Development

```
npm run build
```

By default the SCSS stylesheet is used to generate the CSS build. See package.json for other scripts.

## Test

```
npm run test
```

Test that everything compiles fine (including demo) and all sources generate the same output.
Make sure all tests passes before sending a PR.

## Author

* Twitter: [@geedmo](https://twitter.com/geedmo)
* Github: [@geedmo](https://github.com/geedmo)


## License

Copyright © 2019 [@geedmo](https://github.com/geedmo).

This project is [MIT](https://github.com/geedmo/yamm/blob/master/LICENSE) licensed.


## Sponsored content
<p>
    <a href="https://codecanyon.net/item/47admin-bootstrap-admin-skin/7647583?ref=geedmo">
        <img width="180px" src="https://i.imgur.com/EAiUz7N.jpg" alt="47Admin - Bootstrap Admin Template" />
        &nbsp;&nbsp;
    </a>
</p>
npm package: @geedmo/yamm3
Description: Yet another megamenu for Bootstrap
Author: @geedmo
Latest version: 1.3.1

# Yamm


This is *Yet another megamenu for [Bootstrap 3](http://getbootstrap.com/)* from Twitter.

Lightweight and pure CSS megamenu that uses the standard navbar markup and the fluid grid system classes from Bootstrap 3. Work for fixed and responsive layout and has the facility to include (almost) any Bootstrap elements.

#### [Demo](http://geedmo.github.io/yamm3)

### Install with npm

    npm install @geedmo/yamm3 --save

### Install with bower

    bower install yamm3 --save

### Install via composer

    {
        "require": {
            "geedmo/yamm3": "dev-master"
        }
    }


### Markup

1. Reuse navbar markup and add class `.yamm` at the top.

2. Then add your markup into the `.dropdown-menu`

3. Optionally use `.yamm-content` to wrap content with padding.

Example

    <nav class="navbar yamm navbar-default " role="navigation">
        ...
        <ul class="nav navbar-nav">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
                <ul class="dropdown-menu">
                    <li>
                        <div class="yamm-content">
                        <div class="row">
                            ...
                    </li>
                </ul>
            </li>
        </ul>
        ...
    </nav>


### Fullwidth

By default every mega-dropdown will take the content size so is possible to use add `.yamm-fw` to `.dropdown` to expand it fullwidth.
Yamm works better with fullwidth menus.

Example

    <nav class="navbar yamm navbar-default " role="navigation">
    ...
         <ul class="nav navbar-nav">
           <li class="dropdown yamm-fw">
                 ...
           </li>
         </ul>
    ...
    </nav>


### Javascript

If necessary, this code will prevent unexpected menu close when using some components (like accordion, forms, etc)

    $(document).on('click', '.yamm .dropdown-menu', function(e) {
       e.stopPropagation()
    })

### AngularJS

Check it at [hjzheng/angular-mega-menu](https://github.com/hjzheng/angular-mega-menu)

### Compile

Run the following commands in the repository folder

- npm install
- gulp

To compile yamm with demo

- gulp demo

### License

- Licenced under MIT - [details here](LICENSE.txt)