ManageIQ/manageiq-ui-classic

#main-menu {
  @import '~@carbon/themes/scss/themes';
  $carbon--theme: $carbon--theme--g90;

  @include carbon--theme();

  @import './menu-colors.scss';

  *:focus {
    outline-color: $focus;
  }

  list-style: none;

  ul ul {
    list-style: none;
    padding: 0;
  }

  .bx--side-nav__navigation.bx--side-nav.bx--side-nav--expanded.secondary {
    width: fit-content;
    max-width: 30rem;
    min-width: 16rem;
  }

  // sizing
  .bx--side-nav.secondary {
    left: 16rem;

    .bx--side-nav__link-text {
      font-weight: 400;
    }

    // ensure secondary overflow auto has the right height to work with
    .bx--side-nav__items {
      height: 100vh;
    }
  }

  .bx--side-nav__header.padded,
  .bx--side-nav__item.padded {
    padding: 0 1rem;
  }

  .bx--side-nav__header,
  .bx--side-nav__link,
  .bx--side-nav__submenu,
  .menu-collapse,
  .menu-collapse-button {
    height: 48px;
  }

  .bx--side-nav__submenu:hover {
    background-color: #666666;
  }

  .bx--side-nav__hr {
    margin: 16px 0 0 0;
  }

  .bx--side-nav--expanded {
    .bx--side-nav__hr {
      margin: 16px 16px 0 16px;
    }
  }

  .menu-collapse {
    border-top: solid 1px #3d3d3d;

    ul.menu-collapse-list {
      padding-top: 0;
    }

    .menu-collapse-button {
      margin-left: auto;
      padding: 14px;
      width: 48px;
    }
  }

  .menu-search-title {
    font-size: small;
    margin-bottom: 0;
    margin-top: 5px;
  }

  .menu-search-parent {
    font-size: smaller;
    font-weight: 400;
    margin-bottom: 5px;
  }

  .menu-user,
  .menu-group li {
    @include carbon--type-style('helper-text-01');
  }

  .vertical-center {
    display: flex;
    align-items: center;
    padding: 0 !important;

    &:hover {
      background-color: $row-active-primary-bg;
    }

    .search_div {
      height: 32px;
      width: 48px;
      padding: 0 1rem;
      padding-top: 6px;
    }
  }

  .menu-user,
  .menu-user > li {
    height: 40px;
  }

  .menu-group {
    height: 32px;
    margin-bottom: 8px;

    .bx--list-box--expanded .bx--list-box__menu {
      position: fixed;
      width: 224px;
      margin-left: 16px;
      margin-top: 1px;
    }

    & .bx--dropdown,
    & > li {
      height: 32px;
    }

    & .bx--dropdown__wrapper {
      padding: 0 1rem;
    }
  }

  .menu-search {
    height: 32px;
  }

  .collapse_icon {
    display: flex;
    align-items: center;
  }

  .bx--side-nav__item {
    .bx--tooltip__trigger {
      position: fixed;

      &::before {
        border-color: transparent $inverse-01 transparent transparent !important;
      }

      .pficon {
        color: #f4f4f4;
      }

      svg {
        fill: #f4f4f4;
      }

      .bx--assistive-text {
        background-color: $inverse-01;
        color: $text-04;
      }
    }
  }
}

.layout-pf.layout-pf-fixed {
  .miq-main-menu-collapsed {
    .container-pf-nav-pf-vertical {
      margin-left: 48px;
    }
  }

  .miq-main-menu-expanded {
    .container-pf-nav-pf-vertical {
      margin-left: 256px;
    }
  }
}

// only appears when secondary menu is expanded
.miq-main-menu-overlay {
  background-color: #000;
  bottom: 0;
  left: 10rem;
  opacity: 0.5;
  position: fixed;
  right: 0;
  z-index: 1000;
}

.navbar-brand-name {
  height: 32px;
  // compensate for in-image padding
  margin: -4px 0 0 -8px;
}