POLICY-SDK-APP/src/main/webapp/app/policyApp/policy-models/Editor/css/main.css

   1 /*-
   2  * ============LICENSE_START=======================================================
   3  * ONAP Policy Engine
   4  * ================================================================================
   5  * Copyright (C) 2017 AT&T Intellectual Property. 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 body {
  22   padding-top: 55px;
  23   font-size: 14px;
  24 }
  25
  26 *,
  27 *:focus {
  28   outline: 0!important;
  29 }
  30
  31 .navbar {
  32   min-height: 32px;
  33 }
  34
  35 .navbar .navbar-toggle {
  36   padding: 5px 10px;
  37 }
  38
  39 .navbar .navbar-brand {
  40   font-size: inherit;
  41   height: 55px;
  42   line-height: 100%;
  43 }
  44
  45 .navbar .navbar-form {
  46   border-bottom: none;
  47   border-top: none;
  48   box-shadow: none;
  49   padding: 0 10px;
  50   margin-top: 10px;
  51 }
  52
  53 .breadcrumb {
  54   border-radius: 0;
  55 }
  56
  57 .breadcrumb .btn {
  58   margin-top: -5px;
  59 }
  60
  61 .btn.btn-pedefault {
  62         color: #444;
  63         background-color: #FAFAFA;
  64 }
  65
  66 .btn.btn-default {
  67   color: #444;
  68   background-color: #FAFAFA;
  69 }
  70
  71 .btn-add-remove {
  72   color: #444;
  73   background-color: #FAFAFA;
  74   margin-right: 12px;
  75   margin-bottom: 10px;
  76 }
  77
  78 .child_single {
  79   color: #444;
  80   background-color: #FAFAFA;
  81   margin-left: 0px;
  82   margin-bottom: 10px;
  83   border: 1px solid #ccc;
  84   border-radius: 4px;
  85 }
  86
  87 .children_group {
  88     color: #444;
  89     background-color: white;
  90     margin-left: 20px;
  91     margin-bottom: 20px;
  92     margin-top: 20px;
  93     margin-right: 20px;
  94     padding-top: 10px;
  95     padding-left: 10px;
  96     padding-right: 20px;
  97     padding-bottom: 10px;
  98     border: 1px solid #ccc;
  99     border-radius: 4px;
 100 }
 101
 102 .first_child {
 103         margin-top: 10px;
 104 }
 105
 106 .btn {
 107   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
 108   font-weight: 500;
 109   letter-spacing: .01em;
 110   border: none;
 111 }
 112
 113 textarea.code {
 114   font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
 115   font-size: 13px;
 116   min-height: 250px;
 117   resize: vertical;
 118   color: #000;
 119 }
 120
 121 .sub-header {
 122   padding-bottom: 10px;
 123   border-bottom: 1px solid #eee;
 124 }
 125
 126 .navbar-fixed-top {
 127   border: 0;
 128 }
 129
 130 .sidebar {
 131   display: none;
 132 }
 133
 134 .btn-go-back {
 135   margin-top: -5px;
 136 }
 137
 138 a:hover {
 139   text-decoration: none;
 140 }
 141
 142 .nav-sidebar {
 143   margin-right: -21px;
 144   margin-bottom: 20px;
 145   margin-left: -20px;
 146 }
 147
 148 .nav-sidebar > li > a {
 149   padding-right: 20px;
 150   padding-left: 20px;
 151 }
 152
 153 .nav-sidebar > .active > a,
 154 .nav-sidebar > .active > a:hover,
 155 .nav-sidebar > .active > a:focus {
 156   color: #fff;
 157   background-color: #2196F3;
 158 }
 159
 160 .main {
 161   padding: 0;
 162 }
 163
 164 .main .page-header {
 165   margin-top: 0;
 166 }
 167
 168 .file-tree ul.nav.nav-sidebar {
 169   margin: 0;
 170   padding: 0;
 171   padding-left: 12px;
 172 }
 173
 174 .file-tree ul.nav.nav-sidebar > li {
 175   border-left: 1px solid #ddd;
 176   padding-left: 4px;
 177 }
 178
 179 .file-tree ul.nav.nav-sidebar > li > a {
 180   padding: 2px 2px 2px 4px;
 181 }
 182
 183 .file-tree ul.nav.nav-sidebar:first-child {
 184   padding-left: 0;
 185 }
 186
 187 .file-tree ul.nav.nav-sidebar.file-tree-root > li {
 188   border-left: none;
 189   padding-left: 0px;
 190 }
 191
 192 .table td {
 193   vertical-align: middle;
 194 }
 195
 196 #context-menu {
 197   position: absolute;
 198   display: none;
 199   z-index: 9999;
 200 }
 201
 202 .iconset {
 203   padding: 10px;
 204 }
 205
 206 .col-120 {
 207   width: 100px;
 208   max-height: 100px;
 209   float: left;
 210   margin-bottom: 9px;
 211   margin-right: 9px;
 212 }
 213
 214 .col-120:last-child {
 215   margin-right: 0;
 216 }
 217
 218 .iconset .thumbnail {
 219   border-radius: 0;
 220   overflow: hidden;
 221   margin: 0;
 222   padding: 0;
 223   padding: 10px 0;
 224   border: none;
 225 }
 226
 227 .iconset .thumbnail .item-icon {
 228   font-size: 32px;
 229 }
 230
 231 .detail-sources {
 232   text-overflow: ellipsis;
 233   overflow: hidden;
 234   word-wrap: break-word;
 235 }
 236
 237 ::-webkit-scrollbar {
 238   width: 10px;
 239   height: 10px;
 240   background-color: #fff;
 241   box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px -1px 0 rgba(0, 0, 0, .07);
 242 }
 243
 244 ::-webkit-scrollbar:hover {
 245   background-color: #eee;
 246 }
 247
 248 ::-webkit-scrollbar-thumb {
 249   min-height: 0.8em;
 250   min-width: 0.8em;
 251   background-color: rgba(0, 0, 0, .2);
 252   box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px -1px 0 rgba(0, 0, 0, .07);
 253 }
 254
 255 ::-webkit-scrollbar-thumb:hover {
 256   background-color: #bbb;
 257 }
 258
 259 ::-webkit-scrollbar-thumb:active {
 260   background-color: #888;
 261 }
 262
 263 .dropdown-menu.dropdown-right-click {
 264   display: block;
 265   position: static;
 266   margin-bottom: 5px;
 267   font-size: 1em;
 268 }
 269
 270 .dropdown-menu.dropdown-right-click>li>a {
 271   padding: 5px 12px;
 272 }
 273
 274 .dropdown-menu.dropdown-right-click>li>a>i {
 275   font-size: .9em;
 276   margin-right: 1px;
 277 }
 278
 279 .dropdown-menu.dropdown-right-click .divider {
 280   margin: 3px 0;
 281 }
 282
 283 .spinner-wrapper {
 284   margin: 0 auto;
 285   text-align: center;
 286   margin-top: 8%;
 287 }
 288
 289 table th > a:hover,
 290 table th > a:active,
 291 table th > a:focus {
 292   text-decoration: none;
 293 }
 294
 295 .sortorder:after {
 296   color: #2196f3;
 297   content: '\25bc';
 298 }
 299
 300 .sortorder.reverse:after {
 301   color: #2196f3;
 302   content: '\25b2';
 303 }
 304
 305 [ng\:cloak], [ng-cloak],
 306 [data-ng-cloak], [x-ng-cloak],
 307 .ng-cloak, .x-ng-cloak {
 308   display: none !important;
 309 }
 310
 311 .mr2 {
 312   margin-right: 2px;
 313 }
 314
 315 .mr5 {
 316   margin-right: 5px;
 317 }
 318
 319 .mt10 {
 320   margin-top: 10px;
 321 }
 322
 323 .mb0 {
 324   margin-bottom: 0;
 325 }
 326
 327 .pointer {
 328   cursor: pointer;
 329 }
 330
 331 .block {
 332   display: block;
 333 }
 334
 335 .ellipsis {
 336   overflow: hidden;
 337   text-overflow: ellipsis;
 338   white-space: nowrap;
 339 }
 340
 341 .bold {
 342   font-weight: bold;
 343 }
 344
 345 @media (min-width: 768px) {
 346   .main {
 347     padding-right: 0;
 348     padding-left: 0;
 349   }
 350
 351   .sidebar {
 352     position: fixed;
 353     top: 50px;
 354     bottom: 0;
 355     left: 0;
 356     z-index: 1000;
 357     display: block;
 358     padding: 5px 0;
 359     overflow-x: hidden;
 360     overflow-y: auto;
 361     background-color: #f5f5f5;
 362     border-right: 1px solid #eee;
 363   }
 364 }
 365
 366 @media (max-width: 768px) {
 367   .navbar-form .btn {
 368     margin-top: 5px;
 369   }
 370 }
 371
 372 @media (max-width: 475px) {
 373   .table.table-files .btn {
 374     display: none;
 375   }
 376 }
 377
 378 /* Tooltip container */
 379 .tooltip {
 380     position: relative;
 381     display: inline-block;
 382     border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
 383 }
 384
 385 /* Tooltip text */
 386 .tooltip .tooltiptext {
 387     visibility: hidden;
 388     width: 120px;
 389     background-color: #555;
 390     color: #fff;
 391     text-align: center;
 392     padding: 5px 0;
 393     border-radius: 6px;
 394
 395     /* Position the tooltip text */
 396     position: absolute;
 397     z-index: 1;
 398     bottom: 125%;
 399     left: 50%;
 400     margin-left: -60px;
 401
 402     /* Fade in tooltip */
 403     opacity: 0;
 404     transition: opacity 1s;
 405 }
 406
 407 /* Tooltip arrow */
 408 .tooltip .tooltiptext::after {
 409     content: "";
 410     position: absolute;
 411     top: 100%;
 412     left: 50%;
 413     margin-left: -5px;
 414     border-width: 5px;
 415     border-style: solid;
 416     border-color: #555 transparent transparent transparent;
 417 }
 418
 419 /* Show the tooltip text when you mouse over the tooltip container */
 420 .tooltip:hover .tooltiptext {
 421     visibility: visible;
 422     opacity: 1;
 423 }