vid-webpack-master/src/app/vlanTagging/vlan-tagging.component.scss

   1 $popupHeaderHeight: 59px;
   2
   3 .vlan-wrapper-config * {
   4   font-family: OpenSans-Regular, sans-serif;
   5 }
   6
   7 .body-content-jsp {
   8   margin-top: 35px;
   9   margin-left: 201px;
  10   margin-right: 0px;
  11   background-color: white;
  12 }
  13
  14 :host {
  15   height: 100%;
  16 }
  17 .form-wrapper{
  18   min-width: 75%;
  19   overflow: auto;
  20 }
  21 button {
  22   border-radius: 2px;
  23   font-size: 14px;
  24   line-height: 28px;
  25   height: 30px;
  26   &.blue {
  27     border: #0091c8 1px solid;
  28     background-color: #009fdb;
  29     color: white;
  30     &:hover {
  31       background-color: #1ec2ff;
  32       border-color: #0091c8;
  33     }
  34     &:active {
  35       background-color: #0091c7;
  36       border-color: #006186;
  37     }
  38     &[disabled] {
  39       background-color: rgba(5, 104, 174, 0.3);
  40       border-color: rgba(4, 113, 168, 0.3);
  41     }
  42   }
  43   &.grey {
  44     color: #009FDB;
  45     background-color: #ffffff;
  46     border: 1px solid #009FDB;
  47     &:hover {
  48       background-color: #f8f8f8;
  49       border-color: #009fdb;
  50     }
  51     &:active {
  52       background-color: #d8d8d8;
  53       border-color: #5a5a5a;
  54     }
  55     &[disabled] {
  56       background-color: #f8f8f8;
  57       border-color: #d8d8d8;
  58       color: #cdcdcd;
  59     }
  60   }
  61   &.white {
  62     border: #009fdb 1px solid;
  63     background-color: white;
  64     color: #009fdb;
  65   }
  66 }
  67
  68 .vlan-wrapper-config {
  69   /*todo: remove. this a temporary fix for the sub-interface popup not showing as a page beside the sidebar. currently showing it in full screen.*/
  70   /*it is necessary inside the iframe (and not just in the angularjs - old app) angular app because in Firefox the iframe content isn't effected by the iframe size */
  71   width: 100vw;
  72   height: 100vh;
  73   position: fixed;
  74   /********************/
  75   .head {
  76     line-height: $popupHeaderHeight;
  77     height: $popupHeaderHeight;
  78     display: flex;
  79     background-color: #F8F8F8;
  80     border-bottom: 1px solid #D8D8D8;
  81     .title {
  82       font-size: 18px;
  83       margin-left: 56px;
  84       color: #5A5A5A;
  85     }
  86     .btn-wrapper {
  87       flex: 1;
  88       text-align: right;
  89       margin-right: 15px;
  90       button {
  91         width: 120px;
  92         &.delete-btn {
  93           margin-left: 13px;
  94         }
  95       }
  96     }
  97   }
  98   .content-wrapper {
  99     display: flex;
 100     .form {
 101       overflow-y: auto;
 102     }
 103     height: calc(100% - #{$popupHeaderHeight});
 104     .form {
 105       margin-top: 48px;
 106
 107     }
 108     .content {
 109       .form-wrapper {
 110
 111         margin: 0 auto;
 112       }
 113     }
 114
 115   }
 116
 117   span.error {
 118     color: #cf2a2a;
 119   }
 120   .content-wrapper .content .form-wrapper .instance-field {
 121     .ng-invalid-pattern {
 122       border-color: #cf2a2a;
 123       color: #cf2a2a;
 124     }
 125     margin-bottom: 25px;
 126     label {
 127       color: #191919;
 128       font-size: 13px;
 129     }
 130     input,
 131     select {
 132       border-color: #D2D2D2;
 133     }
 134     &.lcpRegionText,
 135     &.productFamily {
 136       display: none;
 137     }
 138   }
 139
 140 }
 141
 142 .sidebar-right {
 143   min-width: 25%;
 144   background-color: #F8F8F8;
 145   overflow-y: auto;
 146   .headline {
 147     font-family: OpenSans-Semibold;
 148     font-size: 12px;
 149      color: #009FDB;
 150      padding-bottom: 6px;
 151      padding-top: 20px
 152   }
 153   .seperator{
 154     background: #D2D2D2;
 155     height: 1px;
 156     margin-bottom: 10px;
 157   }
 158 }
 159
 160 .left-side{
 161   min-width: 75%;
 162   overflow:auto;
 163
 164 }
 165
 166 .sidebar-right service-metadata .metadata-content {
 167   padding-bottom: 20px;
 168 }