| $panel-width: 40%; |
| $add-button-size: 40px; |
| |
| e-node-map { |
| display: block; |
| height: 100%; |
| |
| ng-map { |
| height: 100%; |
| } |
| |
| e-node-map-panel { |
| position: absolute; |
| height: 100%; |
| top: 0; |
| right: -($panel-width + 5); |
| width: $panel-width; |
| background-color: $background-color; |
| background-image: url($background-image); |
| transition: all .5s ease-in-out; |
| box-shadow: -10px 0px 20px -5px rgba(0,0,0,0.75); |
| max-height: 100%; |
| overflow-y: scroll; |
| |
| &.in{ |
| right: 0; |
| } |
| |
| .details { |
| margin-bottom: 20px; |
| .ip-address { |
| padding-top: 20px; |
| } |
| } |
| } |
| |
| .addButton { |
| position: absolute; |
| display: block; |
| height: $add-button-size; |
| width: $add-button-size; |
| line-height: 35px; |
| text-align: center; |
| left: 20px; |
| bottom: 20px; |
| background-color: $cord-red; |
| color: #fff; |
| font-size: 30px; |
| font-weight: 700; |
| border-radius: 50%; |
| |
| &:hover{ |
| text-decoration: none; |
| } |
| } |
| } |
| |
| e-node-map-panel { |
| display: block; |
| } |