Misago/frontend/style/misago/navbar.less

//
// Misago Navbar
// --------------------------------------------------


// Remove bottom margin from navbar
.navbar {
  margin-bottom: 0px;
}

// Desktop navbar
.navbar .navbar-full {
  // Brand
  .navbar-brand {
    &>* {
      display: inline-block;
    }

    img {
      height: 16px;
    }
  }

  // Pull Guest and User menus to right
  .nav-guest, .nav-user {
    float: right;

    .navbar-btn {
      margin-left: @navbar-padding-horizontal;
    }
  }

  // User avatar size
  .nav-user .dropdown-toggle {
    padding: (@navbar-height - @navbar-avatar-size) / 2;

    img {
      width: @navbar-avatar-size;
      height: @navbar-avatar-size;
    }
  }
}


// Compact (mobile) navbar
.navbar ul.navbar-compact-nav {
  margin: 0px;
  display: table;
  width: 100%;

  &>li {
    display: table-cell;
  }

  &>li>a, &>li>button {
    background: none;
    border: none;
    margin: 0px;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100%;

    color: @navbar-default-link-color;
    text-align: center;

    &:hover, &:focus {
      color: @navbar-default-link-hover-color;
      background-color: @navbar-default-link-hover-bg;
    }

    &>img {
      width: @navbar-compact-item-size;
      height: @navbar-compact-item-size;
    }
  }

  &>li>button {
    padding-top:    10px;
    padding-bottom: 10px;
  }

  &>li>a>.material-icon {
    font-size: @navbar-compact-item-size;
    line-height: @navbar-compact-item-size;
  }
}

// Make navbar's height match compact nav
@media (max-width: (@grid-float-breakpoint - 1)) {
  .navbar.navbar-misago {
    min-height: auto;
  }
}