Fix for substitution filter properties
[sdc.git] / catalog-ui / src / app / ng2 / components / logic / substitution-filter / substitution-filter.component.less
1 /*-
2  * ============LICENSE_START=======================================================
3  * SDC
4  * ================================================================================
5  * Copyright (C) 2020 Nordix Foundation. All rights reserved.
6  * ================================================================================
7  * Licensed under the Apache License, Version 2.0 (the "License");
8  * you may not use this file except in compliance with the License.
9  * You may obtain a copy of the License at
10  *
11  *      http://www.apache.org/licenses/LICENSE-2.0
12  *
13  * Unless required by applicable law or agreed to in writing, software
14  * distributed under the License is distributed on an "AS IS" BASIS,
15  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16  * See the License for the specific language governing permissions and
17  * limitations under the License.
18  * ============LICENSE_END=========================================================
19  */
20
21 @import './../../../../../assets/styles/variables.less';
22 @import './../../../../../assets/styles/variables-old.less';
23 @import './../../../../../assets/styles/mixins_old.less';
24 @import './../../../../../assets/styles/mixins.less';
25
26 .substitution-filter {
27
28   .i-sdc-designer-sidebar-section-content-substitution-filter-section {
29     .i-sdc-designer-sidebar-section-content-substitution-filter {
30       border-bottom: 1px solid @main_color_o;
31       padding: 5px 10px 5px 18px;
32       position: relative;
33       height: 61px;
34       display: flex;
35       align-items: center;
36       justify-content: space-between;
37
38       .rule-details {
39         // .s_1;
40         display: flex;
41         flex: 1;
42         align-items: center;
43         justify-content: space-between;
44         margin-left: 5px;
45         width: 180px;
46         .delete-icon {
47           visibility: hidden;
48         }
49         &:not(.readonly):hover {
50           .a_1;
51         }
52         &:hover .delete-icon{
53           visibility: visible;
54         }
55         &.readonly {
56           opacity: 0.5;
57         }
58       }
59       .rule-desc {
60         .sdc-ellipsis;
61         width: 220px;
62         position: relative;
63         padding-right: 1em;
64       }
65
66     }
67   }
68   .w-sdc-designer-sidebar-section-substitution-filter-footer {
69     margin-top: 10px;
70     margin-bottom: 10px;
71     text-align: center;
72     width: 100%;
73   }
74   .w-sdc-designer-sidebar-section-substitution-filter-footer-action {
75     width: 180px;
76     margin-top: 10px;
77   }
78 }
79
80 /deep/.sdc-accordion {
81   margin-bottom: 0;
82   display: grid;
83
84   .sdc-accordion-header {
85     background-color: #e6f6fb;
86     border-left: solid #009fdb 4px;
87     box-shadow: 0 0px 3px -1px rgba(0, 0, 0, 0.3);
88     margin-bottom: 2px;
89     width: auto;
90     height: auto;
91     padding: 10px;
92     color: #666666;
93     font-family: OpenSans-Semibold, sans-serif;
94     font-size: 14px;
95   }
96
97   .sdc-accordion-body.open {
98     padding-left: 0;
99     padding-top: 0;
100     .sdc-accordion-header { /*Second level - nested accordion */
101       background-color: #f8f8f8;
102       padding: 4px 20px 4px 37px;
103       border-bottom: 1px solid #d2d2d2;
104       border-left:none;
105       height: 30px;
106     }
107   }
108 }