ecomp-portal-FE-common/client/app/views/widget-catalog/widget-catalog.less

   1 /*-
   2  * ============LICENSE_START==========================================
   3  * ONAP Portal
   4  * ===================================================================
   5  * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
   6  * ===================================================================
   7  *
   8  * Unless otherwise specified, all software contained herein is licensed
   9  * under the Apache License, Version 2.0 (the "License");
  10  * you may not use this software except in compliance with the License.
  11  * You may obtain a copy of the License at
  12  *
  13  *             http://www.apache.org/licenses/LICENSE-2.0
  14  *
  15  * Unless required by applicable law or agreed to in writing, software
  16  * distributed under the License is distributed on an "AS IS" BASIS,
  17  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  18  * See the License for the specific language governing permissions and
  19  * limitations under the License.
  20  *
  21  * Unless otherwise specified, all documentation contained herein is licensed
  22  * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
  23  * you may not use this documentation except in compliance with the License.
  24  * You may obtain a copy of the License at
  25  *
  26  *             https://creativecommons.org/licenses/by/4.0/
  27  *
  28  * Unless required by applicable law or agreed to in writing, documentation
  29  * distributed under the License is distributed on an "AS IS" BASIS,
  30  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  31  * See the License for the specific language governing permissions and
  32  * limitations under the License.
  33  *
  34  * ============LICENSE_END============================================
  35  *
  36  * ECOMP is a trademark and service mark of AT&T Intellectual Property.
  37  */
  38 .widget-catalog{
  39     .bg_portalWhite;//white for 1702
  40     //.bg_portalGray;  // gray for 1610
  41     position: @page-main-position;
  42     top: @page-main-top;
  43     left: @page-main-left;
  44     right: @page-main-right;
  45     bottom: @page-main-bottom;
  46     padding-top: @padding-top;
  47     overflow-y: @page-main-overflow-y;
  48     padding-left: @padding-left-side;
  49     margin: auto;
  50
  51     .widget-title {
  52         padding-left: 20px;
  53         margin-bottom: -15px;
  54     }
  55
  56   .widget-gridster-header {
  57         color: #0574ac;
  58     font-family: Omnes-ECOMP-W02-Bold, Arial;
  59     font-size: 18px;
  60   }
  61
  62   .widget-gridster-footer {
  63     background-color: @portalWhite
  64   }
  65
  66   .widget-iframe {
  67     width: 100%;
  68     height: 100%;
  69   }
  70
  71   .widget-image {
  72     cursor: pointer;
  73     width: 20px;
  74     height: 25px;
  75   }
  76
  77   .enlarge-content{
  78     top: 120px;
  79     left: 400px;
  80     width:1170px;
  81     height:600px;
  82     right: 0;
  83     bottom: 0;
  84     left: 0;
  85     background: none repeat scroll 0 0 @funcBkgGray;
  86   }
  87
  88   .enlarge-close-button{
  89     .btn-blue;
  90     position: relative;
  91     top : -20px;
  92     left : 1145px;
  93     width : 25px;
  94   }
  95
  96   .widgets-home-container {
  97     //.content_justify;
  98     //position: relative;
  99     padding-right: 0;
 100     padding-left: 0;
 101     padding-bottom: 32px;
 102     width: 100%;
 103       //margin-left: @table-margin-left;
 104
 105     .portals-list {
 106       min-height: 70vh;
 107       //display: flex;
 108       //justify-content: center;
 109       flex-flow: row wrap;
 110       width: @table-width;
 111           margin:auto;
 112       //margin-left: @table-margin-left;
 113       margin-bottom: 63px;
 114
 115       .portals-list-item {
 116         background-color: @portalWhite;
 117         border-radius: 2px;
 118         box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.1);
 119         display: inline-block;
 120         width: 360px;
 121         height: 300px;
 122         background-size: cover;
 123         cursor: pointer;
 124         margin: 15px;
 125         overflow: hidden;
 126
 127         .portals-item-info {
 128           background-color: @portalWhite;
 129           height: 50px;
 130           top: 180px;
 131          // position: relative;
 132           box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.1);
 133           padding: 16px;
 134
 135           .info-title {
 136             //.a24r;
 137             .dBlue24r;  // AT&T Dark Blue
 138             margin-bottom: 4px;
 139
 140             text-overflow: ellipsis;
 141             overflow: hidden;
 142           }
 143           .info-description {
 144             .portalDBlue16r;
 145             text-overflow: ellipsis;
 146             white-space: nowrap;
 147             overflow: hidden;
 148           }
 149           .info-button {
 150             .btn-green;
 151             width: 96px;
 152           //  position: absolute;
 153             bottom: 16px;
 154             left: 16px;
 155           }
 156
 157           &:hover {
 158             opacity: .93;
 159             z-index: 3;
 160           }
 161         }
 162       }
 163     }
 164   }
 165 }
 166
 167 .gridster-item-container .gridster-item-body {
 168         bottom:0px;
 169         overflow-y:auto;
 170     overflow-x:hidden;
 171 }
 172
 173 @keyframes fadein {
 174   from {
 175     opacity: 0;
 176   }
 177   to {
 178     opacity: 1;
 179   }
 180 }
 181
 182 #widget-page-content{
 183         padding-left:250px;
 184 }
 185
 186 .widget-centerAlignment{
 187 margin: auto;
 188 width: 1170px;
 189 }
 190 #widget-checkbox-label{
 191 margin-left: 190px;
 192 top: 3px;
 193 }