Tin graphs have a height of 200 instead of 150.

This removes the wrapping error on the legend.
This commit is contained in:
Herbert Wolverson 2023-03-20 16:50:00 +00:00
parent 62ea9c7038
commit f0aaa05e38
2 changed files with 16 additions and 15 deletions

View File

@ -86,7 +86,7 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Throughput</h5>
<div id="throughputGraph" class="graph150"></div>
<div id="throughputGraph" class="graph200"></div>
</div>
</div>
</div>
@ -94,7 +94,7 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Backlog</h5>
<div id="backlogGraph" class="graph150"></div>
<div id="backlogGraph" class="graph200"></div>
</div>
</div>
</div>
@ -102,7 +102,7 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Capacity Quantile</h5>
<div id="capacityQuantile" class="graph150"></div>
<div id="capacityQuantile" class="graph200"></div>
</div>
</div>
</div>
@ -114,7 +114,7 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Delays</h5>
<div id="delayGraph" class="graph150"></div>
<div id="delayGraph" class="graph200"></div>
</div>
</div>
</div>
@ -122,7 +122,7 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Queue Length</h5>
<div id="qlenGraph" class="graph150"></div>
<div id="qlenGraph" class="graph200"></div>
</div>
</div>
</div>
@ -145,8 +145,8 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Tin 1 (Bulk)</h5>
<div id="tinTp_0" class="graph150"></div>
<div id="tinMd_0" class="graph150"></div>
<div id="tinTp_0" class="graph200"></div>
<div id="tinMd_0" class="graph200"></div>
</div>
</div>
</div>
@ -154,8 +154,8 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Tin 2 (Best Effort)</h5>
<div id="tinTp_1" class="graph150"></div>
<div id="tinMd_1" class="graph150"></div>
<div id="tinTp_1" class="graph200"></div>
<div id="tinMd_1" class="graph200"></div>
</div>
</div>
</div>
@ -165,8 +165,8 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Tin 3 (Video)</h5>
<div id="tinTp_2" class="graph150"></div>
<div id="tinMd_2" class="graph150"></div>
<div id="tinTp_2" class="graph200"></div>
<div id="tinMd_2" class="graph200"></div>
</div>
</div>
</div>
@ -174,8 +174,8 @@
<div class="card bg-light">
<div class="card-body">
<h5 class="card-title"><i class="fa fa-bar-chart"></i> Tin 4 (Voice)</h5>
<div id="tinTp_3" class="graph150"></div>
<div id="tinMd_3" class="graph150"></div>
<div id="tinTp_3" class="graph200"></div>
<div id="tinMd_3" class="graph200"></div>
</div>
</div>
</div>
@ -470,14 +470,14 @@
row += "<div class='col-sm-6'>";
row += "<div class='card bg-light'>";
row += "<h5 class='card-title'><i class='fa fa-hourglass'></i> <a class='redact' href='/tree?parent=" + data[i][0] + "'>" + redactText(data[i][1].name) + " Throughput</a></h5>";
row += "<div id='tp" + data[i][0] + "' class='graph98 graph150'></div>";
row += "<div id='tp" + data[i][0] + "' class='graph98 graph200'></div>";
row += "</div>";
row += "</div>";
row += "<div class='col-sm-6'>";
row += "<div class='card bg-light'>";
row += "<h5 class='card-title redact'><i class='fa fa-bar-chart'></i> " + redactText(data[i][1].name) + " TCP RTT</h5>";
row += "<div id='rtt" + data[i][0] + "' class='graph98 graph150'></div>";
row += "<div id='rtt" + data[i][0] + "' class='graph98 graph200'></div>";
row += "</div>";
row += "</div>";

View File

@ -9,6 +9,7 @@
.top-shunt { margin-top: -4px; margin-bottom: 4px; }
.center-txt { text-align: center; }
.bold { font-weight: bold; }
.graph200 { height: 200px; }
.graph150 { height: 150px; }
.graph98 { min-height: 97px; width: 100%; }
.mtop4 { margin-top: 4px; }