gian/phpmyadmin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Convert server status tables to Bootstrap style

Browse Source 
Signed-off-by: Maurício Meneghini Fauth <mauricio@fauth.dev>
This commit is contained in:
Maurício Meneghini Fauth 2020-11-18 22:59:35 -03:00
parent acd214c9b7
commit 43131cfe57
No known key found for this signature in database
GPG Key ID: 6A16FD38AFC89CC8
9 changed files with 34 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
templates/server/databases/index.twig
View File

@ -94,7 +94,7 @@
<form class="ajax" action="{{ url('/server/databases') }}" method="post" name="dbStatsForm" id="dbStatsForm">
{{ get_hidden_inputs(url_params) }}
<div class="table-responsive row">
<table class="table table-striped table-hover">
<table class="table table-striped table-hover w-auto">
<thead class="thead-light">
<tr>
{% if is_drop_allowed %}

36
templates/server/status/status/index.twig
View File

@ -7,46 +7,46 @@
<div class="row"><p>{{ 'This MySQL server has been running for %1$s. It started up on %2$s.'|trans|format(uptime, start_time) }}</p></div>
<div class="row justify-content-between">
<table id="serverstatustraffic" class="pma-table w-100 data noclick col-12 col-md-5">
<thead>
<table class="table table-light table-striped col-12 col-md-5">
<thead class="thead-light">
<tr>
<th>
<th scope="col">
{% trans 'Traffic' %}
{{ show_hint('On a busy server, the byte counters may overrun, so those statistics as reported by the MySQL server may be incorrect.'|trans) }}
</th>
<th>#</th>
<th>&oslash; {% trans 'per hour' %}</th>
<th scope="col">#</th>
<th scope="col">{% trans 'ø per hour' %}</th>
</tr>
</thead>
<tbody>
{% for each_traffic in traffic %}
<tr>
<th class="name">{{ each_traffic.name }}</th>
<td class="value">{{ each_traffic.number }}</td>
<td class="value">{{ each_traffic.per_hour }}</td>
<th scope="row">{{ each_traffic.name }}</th>
<td class="text-monospace text-right">{{ each_traffic.number }}</td>
<td class="text-monospace text-right">{{ each_traffic.per_hour }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<table id="serverstatusconnections" class="pma-table w-100 data noclick col-12 col-md-6">
<thead>
<table class="table table-light table-striped col-12 col-md-6">
<thead class="thead-light">
<tr>
<th>{% trans 'Connections' %}</th>
<th>#</th>
<th>&oslash; {% trans 'per hour' %}</th>
<th>%</th>
<th scope="col">{% trans 'Connections' %}</th>
<th scope="col">#</th>
<th scope="col">{% trans 'ø per hour' %}</th>
<th scope="col">%</th>
</tr>
</thead>
<tbody>
{% for connection in connections %}
<tr>
<th class="name">{{ connection.name }}</th>
<td class="value">{{ connection.number }}</td>
<td class="value">{{ connection.per_hour }}</td>
<td class="value">{{ connection.percentage }}</td>
<th scope="row">{{ connection.name }}</th>
<td class="text-monospace text-right">{{ connection.number }}</td>
<td class="text-monospace text-right">{{ connection.per_hour }}</td>
<td class="text-monospace text-right">{{ connection.percentage }}</td>
</tr>
{% endfor %}
</tbody>

17
themes/bootstrap/scss/_common.scss
View File

@ -1178,13 +1178,12 @@ div#serverstatusquerieschart {
}
table {
&#serverstatusqueriesdetails,
&#serverstatustraffic {
&#serverstatusqueriesdetails {
float: $left;
}
&#serverstatusqueriesdetails th {
min-width: 35px;
th {
min-width: 35px;
}
}
&#serverstatusvariables {
@ -1200,10 +1199,6 @@ table {
width: 6em;
}
}
&#serverstatusconnections {
float: $left;
}
}
div {
@ -3738,10 +3733,6 @@ body .ui-dialog {
display: none;
}
table#serverstatusconnections {
margin-#{$left}: 0;
}
#table_name_col_no {
top: 62px;
}

15
themes/metro/scss/_common.scss
View File

@ -1227,14 +1227,14 @@ div#serverstatusquerieschart {
}
table {
&#serverstatusqueriesdetails,
&#serverstatustraffic {
&#serverstatusqueriesdetails {
float: $left;
th {
min-width: 35px;
}
}
&#serverstatusqueriesdetails th {
min-width: 35px;
}
&#serverstatusvariables {
width: 100%;
@ -1249,11 +1249,6 @@ table {
width: 6em;
}
}
&#serverstatusconnections {
float: $left;
margin-#{$left}: 30px;
}
}
div {

2
themes/metro/scss/_tables.scss
View File

@ -1,6 +1,4 @@
.table {
width: auto;
td {
touch-action: manipulation;
vertical-align: middle;

18
themes/original/scss/_common.scss
View File

@ -968,15 +968,6 @@ div {
}
table {
&#serverstatustraffic {
float: $left;
}
&#serverstatusconnections {
float: $left;
margin-#{$left}: 30px;
}
&#serverstatusvariables {
width: 100%;
margin-bottom: 1em;
@ -990,11 +981,6 @@ table {
width: 6em;
}
}
&#serverstatusconnections {
float: $left;
margin-#{$left}: 30px;
}
}
div {
@ -3429,10 +3415,6 @@ body {
display: none;
}
table#serverstatusconnections {
margin-#{$left}: 0;
}
#table_name_col_no {
top: 62px;
}

1
themes/original/scss/_tables.scss
View File

@ -1,6 +1,5 @@
.table {
border-collapse: separate;
width: auto;
td {
touch-action: manipulation;

18
themes/pmahomme/scss/_common.scss
View File

@ -1233,14 +1233,14 @@ div#serverstatusquerieschart {
}
table {
&#serverstatusqueriesdetails,
&#serverstatustraffic {
&#serverstatusqueriesdetails {
float: $left;
th {
min-width: 35px;
}
}
&#serverstatusqueriesdetails th {
min-width: 35px;
}
&#serverstatusvariables {
width: 100%;
@ -1255,10 +1255,6 @@ table {
width: 6em;
}
}
&#serverstatusconnections {
float: $left;
}
}
div {
@ -3801,10 +3797,6 @@ body .ui-dialog {
display: none;
}
table#serverstatusconnections {
margin-#{$left}: 0;
}
#table_name_col_no {
top: 62px;
}

4
themes/pmahomme/scss/_tables.scss
View File

@ -1,6 +1,4 @@
.table {
width: auto;
th,
td {
text-shadow: 0 1px 0 #fff;
@ -8,7 +6,6 @@
th {
text-align: $left;
background-image: linear-gradient(#fff, #ccc);
}
td {
@ -18,6 +15,7 @@
thead th {
border-#{$right}: 1px solid #fff;
background-image: linear-gradient(#fff, #ccc);
}
}