| | |
| | | .main-content { |
| | | flex: 1; |
| | | display: flex; |
| | | padding: 1vh 1vw 19vh; |
| | | padding: 1vh 1vw 1vh; |
| | | margin-bottom: 18.5vh; |
| | | box-sizing: border-box; |
| | | gap: 1vw; |
| | | min-height: 0; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | .col-left { |
| | | width: 30%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 1.5vh; |
| | | gap: 1vh; |
| | | } |
| | | |
| | | .col-right { |
| | | width: 70%; |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 1.5vh; |
| | | gap: 1vh; |
| | | } |
| | | |
| | | /* Panels */ |
| | |
| | | .inventory-type { |
| | | flex: 50; |
| | | } |
| | | .inventory-type .panel-content { |
| | | padding: 1.1vh 1.2vw; |
| | | } |
| | | .inventory-type .panel-header { |
| | | margin-bottom: 0.6vh; |
| | | } |
| | | .inventory-type .donut-chart-layout { |
| | | flex: 1; |
| | | min-height: 0; |
| | | } |
| | | .inventory-type .chart-part { |
| | | height: 78%; |
| | | } |
| | | .inventory-type .legend-part { |
| | | gap: 1vh; |
| | | padding-left: 14px; |
| | | } |
| | | .inventory-type .legend-item { |
| | | padding-bottom: 3px; |
| | | } |
| | | .inventory-type .custom-legend-row { |
| | | margin-top: 0.4vh; |
| | | flex-wrap: wrap; |
| | | row-gap: 0.4vh; |
| | | } |
| | | .inventory-type .c-legend-item { |
| | | font-size: 0.75rem; |
| | | } |
| | | |
| | | .panel-content { |
| | | padding: 2vh 1.5vw; |
| | | padding: 1.5vh 1.5vw; |
| | | width: 100%; |
| | | height: 100%; |
| | | box-sizing: border-box; |
| | |
| | | margin-left: 2px; |
| | | } |
| | | |
| | | .footer-stack { |
| | | position: fixed !important; |
| | | .dashboard-container .footer-stack { |
| | | position: fixed; |
| | | left: 1.5vw; |
| | | right: auto; |
| | | bottom: 2.8vh; |
| | | height: 9vh; |
| | | height: 15vh; |
| | | width: calc(100% - 3vw); |
| | | z-index: 1000; |
| | | overflow: hidden; |
| | |
| | | display: flex; |
| | | justify-content: center; |
| | | gap: 20px; |
| | | margin-top: 10px; |
| | | margin-top: 1vh; |
| | | } |
| | | .c-legend-item { |
| | | display: flex; |