@megalabs/ml-notification

Notification Error

Уведомление об ошибке

<div class="ml-notification ml-notification--error">
    <i>
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
            <path d="M10 15c-.5523 0-1-.4477-1-1s.4477-1 1-1 1 .4477 1 1-.4477 1-1 1zM9 5h2v6H9V5zm1 13c-4.4183 
                     0-8-3.5817-8-8s3.5817-8 8-8 8 3.5817 8 8-3.5817 8-8 8zm0-1c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 
                     3.134-7 7 3.134 7 7 7z"></path>
        </svg>
    </i>
    Error
</div>

Notification Accept

Уведомление о корректности введенных данных

<div class="ml-notification ml-notification--accept">
    <i>
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
            <path d="M12.8588 7.25L8.77 12.4739 6.6773 9.9695l-.763.6368 2.5536 3.0562.6318.0025 
                     4.541-5.803-.7819-.612zM10 18c-4.4183 0-8-3.5817-8-8s3.5817-8 8-8 8 3.5817 
                     8 8-3.5817 8-8 8zm0-1c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7z"></path>
        </svg>
    </i>
    Accept
</div>

Notification Warning

Уведомление-предупреждение

<div class="ml-notification ml-notification--warning">
    <i>
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
            <path d="M10 15c-.5523 0-1-.4477-1-1s.4477-1 1-1 1 .4477 1 1-.4477 1-1 1zM9 5h2v6H9V5zm1 
                     13c-4.4183 0-8-3.5817-8-8s3.5817-8 8-8 8 3.5817 8 8-3.5817 8-8 8zm0-1c3.866 0 7-3.134 
                     7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7z"></path>
        </svg>
    </i>
    Warning
</div>

Notification Info

Информационное уведомление

<div class="ml-notification ml-notification--info">
    <i>
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
            <path d="M10 15c-.5523 0-1-.4477-1-1s.4477-1 1-1 1 .4477 1 1-.4477 1-1 1zM9 5h2v6H9V5zm1 
                     13c-4.4183 0-8-3.5817-8-8s3.5817-8 8-8 8 3.5817 8 8-3.5817 8-8 8zm0-1c3.866 
                     0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7z">
            </path>
        </svg>
    </i>
    Info
</div>

Notification Secondary

Уведомление с вторичной информацией

<div class="ml-notification ml-notification--secondary">
    Secondary info
</div>

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

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

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

Расширенные настройки

Вид ml-notification зависит от класса модификатора

ml-notification--error - ошибка

ml-notification--accept - принято

ml-notification--warning - предупреждение

ml-notification--info - информация

ml-notification--secondary - дополнительно