Misago/uiframework/misago/css/flavor/navbar.less

//
// Forum Navbar
// --------------------------------------------------

.navbar {
  .navbar-brand {
    font-size: @font-size-large * 1.6;
  }

  .navbar-nav-user {
    .user-toggle {
      overflow: auto;

      img {
        border-radius: @border-radius-base;
        height: 32px;
      }
    }
  }
}

/* Navbar small dropdowns */
@media (max-width: @screen-sm-min) {
  .navbar {
    .dropdown-menu {
      li {
        form {
          button {
            padding: 3px 25px;
          }
        }

        a, &:link, &:visited, &:hover, &:active {
          .badge {
            background-color: @brand-danger;

            color: @dropdown-bg;
          }
        }
      }
    }
  }

  .navbar-default {
    .dropdown-menu {
      li {
        form {
          button {
            color: @navbar-default-link-color;

            &:hover {
              background: none;

              color: @navbar-default-link-hover-color;
            }

            &:active, &:focus {
              background: none;

              color: @navbar-default-link-active-color;
            }
          }
        }
      }
    }

    .dropdown.open {
      background: darken(@navbar-default-bg, 3%);
      border-bottom: 2px solid darken(@navbar-default-bg, 6%);

      .dropdown-toggle {
        &:link, &:active, &:visited, &:hover {
          background: darken(@navbar-default-bg, 6%);
        }
      }

      .dropdown-menu {
        li.divider {
          background-color: darken(@navbar-default-bg, 9%);
        }
      }
    }
  }

  .navbar-inverse {
    .dropdown-menu {
      button {
        color: @navbar-inverse-link-color;

        &:hover {
          background: none;

          color: @navbar-inverse-link-hover-color;
        }

        &:active, &:focus {
          background: none;

          color: @navbar-inverse-link-active-color;
        }
      }
    }

    .dropdown.open {
      background: lighten(@navbar-inverse-bg, 3%);
      border-left: 2px solid lighten(@navbar-inverse-bg, 6%);
      border-bottom: 2px solid lighten(@navbar-inverse-bg, 6%);

      .dropdown-menu {
        li.divider {
          background-color: lighten(@navbar-inverse-bg, 9%);
        }
      }
    }
  }
}

/* On big displays */
@media (min-width: @screen-sm-min) {
  .navbar-nav-user {
    .user-toggle {
      padding-left: 0px;
      padding-right: 0px;

      img {
        float: right;
        height: 32px;
        margin: -6px 0px;
        margin-left: 8px;
      }
    }

    .dropdown-menu {
      min-width: 256px;

      &:after {
        border: solid transparent;
        border-bottom-color: @dropdown-bg;
        border-width: 6px;
        content: "";
        height: 0;
        position: absolute;
        pointer-events: none;
        right: 10px;
        top: -11px;
        width: 0;
      }
    }
  }
}