catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-interface-operation.component.less

   1 /*
   2  * ============LICENSE_START=======================================================
   3  *  Copyright (C) 2021 Nordix Foundation
   4  *  ================================================================================
   5  *  Licensed under the Apache License, Version 2.0 (the "License");
   6  *  you may not use this file except in compliance with the License.
   7  *  You may obtain a copy of the License at
   8  *
   9  *        http://www.apache.org/licenses/LICENSE-2.0
  10  *  Unless required by applicable law or agreed to in writing, software
  11  *  distributed under the License is distributed on an "AS IS" BASIS,
  12  *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  *  See the License for the specific language governing permissions and
  14  *  limitations under the License.
  15  *
  16  *  SPDX-License-Identifier: Apache-2.0
  17  *  ============LICENSE_END=========================================================
  18  */
  19
  20 @import '../../../../../../../assets/styles/variables.less';
  21 @import '../../../../../../../assets/styles/override.less';
  22
  23 .operation-creator-interface-definition {
  24   font-family: @font-opensans-regular;
  25   user-select: none;
  26   padding-top: 12px;
  27   padding-bottom: 20px;
  28
  29   .i-sdc-form-label {
  30     font-size: 12px;
  31   }
  32
  33   .w-sdc-form .i-sdc-form-item {
  34     margin-bottom: 15px;
  35   }
  36
  37   textarea {
  38     min-height: 74px;
  39     margin-bottom: 18px;
  40   }
  41
  42   /deep/ .sdc-dropdown__component-container {
  43     .sdc-dropdown__header {
  44       height: 38px;
  45       line-height: 35px;
  46
  47       svg-icon {
  48         margin: 13px 6px;
  49       }
  50     }
  51   }
  52
  53   /deep/ .sdc-input {
  54     margin-bottom: 0;
  55
  56     .sdc-input__input {
  57       height: 38px;
  58     }
  59   }
  60
  61   .side-by-side {
  62     display: flex;
  63
  64     .form-item {
  65       flex: 1;
  66
  67       &:first-child {
  68         margin-right: 14px;
  69         flex-basis: 37%;
  70         flex-grow: 0;
  71         flex-shrink: 0;
  72       }
  73
  74       &:nth-child(3) {
  75         margin-left: 14px;
  76         flex: 0.4;
  77       }
  78
  79       .i-sdc-form-file-upload {
  80         height: 37px;
  81         margin-bottom: 0;
  82
  83         .i-sdc-form-file-name {
  84           padding: 8px 10px;
  85         }
  86
  87         .i-sdc-form-file-upload-x-btn {
  88           top: 13px;
  89         }
  90
  91         .file-upload-browse-btn {
  92           height: 100%;
  93           padding: 7px 6px;
  94           z-index: 1;
  95         }
  96       }
  97
  98     }
  99   }
 100
 101   .archive-warning {
 102     font-family: @font-opensans-bold;
 103     color: @main_color_i;
 104   }
 105
 106   .no-workflow-warning {
 107     font-family: @font-opensans-bold;
 108     color: @sdcui_color_red;
 109     float: right;
 110   }
 111
 112   .input-param-title {
 113     font-size: 16px;
 114     text-transform: uppercase;
 115   }
 116
 117   .separator-buttons {
 118     display: flex;
 119     justify-content: space-between;
 120     margin-top: 10px;
 121
 122     .add-param-link {
 123       &:not(.disabled):hover {
 124         cursor: pointer;
 125       }
 126     }
 127
 128     .tab {
 129       width: 84px;
 130       text-align: center;
 131     }
 132   }
 133
 134   .generic-table {
 135     max-height: 244px;
 136     min-height: 91px;
 137     background: @main_color_p;
 138
 139     .header-row .header-cell {
 140       .info-icon {
 141         float: right;
 142         position: relative;
 143         top: 2px;
 144       }
 145       /deep/ .tooltip-inner {
 146         padding: 2px;
 147         max-width: 270px;
 148         font-size: 11px;
 149       }
 150       &.remove {
 151         padding: 10px;
 152         font-size: 10px;
 153       }
 154     }
 155
 156     .data-row {
 157       &.empty-msg {
 158         .bold-message {
 159           font-family: @font-opensans-bold;
 160         }
 161
 162         :first-child {
 163           &:not(:only-child) {
 164             margin: 6px 0;
 165           }
 166         }
 167
 168         display: flex;
 169         flex-direction: column;
 170         justify-content: center;
 171         align-items: center;
 172         padding: 14px;
 173       }
 174     }
 175
 176     /deep/ .cell {
 177       &.field-name, &.field-type {
 178         flex: 1;
 179       }
 180
 181       &.field-property {
 182         &, &:last-child {
 183           flex: 1;
 184         }
 185       }
 186
 187       &.field-mandatory {
 188         flex: 0.5;
 189         text-align: center;
 190       }
 191
 192       &.remove {
 193         min-width: 40px;
 194         max-width: 40px;
 195       }
 196     }
 197
 198   }
 199
 200   .create-interface-operation-footer {
 201     border-top: solid 1px #eaeaea;
 202     padding: 10px;
 203     margin: 10px;
 204     display: flex;
 205     justify-content: flex-end;
 206     align-items: center;
 207     sdc-button {
 208       margin: 0 5px;
 209     }
 210   }
 211 }