| | |
| | | height: 5%; |
| | | display: flex; |
| | | } |
| | | label { |
| | | .head label { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | |
| | | color: #FFF; |
| | | |
| | | } |
| | | label:active { |
| | | .head label:active { |
| | | border-top: 3px solid rgb(239, 177, 102); |
| | | border-right: 1px solid #FFF; |
| | | border-left: 1px solid #FFF; |
| | |
| | | /* border-left: 1px solid #FFF;*/ |
| | | /*}*/ |
| | | .body { |
| | | height: 75%; |
| | | height: 73%; |
| | | width: 100%; |
| | | border-top: 1px solid #FFF; |
| | | background-color: #5D7677; |
| | | /*background-color: #d0d0d0;*/ |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | |
| | | background-image: url("monitor/img/background.png"); |
| | | background-repeat: no-repeat; |
| | | background-size:100% 100%; |
| | | } |
| | | .canves1 { |
| | | width: 100%; |
| | | height: 100%; |
| | | /*background-color: #f1f1f1;*/ |
| | | color: #ffffff; |
| | | display: flex; |
| | | } |
| | | .canves-header { |
| | | position: relative; |
| | |
| | | font-size: 35px; |
| | | font-weight: bold; |
| | | /*color: #FF5722;*/ |
| | | } |
| | | .monitor-operate { |
| | | display: flex; |
| | | height: 20%; |
| | | justify-content: space-around; |
| | | background-color: #FFF; |
| | | |
| | | } |
| | | .monitor-operate-item { |
| | | height: 100%; |
| | | min-width: 320px; |
| | | max-width: 600px; |
| | | /*background-color: #888888;*/ |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | align-items: center; |
| | | color: #282828; |
| | | } |
| | | .item-top { |
| | | margin-left: 25px; |
| | | } |
| | | .monitor-operate-item button{ |
| | | width: 100px; |
| | | } |
| | | .operate-label { |
| | | /*display: flex;*/ |
| | | /*flex-direction: column;*/ |
| | | /*flex-wrap: wrap;*/ |
| | | /*height: 50%;*/ |
| | | } |
| | | .monitor-operate-item label{ |
| | | display: inline-block; |
| | | text-align: center; |
| | | height: 30px; |
| | | /*line-height: 30px;*/ |
| | | width: 100px; |
| | | padding: 5px; |
| | | /*background-color: #01AAED;*/ |
| | | margin-top: 10px; |
| | | margin-left: 10px; |
| | | } |
| | | .operator-item { |
| | | display: inline-block; |
| | | /*height: 100%;*/ |
| | | height: 40%; |
| | | min-width: 300px; |
| | | text-align: center; |
| | | position: relative; |
| | | vertical-align: middle; |
| | | /*padding: 10px 0px 10px 50px;*/ |
| | | } |
| | | .operator-item .select-title { |
| | | display: inline-block; |
| | | position: absolute; |
| | | top: -11px; |
| | | left: 50%; |
| | | transform: translate(-50%, 0); |
| | | background-color: #fff; |
| | | color: #2e95d3; |
| | | font-size: 12px; |
| | | border: 1px solid #8d8d8d; |
| | | border-radius: 5px; |
| | | padding: 5px; |
| | | z-index: 999; |
| | | } |
| | | .operator-item .select-container { |
| | | padding: 10px 0; |
| | | height: 100%; |
| | | border: 1px solid #8d8d8d; |
| | | border-radius: 5px; |
| | | } |