@vadimfilimonov/accordion v0.0.1

Accordion

Installation

npm install @vadimfilimonov/accordion --save

Usage

Layout your markup like this:

<dl>
    <dt class="js-accordion">
        <button type="button">Click me?</button>
    </dt>
    <dd>
        <div>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Id, itaque quisquam?
        </div>
    </dd>
</dl>

Then create an Accordion:

import accordion from '@vadimfilimonov/accordion';

accordion();

Styling

The base stylesheet is located at accordion.css. Embed it into your application's existing styling

@import '@vadimfilimonov/accordion/accordion.css';

or add styles for accordion's content like this:

.js-accordion + * {
    overflow: hidden;
    height: 0;
    transition: height 0.5s;
}