app/stylesheet/charts.scss
.utilization-trend-chart-pf {
margin-bottom: 50px;
.available-text {
width: 50px;
.available-text-total {
padding-left: 5px;
}
}
}
.sparkline-chart {
margin-top: 20px;
}
.empty-chart-content {
height: 231px;
padding-top: 20px;
.pficon {
font-size: 24px;
margin-top: 48px;
}
}
.chart-holder {
.bx--cc--chart-wrapper {
.layout-svg-wrapper {
width: 90%;
left: 5%;
position: relative;
margin-top: 6px;
}
.bx--cc--title {
.title {
display: none;
}
}
svg {
overflow: visible !important;
}
}
}
.bx--cc--pie {
overflow: visible !important;
}
.bx--cc--toolbar {
.bx--overflow-menu-options {
top: 10%;
}
}
.spacer {
margin-top: 10px;
height: 0;
}
.bx--cc--legend {
.legend-item {
height: 30px;
margin-top: 2px;
margin-bottom: 2px;
}
}
.heatmap_charts_div {
display: inline-flex;
.chart-holder {
margin-right: 55px;
}
.heat-chart-pf {
margin-bottom: 50px;
width: 50%;
.chart-holder.bx--chart-holder {
width: 100% !important;
}
}
}
.heatmap_charts_section {
display: inline-flex;
flex-direction: column;
width: 100%;
}
.zoom-bar {
margin-bottom: 20px;
}
.empty-chart-contents {
margin-bottom: 10px;
span {
vertical-align: middle;
width: 100%;
font-size: 12px;
font-weight: 400;
}
}
.card-pf-aggregate-status-title {
font-size: 14px !important;
font-weight: 400 !important;
}
.card-pf-utilization {
.chart-holder.bx--chart-holder {
margin-bottom: 40px;
}
.utilization-cpu-chart-pf, .servers_available_pie_chart_section {
.trend-footer-pf {
border-right: 0.5px solid #d1d1d1;
}
}
.utilization-memory-chart-pf, .servers_health_pie_chart_section {
.trend-footer-pf {
border-left: 0.5px solid #d1d1d1;
}
}
.trend-footer-pf {
border-top: 1px solid $selected-ui;
border-bottom: 1px solid #d1d1d1;
margin: 0 -20px -20px;
padding: 20px;
padding-bottom: 21px;
font-size: 12px;
font-weight: 400;
color: #333;
background: #fafafa;
display: block;
}
}