catalog-ui/src/app/ng2/pages/composition/palette/palette.component.less

   1 @import "./../../../../../assets/styles/override";
   2
   3 :host(composition-palette) {
   4   display:flex;
   5   flex: 0 0 244px;
   6 }
   7
   8 sdc-loader.inactive {
   9   display:none;
  10 }
  11
  12 :host ::ng-deep .sdc-filter-bar .sdc-input {
  13   margin-bottom:0px;
  14 }
  15 :host ::ng-deep .sdc-loader-wrapper {
  16   position:static;
  17 }
  18
  19 .composition-palette-component {
  20   background-color: @sdcui_color_white;
  21   overflow-y: auto;
  22   overflow-x: hidden;
  23   display: flex;
  24   flex-direction: column;
  25   position:relative;
  26   width: 244px;
  27   box-shadow: 7px -3px 6px -8px @sdcui_color_gray;
  28
  29   .palette-elements-count {
  30     background-color: @sdcui_color_gray;
  31     line-height: 40px;
  32     padding: 0 17px;
  33     color: @sdcui_color_white;
  34     .palette-elements-count-value {
  35       float: right;
  36     }
  37   }
  38
  39   .palette-elements-list {
  40
  41     .no-elements-found {
  42       padding-left: 40px;
  43     }
  44     /deep/ .palette-category {
  45       display: flex;
  46       margin: 0px;
  47       .sdc-accordion-header {
  48         background-color: @sdcui_color_silver;
  49         margin: 0px;
  50         line-height: 40px;
  51         padding: 0px 10px;
  52       }
  53       .sdc-accordion-body {
  54         padding: 0px;
  55       }
  56     }
  57     .palette-subcategory {
  58       padding: 0 10px;
  59       background-color: @sdcui_color_lighter-silver;
  60       line-height: 35px;
  61     }
  62   }
  63 }
  64
  65 #draggable_element {
  66   display: inline-block;
  67   border-radius: 50%;
  68   background: transparent;
  69   position: absolute;
  70   top: -9999px;
  71   left: 0;
  72   z-index: 100;
  73 }
  74
  75 .invalid-drag {
  76   border: 7px solid @red-shadow;
  77 }
  78
  79 .valid-drag {
  80   border: 7px solid @green-shadow;
  81 }
  82
  83 @green-shadow: rgba(29, 154, 149, 0.3);
  84 @red-shadow: rgba(218, 31, 61, 0.3);