@megalabs/ml-botbar

Bottom_Bar Type 1

Bottom_Bar с кнопкой

<div class="ml-botbar ml-botbar--type1">
    <div class="ml-botbar__left">
        <a href="#" class="ml-button ml-botbar__button"><span>Подключить услугу</span></a>
    </div>
    <div class="ml-botbar__right">
        <div class="ml-botbar__menu">
            <a href="#">Вопросы и ответы</a>
            <a href="#">Тарифы</a>
        </div>
    </div>
</div>

Bottom_Bar Type 2

Bottom_Bar с двумя кнопками

<div class="ml-botbar ml-botbar--type2">
    <div class="ml-botbar__left">
        <a href="#" class="ml-button ml-botbar__button"><span>Подключить услугу</span></a>
    </div>
    <div class="ml-botbar__right">
        <div class="ml-botbar__menu">
            <a href="#">Вопросы и ответы</a>
            <a href="#">Тарифы</a>
        </div>
        <a href="#" class="ml-botbar__btn">База заний</a>
    </div>
</div>

Bottom_Bar Type 3

Bottom_Bar с кнопками и иконкой

<div class="ml-botbar ml-botbar--type3">
    <div class="ml-botbar__left">
        <a href="#" class="ml-button ml-botbar__button"><span>Подключить услугу</span></a>
    </div>
    <div class="ml-botbar__right">
        <div class="ml-botbar__menu">
            <a href="#">Вопросы и ответы</a>
            <a href="#">Тарифы</a>
        </div>
        <a href="#" class="ml-botbar__btn">База заний</a>
        <div class="ml-botbar__icon">
            <a href="#" class="ml-button-icon ml-topbar__item">
                <span class="ml-button-icon__icon">
                     <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
                         <g fill="#333">
                             <path d="M26.71 10.65h-1.53c-.4037-4.3449-4.0564-7.6635-8.42-7.65h-1.52C10.8984 
                                      2.959 7.2811 6.3173 7 10.65H5.29A3.22 3.22 0 0 0 2 13.94V17a3.19 3.19 
                                      0 0 0 3.29 3.29H9v-8.64A7.56 7.56 0 0 1 9.19 10 19.33 19.33 0 0 0 
                                      19 12.65h4.24L23 20.82c0 1.87-.56 3.84-2.06 4.12-.2738-1.6892-1.7288-2.9327-3.44-2.94h-2c-1.933 
                                      0-3.5 1.567-3.5 3.5s1.567 3.5 3.5 3.5h2a3.5 3.5 0 0 0 3.15-2c2.64 0 
                                      4.35-2.45 4.35-6.15v-.56h1.69A3.19 3.19 0 0 0 30 17v-3.06a3.22 3.22 0 0 
                                      0-3.29-3.29zM7 18.29H5.29C4.5798 18.2846 4.0054 17.7102 4 
                                      17v-3.06c.0054-.7102.5798-1.2846 1.29-1.29H7v5.64zM17.5 27h-2c-.8284 
                                      0-1.5-.6716-1.5-1.5s.6716-1.5 1.5-1.5h2c.8284 0 1.5.6716 1.5 1.5s-.6716 
                                      1.5-1.5 1.5zM9.91 8.09A6 6 0 0 1 15.24 5h1.53c3.2545-.0044 6.0008 2.42 
                                      6.4 5.65H19a17.31 17.31 0 0 1-9.09-2.56zM28 17c-.0054.7102-.5798 1.2846-1.29 
                                      1.29h-1.64l.14-5.65h1.5c.714.0055 1.29.586 1.29 1.3V17z">
                             </path>
                             <circle cx="12.5" cy="15.5" r="1.5"></circle>
                             <circle cx="19.5" cy="15.5" r="1.5"></circle>
                         </g>
                     </svg>
                </span>
            </a>
        </div>
    </div>
</div>

Bottom_Bar Type 4

Bottom_Bar с кнопкой и ссылками на скачивание приложения

<div class="ml-botbar ml-botbar--type4">
    <div class="ml-botbar__left">
        <a href="#" class="ml-button ml-botbar__button"><span>Подключить услугу</span></a>
    </div>
    <div class="ml-botbar__right">
        <div class="ml-botbar__menu">
            <a href="#">Вопросы и ответы</a>
            <a href="#">Тарифы</a>
        </div>
        <div class="ml-botbar__icon">
            <a href="#" class="ml-badge3">
                <img src="/components/ml-badges/dist/img/ios.png" srcset="/components/ml-badges/dist/img/[e-mail]"
                     alt="" class="ml-badge3__img">
            </a>
        </div>
        <div class="ml-botbar__icon">
            <a href="#" class="ml-badge3">
                <img src="/components/ml-badges/dist/img/android.png"
                     srcset="/components/ml-badges/dist/img/[e-mail] 2x" alt="" class="ml-badge3__img">
            </a>
        </div>
    </div>
</div>

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

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

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