openecomp-ui/resources/scss/modules/onboardingCatalog/_vspOverlay.scss

   1 .vsp-overlay-wrapper{
   2   display:flex;
   3   align-items: center;
   4   position:absolute;
   5   left: 68%;
   6   top: 14%;
   7   height: 100%;
   8   pointer-events: none;
   9   z-index: 100;
  10   .vsp-overlay-list {
  11         padding: 0 20px;
  12   }
  13   .vsp-overlay-arrow {
  14         border-style: solid;
  15         position: relative;
  16         bottom: -18px;
  17         border-width: 6px;
  18         border-left-width: 2px;
  19         border-color: transparent;
  20         border-right-color: $light-gray;
  21         &:after {
  22           position: absolute;
  23           border-style: solid;
  24           bottom: -10px;
  25           left: -9px;
  26           border-width: 10px;
  27           border-color: transparent;
  28           border-right-color: $white;
  29           content:' ';
  30         }
  31   }
  32   .vsp-overlay {
  33         pointer-events: all;
  34         width: 205px;
  35         cursor: default;
  36         background-color: $white;
  37         @include box-shadow(0px 2px 9.2px 0.8px rgba(24, 24, 25, 0.25));
  38         border-radius: 6px;
  39         padding: 0 0 10px 0;
  40         display: flex;
  41         flex-direction: column;
  42         margin: 10px 0 10px 0;
  43         .vsp-overlay-title {
  44           @extend .heading-5-medium;
  45           margin-bottom: 15px;
  46           padding: 10px 20px 10px 20px;
  47           background: $highlight-gray;
  48                 color: $text-black;
  49           text-transform: uppercase;
  50           border-radius: 6px 6px 0 0;
  51         }
  52         .vsp-overlay-detail{
  53           @extend .body-2;
  54           &:hover {
  55                 color: $blue;
  56           }
  57           text-transform: uppercase;
  58           @include ellipsis(auto, block);
  59           border-bottom: 1px solid $tlv-light-gray;
  60           cursor: pointer;
  61           padding: 5px 0 5px 0;
  62           &:last-child {
  63                 border-bottom: none;
  64           }
  65         }
  66         .vsp-overlay-see-more{
  67           color: $blue;
  68           cursor: pointer;
  69           margin-top: 12px;
  70           align-self:center;
  71         }
  72
  73   }
  74 }