Improved height limiting of tables

This commit is contained in:
Rsl1122 2019-08-14 17:56:23 +03:00
parent d3b7ffe499
commit 59309090a9
5 changed files with 72 additions and 52 deletions

View File

@ -67,7 +67,7 @@ public class TableContainer {
return getTableHeader() + return getTableHeader() +
parseHeader() + parseHeader() +
parseBody() + parseBody() +
"</table>" + (jqueryDatatable != null ? "</div>" : ""); "</table></div>";
} }
public final String parseBody() { public final String parseBody() {

View File

@ -80,7 +80,7 @@ public enum Html {
TABLE_END("</tbody></table>"), TABLE_END("</tbody></table>"),
TABLE("<table class=\"table table-striped\">"), TABLE("<table class=\"table table-striped\">"),
TABLE_SCROLL("<table class=\"table table-striped scrollbar\">"), TABLE_SCROLL("<div class=\"scrollbar\"><table class=\"table table-striped\">"),
TABLE_JQUERY("<table class=\"table table-bordered table-striped table-hover ${0} dataTable\">"), TABLE_JQUERY("<table class=\"table table-bordered table-striped table-hover ${0} dataTable\">"),
TABLE_COLORED("<table class=\"bg-${0} table table-striped\">"), TABLE_COLORED("<table class=\"bg-${0} table table-striped\">"),
TABLE_HEAD("<thead>${0}</thead>"), TABLE_HEAD("<thead>${0}</thead>"),

View File

@ -47,6 +47,12 @@
} }
} }
div.scrollbar {
overflow: hidden;
overflow-y: auto;
max-height: 60vh;
}
.clickable { .clickable {
cursor: pointer; cursor: pointer;
} }

View File

@ -356,15 +356,19 @@
class="far fa-fw fa-hand-pointer"></i> class="far fa-fw fa-hand-pointer"></i>
<small>Click to expand</small></span></h6> <small>Click to expand</small></span></h6>
</div> </div>
<table class="table mb-0" id="tableAccordion"> <div class="scrollbar">
<thead> <table class="table mb-0" id="tableAccordion">
<th><i class="fa fa-fw fa-server"></i> Server</th> <thead>
<th><i class="far fa-fw fa-clock"></i> Session Started</th> <tr>
<th><i class="far fa-fw fa-clock"></i> Length</th> <th><i class="fa fa-fw fa-server"></i> Server</th>
<th><i class="far fa-fw fa-map"></i> Most played World</th> <th><i class="far fa-fw fa-clock"></i> Session Started</th>
</thead> <th><i class="far fa-fw fa-clock"></i> Length</th>
<tbody></tbody> <th><i class="far fa-fw fa-map"></i> Most played World</th>
</table> </tr>
</thead>
<tbody></tbody>
</table>
</div>
</div> </div>
</div> <!-- End of Most recent sessions --> </div> <!-- End of Most recent sessions -->
<div class="col-lg-4 mb-4 col-sm-12"> <div class="col-lg-4 mb-4 col-sm-12">
@ -540,15 +544,19 @@
Servers<span class="float-right"><i class="far fa-fw fa-hand-pointer"></i> Servers<span class="float-right"><i class="far fa-fw fa-hand-pointer"></i>
<small>Click to expand</small></span></h6> <small>Click to expand</small></span></h6>
</div> </div>
<table class="table mb-0" id="tableServerAccordion"> <div class="scrollbar">
<thead> <table class="table mb-0" id="tableServerAccordion">
<th><i class="fa fa-fw fa-server"></i> Server</th> <thead>
<th><i class="far fa-fw fa-clock"></i> Playtime</th> <tr>
<th><i class="far fa-fw fa-calendar-plus"></i> Registered</th> <th><i class="fa fa-fw fa-server"></i> Server</th>
<th><i class="far fa-fw fa-calendar-check"></i> Last Seen</th> <th><i class="far fa-fw fa-clock"></i> Playtime</th>
</thead> <th><i class="far fa-fw fa-calendar-plus"></i> Registered</th>
<tbody></tbody> <th><i class="far fa-fw fa-calendar-check"></i> Last Seen</th>
</table> </tr>
</thead>
<tbody></tbody>
</table>
</div>
</div> </div>
</div> <!-- End of Most recent sessions --> </div> <!-- End of Most recent sessions -->
<div class="col-lg-4 mb-4 col-sm-12"> <div class="col-lg-4 mb-4 col-sm-12">

View File

@ -535,18 +535,20 @@
class="far fa-fw fa-hand-pointer"></i> class="far fa-fw fa-hand-pointer"></i>
<small>Click to expand</small></span></h6> <small>Click to expand</small></span></h6>
</div> </div>
<table class="table mb-0" id="tableAccordion"> <div class="scrollbar" style="height: 80vh">
<thead> <table class="table mb-0" id="tableAccordion">
<tr> <thead>
<th><i class="fa fa-fw fa-user"></i> Player</th> <tr>
<th><i class="far fa-fw fa-clock"></i> Session Started</th> <th><i class="fa fa-fw fa-user"></i> Player</th>
<th><i class="far fa-fw fa-clock"></i> Length</th> <th><i class="far fa-fw fa-clock"></i> Session Started</th>
<th><i class="far fa-fw fa-map"></i> Most played World</th> <th><i class="far fa-fw fa-clock"></i> Length</th>
</tr> <th><i class="far fa-fw fa-map"></i> Most played World</th>
</thead> </tr>
<tbody> </thead>
</tbody> <tbody>
</table> </tbody>
</table>
</div>
</div> </div>
</div> <!-- End of Most recent sessions --> </div> <!-- End of Most recent sessions -->
<div class="col-lg-4 mb-4 col-sm-12"> <div class="col-lg-4 mb-4 col-sm-12">
@ -699,8 +701,10 @@
class="fas fa-fw fa-crosshairs col-red"></i> class="fas fa-fw fa-crosshairs col-red"></i>
Recent Kills</h6> Recent Kills</h6>
</div> </div>
<table class="table" id="playerKillTable"> <div class="scrollbar">
</table> <table class="table" id="playerKillTable">
</table>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -940,24 +944,26 @@
class="fas fa-fw fa-wifi col-green"></i> class="fas fa-fw fa-wifi col-green"></i>
Connection Information</h6> Connection Information</h6>
</div> </div>
<table class="table mb-0"> <div class="scrollbar">
<thead class="bg-amber"> <table class="table mb-0">
<tr> <thead class="bg-amber">
<th><i class=" fa fa-fw fa-globe"></i> Country</th> <tr>
<th><i class=" fa fa-fw fa-signal"></i> Average Ping</th> <th><i class=" fa fa-fw fa-globe"></i> Country</th>
<th><i class=" fa fa-fw fa-signal"></i> Worst Ping</th> <th><i class=" fa fa-fw fa-signal"></i> Average Ping</th>
<th><i class=" fa fa-fw fa-signal"></i> Best Ping</th> <th><i class=" fa fa-fw fa-signal"></i> Worst Ping</th>
</tr> <th><i class=" fa fa-fw fa-signal"></i> Best Ping</th>
</thead> </tr>
<tbody> </thead>
<tr> <tbody>
<td>Local Machine</td> <tr>
<td>-</td> <td>Local Machine</td>
<td>-</td> <td>-</td>
<td>-</td> <td>-</td>
</tr> <td>-</td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
</div> </div>
</div> </div>
</div> </div>