Modal Type 1

Текстовый блок с кнопкой

<div class="ml-modal1">
    <span class="ml-modal1__close">
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
            <path d="M10 9.265L15.2651 4 16 4.735 10.735 10 16 15.265l-.7349.735L10 10.735 4.7349 16 4 15.265 9.265 10 4 4.735 4.7349 4 10 9.265z"></path>
        </svg>
    </span>
    <div class="ml-modal1__body">
        <h4>Title H4</h4>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
            magna aliqua.</p>
        <a href="#" class="ml-button ml-button--wide">Button</a>
    </div>
</div>
            

Modal Type 2

Текстовый блок с кнопкой и пагинатором

<div class="ml-modal2">
    <div class="ml-modal2__body">
        <h4>Title H4</h4>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        <div class="ml-modal2__nav">
            <div class="ml-modal2__dots">
                <div class="ml-pagination">
                    <span class="ml-pagination__item is-active"></span>
                    <span class="ml-pagination__item"></span>
                    <span class="ml-pagination__item"></span>
                    <span class="ml-pagination__item"></span>
                </div>
            </div>
            <div class="ml-modal2__next">
                <a href="#" class="ml-button ml-button--wide">Next</a>
            </div>
        </div>
    </div>
</div>

Modal Type 3

Текстовый блок с выпадающим списком и картинкой

<div class="ml-modal3">
    <span class="ml-modal3__service">
        Service
    </span>
    <span class="ml-modal3__new">
        new
    </span>
    <div class="ml-modal3__body">
        <h5>Text H5</h5>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        <img src="http://via.placeholder.com/352x120" alt="" class="ml-modal3__image">
    </div>
</div>

npm репозиторий - [https://www.npmjs.com/package/@megalabs/ml-modal] (https://www.npmjs.com/package/@megalabs/ml-modal)

Для установки пакета

• npm i @megalabs/ml-modal
• затем в папке @megalabs/ml-modal запускаем npm install
• npm start