catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.less

   1 @import '../../../../../assets/styles/variables.less';
   2 .flat-children-container {
   3     .dynamic-property-row {
   4         /*create nested left border classes for up to 10 levels of nesting*/
   5         .nested-border-loop(@i) when (@i > 0) {
   6             @size: (@i - 1) *2;
   7             &.nested-level-@{i} .table-cell:first-child {
   8                 border-left: ~"solid @{size}px #009fdb";
   9             }
  10             .nested-border-loop(@i - 1)
  11         }
  12         .nested-border-loop(10);
  13     }
  14     dynamic-property {
  15         &:first-child .dynamic-property-row.with-top-border {
  16             border-top:solid 1px #d2d2d2;
  17         }
  18         &:not(:last-child) .dynamic-property-row {
  19             border-bottom:solid 1px #d2d2d2;
  20         }
  21     }
  22 }
  23 .dynamic-property-row {
  24     display:flex;
  25     flex-direction:row;
  26     align-items: stretch;
  27
  28     .table-cell {
  29         flex: 1;
  30         padding:9px;
  31         justify-content: center;
  32         overflow: hidden;
  33         text-overflow: ellipsis;
  34         white-space: nowrap;
  35
  36         &:first-child {
  37             flex: 0 0 50%;
  38             border-right:#d2d2d2 solid 1px;
  39             &:only-of-type {
  40                 flex: 1 1 100%;
  41                 border-right:none;
  42             }
  43         }
  44         &.empty {
  45             height:40px;
  46         }
  47     }
  48     .property-icon {
  49         flex: 0 0 auto;
  50         margin-right:10px;
  51         align-self:center;
  52         cursor:pointer;
  53     }
  54
  55 }
  56
  57 .filtered {
  58     /deep/ .checkbox-label-content{
  59         background-color: yellow;
  60     }
  61 }
  62 .inner-cell-div{
  63     max-width: 100%;
  64     text-overflow: ellipsis;
  65     overflow: hidden;
  66     display: inline;
  67     padding-left: 8px;
  68 }
  69 .error {
  70     border: solid 1px @func_color_q;
  71     color: @func_color_q;
  72     outline: none;
  73     box-sizing: border-box;
  74 }