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

   1 .expandable-input-top {
   2     display: flex;
   3     height: 22px;
   4     .expandable-input-wrapper {
   5         display: flex;
   6         &.closed {
   7             .svg-icon {
   8                 &.__search {
   9                     height: 17px;
  10                     width: 17px;
  11                     transition: fill 0.5s ease-in;
  12                     fill: $blue;
  13                     cursor: pointer;
  14                     &:hover {
  15                         transition: fill 0.5s ease-in;
  16                         fill: $dark-blue;
  17                     }
  18                 }
  19             }
  20         }
  21         &.opened {
  22             .svg-icon-wrapper {
  23                 margin-left: 3px;
  24             }
  25             .svg-icon {
  26                 &.__search {
  27                     height: 17px;
  28                     width: 17px;
  29                     fill: $dark-blue;
  30                 }
  31             }
  32             .svg-icon {
  33                 &.__close {
  34                     margin-left: 7px;
  35                     opacity: 0.6;
  36                     fill: $dark-gray;
  37                     &:hover {
  38                         opacity: 1;
  39                     }
  40                 }
  41             }
  42         }
  43         .expandable-input-control {
  44             .form-control {
  45                 border: none;
  46                 background-color: transparent;
  47                 border-radius: 0;
  48                 border-bottom: 1px solid $gray;
  49                 height: 22px;
  50                 padding: 0 5px;
  51             }
  52             margin: 0;
  53         }
  54     }
  55 }