re base code
[sdc.git] / catalog-ui / src / app / ng2 / components / logic / properties-table / properties-table.component.less
index 20da0b6..72f67e4 100644 (file)
@@ -1,4 +1,4 @@
-@import './../../../../../assets/styles/variables.less';
+@import './../../../../../assets/styles/mixins.less';
 @import '../../../../../assets/styles/sprite';
 @smaller-screen: ~"only screen and (max-width: 1580px)";
 
     text-align:left;
 
 
-    .inner-cell-div{
-        max-width: 100%;
+    .inner-cell-div {
         text-overflow: ellipsis;
         overflow: hidden;
         height: 20px;
     }
 
+    .inner-cell-div-multiline {
+        max-width: 100%;
+    }
+
     .table-header {
         display: flex;
         flex-direction:row;
     .table-rows-header {
         border: #d2d2d2 solid 1px;
         border-top:none;
+        display: flex;
+        align-items: center;
+        .archive-label{
+            margin-left: 10px;
+        }
     }
 
     .table-body {
             .property-description-icon {
                 float: right;
                 margin-top: 4px;
-                margin-left: 5px;
+                margin-left: 15px;
                 flex: 0 0 auto;
             }
         }
         }
     }
 
+    .table-row {
+        /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+            background: linear-gradient(to right, transparent 0%, #ffffff 80%);
+            padding-left: 1em;
+        }
+
+        &.selected /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+            background: linear-gradient(to right, transparent 0%, #e6f6fb 80%);
+            padding-left: 1em;
+        }
+
+        &.readonly /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+            background: linear-gradient(to right, transparent 0%, #f8f8f8 80%);
+            padding-left: 1em;
+        }
+
+        &:hover:not(.selected) /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+            background: linear-gradient(to right, transparent 0%, #f8f8f8 80%);
+            padding-left: 1em;
+        }
+    }
+
+    .prop-instance-icon {
+        vertical-align: middle;
+        margin-right: 7px;
+        &.defaulticon.small {
+            background-color: @main_color_q;
+            border-radius:14px;           
+        }
+        // square icons
+        &.icon-group {
+            .square-icon();
+            background-color: @main_color_a;
+
+            &::before {
+                content: "G";
+            }
+        }
+        &.icon-policy {
+            .square-icon();
+            background-color: @main_color_r;
+
+            &::before {
+                content: "P";
+            }
+        }
+
+    }
 }