openecomp-ui/resources/scss/components/_navigationSideBar.scss

   1 .software-product-navigation-side-bar {
   2   width: 245px;
   3   height: 100%;
   4   background-color: $white;
   5   border-right: 1px solid $light-gray;
   6   box-shadow: 1px -1px 3px 0px $tlv-light-gray;
   7   border-bottom: 0;
   8
   9   .navigation-side-content {
  10     overflow: hidden;
  11     height: 100%;
  12
  13     .navigation-group {
  14       height: 100%;
  15       display: flex;
  16       flex-direction: column;
  17       background-color: $tlv-gray;
  18       .group-name {
  19         @extend .heading-5-medium;
  20         @include ellipsis;
  21         min-height: 56px;
  22         display: block;
  23         padding: 18px 12px 16px 40px;
  24         background-color: $white;
  25         border-bottom: 1px solid $tlv-light-gray;
  26       }
  27     }
  28
  29     .navigation-group-items {
  30       padding-left: 20px;
  31       overflow-y: auto;
  32
  33       .navigation-group-item {
  34         @extend .body-1;
  35         cursor: pointer;
  36         margin: 18px 0;
  37         padding-left: 20px;
  38         color: $dark-gray;
  39         line-height: 17px;
  40         &.selected-item {
  41           padding-left: 0;
  42           .collapse.in {
  43             padding-left: 20px;
  44           }
  45         }
  46         .navigation-group-item-name {
  47           @include ellipsis;
  48           white-space: normal;
  49           &.selected {
  50             @extend .body-1-medium;
  51             border-left: 4px solid $blue;
  52             padding-left: 18px;
  53             color: $blue;
  54           }
  55           &.bold-name {
  56             @extend .body-1-medium;
  57           }
  58         }
  59       }
  60     }
  61   }
  62 }