modules/yangui-resources/src/main/resources/yangui/yangui.less

   1 .topologyContainer {\r
   2     position: fixed;\r
   3     width: 800px;\r
   4     height: 500px;\r
   5     top: 150px;\r
   6     right: 100px;\r
   7     z-index: 1100;\r
   8     overflow: hidden;\r
   9 }\r
  10 \r
  11 .simpleContainer {\r
  12     border: 1px solid #7a7a7a;\r
  13     margin: 5px;\r
  14     border-radius: 5px;\r
  15     padding: 5px;\r
  16     z-index: 10;\r
  17     width:auto;\r
  18 }\r
  19 \r
  20 /*.previewContainer {\r
  21     border: 2px solid #7a7a7a;\r
  22     margin: 5px;\r
  23     padding: 5px;\r
  24     position: fixed;\r
  25     top: 150px;\r
  26     right: 10px;\r
  27     width: 35%;\r
  28     height: 50%;\r
  29     z-index: 1000;\r
  30     overflow: auto;\r
  31     word-wrap: normal;\r
  32     white-space: pre;\r
  33 }*/\r
  34 \r
  35 .leaf {\r
  36     margin: 5px;\r
  37     padding-left: 5px;\r
  38     position: relative;\r
  39 }\r
  40 \r
  41 .leaf-label {\r
  42     margin-right: 10px;\r
  43     .inlineBlock;\r
  44     /*width: 170px;*/\r
  45     padding-top: 6px;\r
  46 }\r
  47 \r
  48 .leaf-input {\r
  49     width: 300px;\r
  50     .inlineBlock;\r
  51 }\r
  52 \r
  53 .clear{\r
  54     clear: both;\r
  55 }\r
  56 \r
  57 .floatRight {\r
  58     position: relative;\r
  59     float: right;\r
  60     display:inline-block;\r
  61 }\r
  62 \r
  63 .btn-slim {\r
  64     padding-top: 2px;\r
  65     padding-bottom: 2px;\r
  66 }\r
  67 \r
  68 .btn-red {\r
  69     background: red;\r
  70 }\r
  71 \r
  72 .btn-selected {\r
  73     background: rgb(255,69,0);\r
  74 }\r
  75 \r
  76 /* --------------------------------------------------------------------------------- COMMON OWN RULES */\r
  77 .left{ float: left;}\r
  78 .right{ float: right;}\r
  79 .clear{ clear: both; float: none!important;}\r
  80 .outline{ outline: 0 none;}\r
  81 .block{ display: block;}\r
  82 .blockNone{ display: none;}\r
  83 .inlineBlock {\r
  84     display: -moz-inline-stack;\r
  85     display: inline-block;\r
  86     vertical-align: top;\r
  87     zoom: 1;\r
  88     *display: inline;\r
  89 }\r
  90 .classicLink{\r
  91     .outline;\r
  92     text-decoration: none;\r
  93     &:hover{\r
  94         text-decoration: underline;\r
  95     }\r
  96 }\r
  97 .mt10{margin-top: 10px;}\r
  98 .pr30{padding-right: 30px;}\r
  99 .pr40{padding-right: 40px;}\r
 100 .pr50{padding-right: 50px;}\r
 101 .pr60{padding-right: 60px;}\r
 102 .pl30{padding-left: 30px;}\r
 103 /* --------------------------------------------------------------------------------- COMMON OWN RULES - END */\r
 104 \r
 105 \r
 106 \r
 107 \r
 108 /* --------------------------------------------------------------------------------- YANG UI */\r
 109 .leaflist{\r
 110     .leafListValue{\r
 111         margin-top: 5px;\r
 112         margin-left: 10px;\r
 113         input[type=text], button{\r
 114             .inlineBlock;\r
 115         }\r
 116         input[type=text]{\r
 117             width: 20%;\r
 118         }\r
 119         button{\r
 120             margin-top: 4px;\r
 121             margin-left: 5px;\r
 122         }\r
 123     }\r
 124 }\r
 125 \r
 126 .selSubApiPath{\r
 127     &.is-sticky{\r
 128         width: 100%;\r
 129         -moz-box-sizing: border-box;\r
 130         -webkit-box-sizing: border-box;\r
 131         box-sizing: border-box;\r
 132         padding-left: 270px;\r
 133         right: 0;\r
 134         padding-right: 20px;\r
 135         z-index: 100;\r
 136         div.in{\r
 137             border: 1px solid #7a7a7a;\r
 138             -webkit-border-radius: 0 0 5px 5px;\r
 139             border-radius: 0 0 5px 5px;\r
 140             background: #414042;\r
 141             padding-left: 15px;\r
 142         }\r
 143     }\r
 144     input[type="text"]{\r
 145         width: 150px;\r
 146         display: inline!important;\r
 147     }\r
 148     div.in{\r
 149         padding: 10px;\r
 150     }\r
 151 }\r
 152 /* --------------------------------------------------------------------------------- YANG UI - END */\r
 153 \r
 154 \r
 155 \r
 156 \r
 157 \r
 158 /* --------------------------------------------------------------------------------- YANG UI TREE */\r
 159 \r
 160 .listContainer{\r
 161   position: relative;\r
 162 }\r
 163 \r
 164 .listModal{\r
 165   position: absolute;\r
 166   top: 0px;\r
 167   margin: 0 0 0 20px!important;\r
 168   left: 100%;\r
 169   background: #393939;\r
 170   z-index: 99;\r
 171   /*width: 245px;*/\r
 172   .btn{\r
 173     /*width: 200px;*/\r
 174   }\r
 175   li{\r
 176     margin: 5px 0;\r
 177     position: relative;\r
 178     .btn-remove{\r
 179       position: absolute;\r
 180       right: 29px;\r
 181       top: 0;\r
 182     }\r
 183     .btn-double-index{\r
 184       position: absolute;\r
 185       right: 3px;\r
 186       top: 0;\r
 187     }\r
 188     .btn-view{\r
 189       position: absolute;\r
 190       left: 0px;\r
 191       top: 0;\r
 192     }\r
 193   }\r
 194   ul{\r
 195     padding: 0 15px 0 10px;\r
 196   }\r
 197   button.close{\r
 198     position: absolute;\r
 199     top: 5px;\r
 200     right: 25px;\r
 201     color: #C4C4C4;\r
 202   }\r
 203   .listWrapper{\r
 204     overflow-y: scroll;\r
 205     max-height: 200px;\r
 206   }\r
 207 }\r
 208 \r
 209 .topologyContainer{\r
 210   background: #393939;\r
 211   border: 1px solid #7a7a7a;\r
 212   border-radius: 5px;\r
 213   padding: 20px;\r
 214   z-index: 15;\r
 215   button.close{\r
 216     position: absolute;\r
 217     top: 5px;\r
 218     right: 5px;\r
 219     color: #C4C4C4;\r
 220   }\r
 221   .graph-frame{\r
 222     width: 100%!important;\r
 223   }\r
 224   &.previewContainer{\r
 225     width: auto;\r
 226     height: auto;\r
 227     .previewWrapper{\r
 228       max-height: 500px;\r
 229       overflow-y: scroll;\r
 230       pre{\r
 231         -webkit-border-radius: 0;\r
 232         border-radius: 0;\r
 233         margin: 0;\r
 234       }\r
 235     }\r
 236   }\r
 237 }\r
 238 \r
 239 .modalWrapper{\r
 240   position: relative;\r
 241   .inlineBlock;\r
 242   /*z-index: 20;*/\r
 243 }\r
 244 \r
 245 .customContainer{\r
 246   border-left: 1px solid #7a7a7a;\r
 247   margin: 5px 5px 5px 15px;\r
 248   padding: 5px;\r
 249   /*z-index: 10;*/\r
 250   width:auto;\r
 251   margin-top: 21px;\r
 252   position: relative;\r
 253   &.withoutBorder{\r
 254     border-left: 0;\r
 255     padding-bottom: 0;\r
 256     .treeBullet.containerBullet{\r
 257       left: -25px;\r
 258       top: -17px;\r
 259     }\r
 260   }\r
 261 }\r
 262 \r
 263 \r
 264 \r
 265 .btn-show-custom{\r
 266   width: 22px;\r
 267   line-height: 22px;\r
 268   -webkit-border-radius: 11px;\r
 269   border-radius: 11px;\r
 270   text-align: center;\r
 271   padding: 0!important;\r
 272 }\r
 273 \r
 274 .btn-double-index{\r
 275   cursor: auto;\r
 276   &:hover, &:focus{\r
 277     background: #d9534f!important;\r
 278     border-color: #d9534f!important;\r
 279   }\r
 280 }\r
 281 \r
 282 .btn-view{\r
 283   cursor: auto;\r
 284   &:hover, &:focus{\r
 285     background: orange!important;\r
 286     border-color: orange!important;\r
 287   }\r
 288 }\r
 289 \r
 290 .topContainerPart{\r
 291   margin-left: -16px;\r
 292   margin-top: -16px;\r
 293   margin-bottom: 10px;\r
 294 }\r
 295 \r
 296 .listItemWrapper{\r
 297   margin: 0 10px 0 20px;\r
 298   .inlineBlock;\r
 299   .listButtonWrapper{\r
 300     margin: 0 5px;\r
 301     .inlineBlock;\r
 302   }\r
 303 }\r
 304 \r
 305 .btn-name{\r
 306   -webkit-border-radius: 5px;\r
 307   border-radius: 5px;\r
 308   background: orange;\r
 309   border: 0;\r
 310   cursor: auto;\r
 311 }\r
 312 \r
 313 .borderArrow{\r
 314   color: #7a7a7a;\r
 315   position: absolute;\r
 316   bottom: -6px;\r
 317   left: -6px;\r
 318   font-size: 1.3em;\r
 319 }\r
 320 \r
 321 .btn.btn-arrow{\r
 322   /*font-size: 12px;*/\r
 323 }\r
 324 \r
 325 .treeBullet{\r
 326   font-size: 25px;\r
 327   color: #7a7a7a;\r
 328   position: absolute;\r
 329   left: -15px;\r
 330   top: 0;\r
 331   &.containerBullet{\r
 332 /*    margin: 0 0px 0 -14px;\r
 333     line-height: 25px;*/\r
 334     top: -19px; \r
 335     left: -26px;\r
 336   }\r
 337 }\r
 338 \r
 339 .tooltip-inner{\r
 340   color: #fff;\r
 341   white-space: pre-wrap;      /* CSS3 */   \r
 342   white-space: -moz-pre-wrap; /* Firefox */    \r
 343   white-space: -pre-wrap;     /* Opera <7 */   \r
 344   white-space: -o-pre-wrap;   /* Opera 7 */    \r
 345   word-wrap: break-word;      /* IE */\r
 346 }\r
 347 \r
 348 .listElemButton{\r
 349   /*max-width: 250px;*/\r
 350   /*overflow: hidden;*/\r
 351 }\r
 352 /* --------------------------------------------------------------------------------- YANG UI TREE - END */