| /** |
| * Licensed to the Apache Software Foundation (ASF) under one |
| * or more contributor license agreements. See the NOTICE file |
| * distributed with this work for additional information |
| * regarding copyright ownership. The ASF licenses this file |
| * to you under the Apache License, Version 2.0 (the |
| * "License"); you may not use this file except in compliance |
| * with the License. You may obtain a copy of the License at |
| * |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| * |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| */ |
| /* You can add global styles to this file, and also import other style files */ |
| @import "vendor.scss"; |
| @import "_variables.scss"; |
| @import "slider.scss"; |
| @import "metron-dialog.scss"; |
| @import "../node_modules/pikaday-time/scss/pikaday.scss"; |
| @import "hexagon"; |
| @import "confirm-popover.scss"; |
| @import "~ng-zorro-antd/layout/style/index.min.css"; /* Import styles of the component */ |
| @import "~ng-zorro-antd/menu/style/index.min.css"; /* Import styles of the component */ |
| |
| body, |
| button { |
| font-family: Roboto-Regular; |
| } |
| |
| .mrow { |
| @extend .row; |
| @extend .mx-0; |
| } |
| |
| .input { |
| background: $input-background; |
| border: 1px solid $input-border-color; |
| color: $body-color; |
| border-radius: 2px; |
| |
| &:focus { |
| outline: none; |
| } |
| &::-webkit-input-placeholder { |
| @include place-holder-text; |
| } |
| &:-moz-placeholder { |
| @include place-holder-text; |
| } |
| |
| &::-moz-placeholder { |
| @include place-holder-text; |
| } |
| |
| &:-ms-input-placeholder { |
| @include place-holder-text; |
| } |
| } |
| |
| .table { |
| thead tr th { |
| font-size: 13px; |
| border-top: none; |
| } |
| tbody tr td { |
| font-size: 14px; |
| cursor: pointer; |
| } |
| tr:last-child td { |
| border-bottom: 1px solid $table-border-color; |
| } |
| td a { |
| border: 1px solid transparent; |
| } |
| } |
| |
| form |
| { |
| label |
| { |
| font-family: Roboto-Medium; |
| font-size: 12px; |
| color: $dusty-grey; |
| margin: 0px 0px 2px 5px; |
| } |
| |
| input.form-control |
| { |
| background: $mine-shaft-1; |
| } |
| } |
| |
| .form-control, select |
| { |
| border: solid 1px $tundora; |
| background-color: $mine-shaft; |
| font-family: Roboto; |
| font-size: 13px; |
| color: $silver; |
| height: 35px; |
| |
| &[readonly] |
| { |
| background: $tundora-1; |
| border: 1px solid $tundora; |
| } |
| |
| &:focus |
| { |
| background-color: $mine-shaft; |
| border-color: $tundora; |
| color: $silver; |
| } |
| } |
| |
| .fontawesome-checkbox |
| { |
| display: none; |
| } |
| |
| .fontawesome-checkbox ~label |
| { |
| margin: 0px; |
| display: inline-block; |
| height: 13px; |
| line-height: 13px; |
| border: 1px solid $tundora; |
| border-radius: 2px; |
| } |
| |
| .fontawesome-checkbox ~label:before { |
| font-family: "FontAwesome"; |
| font-style: normal; |
| font-size: 12px; |
| content: '\f0c8'; |
| color: $mine-shaft-2; |
| } |
| |
| .fontawesome-checkbox:checked ~ label:before { |
| content: '\f14a'; |
| color: $checkbox-checked-color; |
| } |
| |
| .text-color-curious-blue-13 { |
| color: $curious-blue; |
| font-size: 13px; |
| } |
| |
| .anchor { |
| cursor: pointer; |
| } |
| |
| .line-color-tundora { |
| display: block; |
| height: 1px; |
| border: 0; |
| border-top: 1px solid $tundora; |
| margin: 1em 0; |
| padding: 0; |
| } |
| |
| .readonly-bg { |
| background: $mine-shaft; |
| } |
| |
| .background-tiber { |
| background: $tiber |
| } |
| /* Navcontent Layout */ |
| .nav-content { |
| padding-right: 0px; |
| |
| .col-fixed-200 { |
| @extend .readonly-bg; |
| |
| top: 0px; |
| z-index: 1; |
| height: 100%; |
| width: 200px; |
| position: absolute; |
| padding: 15px; |
| |
| .title { |
| font-size: 14px; |
| color: $body-color; |
| } |
| .m-nav { |
| padding-left: 5px; |
| } |
| } |
| .col-offset-200{ |
| padding-left:215px; |
| z-index:0; |
| } |
| } |
| |
| /* Buttons */ |
| |
| .metron-floating-button-bar-1x { |
| @extend .pb-3; |
| @extend .dialog1x; |
| |
| bottom: 0; |
| position: fixed; |
| background: $eden; |
| border-top: 1px solid $blue-mine; |
| } |
| |
| .metron-floating-button-bar-2x { |
| @extend .pb-3; |
| @extend .dialog2x; |
| |
| bottom: 0; |
| position: fixed; |
| background: $eden; |
| border-top: 1px solid $blue-mine; |
| } |
| |
| .metron-button-bar-1x { |
| @extend .pb-3; |
| @extend .dialog1x; |
| |
| background: $eden; |
| border-top: 1px solid $blue-mine; |
| } |
| |
| .metron-button-bar-2x { |
| @extend .pb-3; |
| @extend .dialog2x; |
| |
| background: $eden; |
| border-top: 1px solid $blue-mine; |
| } |
| |
| |
| .btn-all_ports { |
| background-color: $all-ports; |
| border-color: $all-ports; |
| color: white; |
| font-size: 14px; |
| min-width: 85px; |
| width: 85px; |
| cursor: pointer; |
| &:focus |
| { |
| outline: none; |
| } |
| } |
| |
| .btn-mine_shaft_2 { |
| background-color: $mine-shaft_2; |
| border-color: $blue-chill; |
| color: $piction-blue; |
| font-size: 14px; |
| min-width: 85px; |
| cursor: pointer; |
| &:focus |
| { |
| outline: none; |
| } |
| } |
| |
| .pika-select { |
| height: 20px; |
| -webkit-appearance: none; |
| -moz-appearance: none; |
| appearance: none; |
| padding: 0px 15px; |
| } |
| |
| .tooltip-inner { |
| opacity: 0.9; |
| font-size: 11px; |
| border-radius: 0px; |
| border: 1px solid $silver-2; |
| } |
| |
| hr { |
| display: block; |
| height: 1px; |
| border: 0; |
| border-top: 1px solid $tundora-1; |
| margin: 0.3rem 0; |
| padding: 0; |
| } |
| |
| /** Custom Radio box **/ |
| $background_color_1: #eee; |
| $background_color_2: #ccc; |
| $background_color_3: #2196F3; |
| .radio-container { |
| display: block; |
| position: relative; |
| padding-left: 35px; |
| margin-bottom: 12px; |
| cursor: pointer; |
| font-size: 22px; |
| -webkit-user-select: none; |
| -moz-user-select: none; |
| -ms-user-select: none; |
| user-select: none; |
| input { |
| position: absolute; |
| opacity: 0; |
| &:checked { |
| &~.checkmark { |
| background-color: $eastern-blue-2; |
| &:after { |
| display: block; |
| } |
| } |
| } |
| } |
| &:hover { |
| input { |
| &~.checkmark { |
| background-color: $eastern-blue-2; |
| } |
| } |
| } |
| .checkmark { |
| position: absolute; |
| top: 0; |
| left: 0; |
| height: 12px; |
| width: 12px; |
| background-color: $mine-shaft-2; |
| border: 1px solid $tundora; |
| border-radius: 50%; |
| |
| &:after { |
| top: 2px; |
| left: 2px; |
| width: 6px; |
| height: 6px; |
| border-radius: 50%; |
| background: $white; |
| content: ""; |
| position: absolute; |
| display: none; |
| } |
| } |
| } |
| |
| .notransition * { |
| -webkit-transition: none !important; |
| -moz-transition: none !important; |
| -o-transition: none !important; |
| -ms-transition: none !important; |
| transition: none !important; |
| |
| animation: none !important; |
| } |
| |
| .dropdown-item.disabled { |
| cursor: not-allowed; |
| pointer-events: all; |
| } |
| |
| .ant-layout { |
| background: transparent; |
| min-height: 100vh; |
| } |
| |
| .ant-layout-sider-trigger { background: #3C3C3C; } |
| |
| .cdk-overlay-pane { |
| position: absolute; |
| z-index: 1000; |
| } |
| |
| .cdk-overlay-connected-position-bounding-box { |
| display: flex; |
| flex-direction: column; |
| min-height: 1px; |
| min-width: 1px; |
| position: absolute; |
| z-index: 1000; |
| } |
| |
| .cdk-overlay-container { |
| height: 100%; |
| left: 0; |
| pointer-events: none; |
| position: fixed; |
| top: 0; |
| width: 100%; |
| z-index: 1000; |
| } |
| |
| .ant-menu-dark .ant-menu-sub { |
| background: #2e2e2e; |
| } |
| |
| .ant-menu.ant-menu-dark :not(ant-menu-submenu-open) .ant-menu-item-selected, |
| .ant-menu.ant-menu-dark .ant-menu-sub .ant-menu-item-selected { |
| background-color: rgba(255, 255, 255, .1); |
| } |
| |
| .ant-menu.ant-menu-dark .ant-menu-item-selected { |
| background-color: transparent; |
| } |
| |
| .ant-menu-submenu-popup.ant-menu-dark .ant-menu-item-selected { |
| background-color: rgba(255, 255, 255, .1); |
| } |
| |
| .ant-menu-dark .ant-menu-inline.ant-menu-sub { |
| background: #2e2e2e; |
| box-shadow: none; |
| } |
| |
| .ant-menu-submenu-title { |
| color: rgba(255,255,255,.65); |
| } |
| |
| .ant-menu-submenu-arrow::before, |
| .ant-menu-submenu-arrow::after { |
| background: rgba(255,255,255,.65); |
| } |