ecomp-portal-FE/client/app/directives/left-menu/left-menu.less

   1 /*-
   2  * ================================================================================
   3  * eCOMP Portal
   4  * ================================================================================
   5  * Copyright (C) 2017 AT&T Intellectual Property
   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  * ================================================================================
  19  */
  20 @sidebar-width: 200px;
  21 @transition-duration: 0.25s;
  22 @overlayer-opacity: 0.65;
  23
  24
  25 .close-button {
  26   .a24r;
  27   font-size: 3em;
  28   line-height: 18px;
  29   position: absolute;
  30   cursor: pointer;
  31   vertical-align: middle;
  32   top: @second-level-top;
  33   left: 0;
  34   -webkit-font-smoothing: antialiased;
  35   height: 53px;
  36   z-index: 101;
  37 }
  38 .ecomp-sidebar-container {
  39   position: absolute;
  40   display: block;
  41   left: 0;
  42   z-index: 100;
  43   transition: left @transition-duration;
  44   margin-top: -15px;
  45
  46   .ecomp-sidebar-main {
  47     position: absolute;
  48     margin-top: 65px;
  49     width: @sidebar-width;
  50     height: 100vh;
  51     .bg_u;
  52     box-shadow: 0 4px 5px rgba(0, 0, 0, .2);
  53
  54     padding-right: 10px;
  55     padding-left: 10px;
  56
  57     .accordion-container{
  58       margin-top: 45px;
  59       overflow-y:auto;
  60       overflow-x:hidden;
  61     }
  62     .att-accordion-font{
  63       font-size: .875rem;
  64       color: #666;
  65       display: inline-block;
  66       font-family: arial;
  67
  68     }
  69
  70     .att-accordion-active{
  71       color: #199DDF !important;
  72     }
  73
  74     .sub-item{
  75       .att-accordion-font;
  76       cursor: pointer;
  77       height: 37px;
  78       line-height: 37px;
  79       padding-left: 20px;
  80       padding-bottom: 10px;
  81       vertical-align: middle;
  82       width: 100%;
  83     }
  84     .sub-item:hover{
  85       .att-accordion-active;
  86     }
  87
  88     .parent-item{
  89       .att-accordion-font;
  90       border-bottom: 1px solid #bbb;
  91       cursor: pointer;
  92       height: 37px;
  93       line-height: 37px;
  94       padding-bottom: 10px;
  95       vertical-align: middle;
  96       width: 100%;
  97     }
  98     .parent-item:hover{
  99       .att-accordion-active;
 100     }
 101
 102   }
 103 }
 104
 105 .open-sidebar {
 106   left: 0;
 107 }
 108
 109 .close-sidebar {
 110   left: -@sidebar-width;
 111 }
 112
 113 .content-overlayed {
 114   position: fixed;
 115   top: 110px;
 116   right: 0;
 117   bottom: 0;
 118   left: 0;
 119   background: none repeat scroll 0 0 rgb(242, 242, 242);
 120   z-index: 9999;
 121 }
 122 .fade-animation{
 123   opacity: @overlayer-opacity;
 124   transition: opacity @transition-duration ease-in-out;
 125 }
 126 .fade-animation.ng-hide {
 127   opacity:0;
 128   transition: opacity @transition-duration ease-in-out;
 129 }
 130
 131 #contentId{
 132         padding-left:210px
 133 }