gistfile1.txt

<template>
  <div>
    <b-navbar toggleable="md" type="dark" variant="primary"
              class="navbar-shadow mb-3">
      <b-container>
        <b-navbar-brand to="/">
          <div class="d-inline-block ">
            <b-img class="logo-box" style="margin-top: -4px" src="~static/img/ball.svg"></b-img>
          </div>
          Теннис онлайн
        </b-navbar-brand>
        <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
        <b-collapse id="nav-collapse" is-nav>
          <b-navbar-nav>
            <b-nav-item to="/program/week-1" exact-active-class="active">Программа</b-nav-item>
            <b-nav-item to="/author" exact-active-class="active">Об авторе</b-nav-item>
          </b-navbar-nav>
        </b-collapse>
      </b-container>
    </b-navbar>
  </div>
</template>

<script lang="ts">
  import { Component, Vue } from 'vue-property-decorator'

  @Component export default class extends Vue {
  }
</script>

<style lang="scss" scoped>

  .logo-box {
    width: 20px;

  }

  .navbar-shadow {
    -webkit-box-shadow: 0px 0.25rem 0.25rem rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0.25rem 0.25rem rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0.25rem 0.25rem rgba(0, 0, 0, 0.25);
  }

</style>