mvue-afrigis-bootstrap4-header v1.1.5

afrigis-bootstrap4-header

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your unit tests

npm run test:unit

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

Add to project

npm install @afrigis/vue-afrigis-bootstrap4-header

import AgBs4Header from '@afrigis/vue-afrigis-bootstrap4-header';

<template>
  <div id="app">
    <ag-header>
      <template v-slot:logo>
        <router-link to="/" class="navbar-brand">
          <img src="https://www.afrigis.co.za/wp-content/uploads/2018/01/AfriGIS_Logo_20h.png" alt="AfriGIS Logo" class="logo" />
        </router-link>
      </template>
      <template v-slot:menu>
        <ul class="navbar-nav ml-auto">
          <li class="nav-item dropdown">
            <button
              aria-haspopup="true"
              aria-expanded="false"
              class="nav-link dropdown-toggle btn btn-link"
              data-toggle="dropdown"
              id="navbarDropdown"
              role="button"
            >Menu</button>
            <div class="dropdown-menu dropdown-menu-right">
              <button class="dropdown-item" type="button">Action</button>
              <button class="dropdown-item" type="button">Another action</button>
              <button class="dropdown-item" type="button">Something else here</button>
            </div>
          </li>
        </ul>
      </template>
    </ag-header>
    ....
  </div>
</template>