mirror of
https://github.com/apache/impala.git
synced 2025-12-19 18:12:08 -05:00
e419964250
In the "Fragment Instances" page of a query, even though it is possible to sort the rows based on the fragment's name, it is difficult to distinguish between fragments and their instances. With row grouping based on fragment's name, it becomes easier to distinguish one fragment's instance from the other. The lexographical sorting of instances can still be done based on different columns, which splits the fragment's group and orders the rows lexicographically only based on the column's values. Row grouping has been implemented using the "RowGroup" extension for datatables - https://datatables.net/extensions/rowgroup/. Datatable libraries and its extensions have been added under the directory - "www/datatables". The datatable library's license has been updated according to version 1.13.2, which was previously not updated. The related row grouping extension's license has also been included. Change-Id: If2b7ed6e2a6d605553242a7db4dbeaa7fcae4606 Reviewed-on: http://gerrit.cloudera.org:8080/22226 Reviewed-by: Impala Public Jenkins <impala-public-jenkins@cloudera.com> Tested-by: Impala Public Jenkins <impala-public-jenkins@cloudera.com>
414 lines
12 KiB
CSS
414 lines
12 KiB
CSS
@charset "UTF-8";
|
|
:root {
|
|
--dt-row-selected: 0, 136, 204;
|
|
--dt-row-selected-text: 255, 255, 255;
|
|
--dt-row-selected-link: 9, 10, 11;
|
|
}
|
|
|
|
table.dataTable td.dt-control {
|
|
text-align: center;
|
|
cursor: pointer;
|
|
}
|
|
table.dataTable td.dt-control:before {
|
|
height: 1em;
|
|
width: 1em;
|
|
margin-top: -9px;
|
|
display: inline-block;
|
|
color: white;
|
|
border: 0.15em solid white;
|
|
border-radius: 1em;
|
|
box-shadow: 0 0 0.2em #444;
|
|
box-sizing: content-box;
|
|
text-align: center;
|
|
text-indent: 0 !important;
|
|
font-family: "Courier New", Courier, monospace;
|
|
line-height: 1em;
|
|
content: "+";
|
|
background-color: #31b131;
|
|
}
|
|
table.dataTable tr.dt-hasChild td.dt-control:before {
|
|
content: "-";
|
|
background-color: #d33333;
|
|
}
|
|
|
|
table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting_asc_disabled, table.dataTable thead > tr > th.sorting_desc_disabled,
|
|
table.dataTable thead > tr > td.sorting,
|
|
table.dataTable thead > tr > td.sorting_asc,
|
|
table.dataTable thead > tr > td.sorting_desc,
|
|
table.dataTable thead > tr > td.sorting_asc_disabled,
|
|
table.dataTable thead > tr > td.sorting_desc_disabled {
|
|
cursor: pointer;
|
|
position: relative;
|
|
padding-right: 26px;
|
|
}
|
|
table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:before, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:before, table.dataTable thead > tr > th.sorting_desc_disabled:after,
|
|
table.dataTable thead > tr > td.sorting:before,
|
|
table.dataTable thead > tr > td.sorting:after,
|
|
table.dataTable thead > tr > td.sorting_asc:before,
|
|
table.dataTable thead > tr > td.sorting_asc:after,
|
|
table.dataTable thead > tr > td.sorting_desc:before,
|
|
table.dataTable thead > tr > td.sorting_desc:after,
|
|
table.dataTable thead > tr > td.sorting_asc_disabled:before,
|
|
table.dataTable thead > tr > td.sorting_asc_disabled:after,
|
|
table.dataTable thead > tr > td.sorting_desc_disabled:before,
|
|
table.dataTable thead > tr > td.sorting_desc_disabled:after {
|
|
position: absolute;
|
|
display: block;
|
|
opacity: 0.125;
|
|
right: 10px;
|
|
line-height: 9px;
|
|
font-size: 0.8em;
|
|
}
|
|
table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:before, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > th.sorting_desc_disabled:before,
|
|
table.dataTable thead > tr > td.sorting:before,
|
|
table.dataTable thead > tr > td.sorting_asc:before,
|
|
table.dataTable thead > tr > td.sorting_desc:before,
|
|
table.dataTable thead > tr > td.sorting_asc_disabled:before,
|
|
table.dataTable thead > tr > td.sorting_desc_disabled:before {
|
|
bottom: 50%;
|
|
content: "▲";
|
|
}
|
|
table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:after,
|
|
table.dataTable thead > tr > td.sorting:after,
|
|
table.dataTable thead > tr > td.sorting_asc:after,
|
|
table.dataTable thead > tr > td.sorting_desc:after,
|
|
table.dataTable thead > tr > td.sorting_asc_disabled:after,
|
|
table.dataTable thead > tr > td.sorting_desc_disabled:after {
|
|
top: 50%;
|
|
content: "▼";
|
|
}
|
|
table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:after,
|
|
table.dataTable thead > tr > td.sorting_asc:before,
|
|
table.dataTable thead > tr > td.sorting_desc:after {
|
|
opacity: 0.6;
|
|
}
|
|
table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > th.sorting_asc_disabled:before,
|
|
table.dataTable thead > tr > td.sorting_desc_disabled:after,
|
|
table.dataTable thead > tr > td.sorting_asc_disabled:before {
|
|
display: none;
|
|
}
|
|
table.dataTable thead > tr > th:active,
|
|
table.dataTable thead > tr > td:active {
|
|
outline: none;
|
|
}
|
|
|
|
div.dataTables_scrollBody table.dataTable thead > tr > th:before, div.dataTables_scrollBody table.dataTable thead > tr > th:after,
|
|
div.dataTables_scrollBody table.dataTable thead > tr > td:before,
|
|
div.dataTables_scrollBody table.dataTable thead > tr > td:after {
|
|
display: none;
|
|
}
|
|
|
|
div.dataTables_processing {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 200px;
|
|
margin-left: -100px;
|
|
margin-top: -26px;
|
|
text-align: center;
|
|
padding: 2px;
|
|
}
|
|
div.dataTables_processing > div:last-child {
|
|
position: relative;
|
|
width: 80px;
|
|
height: 15px;
|
|
margin: 1em auto;
|
|
}
|
|
div.dataTables_processing > div:last-child > div {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 13px;
|
|
height: 13px;
|
|
border-radius: 50%;
|
|
background: 0 136 204;
|
|
animation-timing-function: cubic-bezier(0, 1, 1, 0);
|
|
}
|
|
div.dataTables_processing > div:last-child > div:nth-child(1) {
|
|
left: 8px;
|
|
animation: datatables-loader-1 0.6s infinite;
|
|
}
|
|
div.dataTables_processing > div:last-child > div:nth-child(2) {
|
|
left: 8px;
|
|
animation: datatables-loader-2 0.6s infinite;
|
|
}
|
|
div.dataTables_processing > div:last-child > div:nth-child(3) {
|
|
left: 32px;
|
|
animation: datatables-loader-2 0.6s infinite;
|
|
}
|
|
div.dataTables_processing > div:last-child > div:nth-child(4) {
|
|
left: 56px;
|
|
animation: datatables-loader-3 0.6s infinite;
|
|
}
|
|
|
|
@keyframes datatables-loader-1 {
|
|
0% {
|
|
transform: scale(0);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
@keyframes datatables-loader-3 {
|
|
0% {
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
transform: scale(0);
|
|
}
|
|
}
|
|
@keyframes datatables-loader-2 {
|
|
0% {
|
|
transform: translate(0, 0);
|
|
}
|
|
100% {
|
|
transform: translate(24px, 0);
|
|
}
|
|
}
|
|
table.dataTable.nowrap th, table.dataTable.nowrap td {
|
|
white-space: nowrap;
|
|
}
|
|
table.dataTable th.dt-left,
|
|
table.dataTable td.dt-left {
|
|
text-align: left;
|
|
}
|
|
table.dataTable th.dt-center,
|
|
table.dataTable td.dt-center,
|
|
table.dataTable td.dataTables_empty {
|
|
text-align: center;
|
|
}
|
|
table.dataTable th.dt-right,
|
|
table.dataTable td.dt-right {
|
|
text-align: right;
|
|
}
|
|
table.dataTable th.dt-justify,
|
|
table.dataTable td.dt-justify {
|
|
text-align: justify;
|
|
}
|
|
table.dataTable th.dt-nowrap,
|
|
table.dataTable td.dt-nowrap {
|
|
white-space: nowrap;
|
|
}
|
|
table.dataTable thead th,
|
|
table.dataTable thead td,
|
|
table.dataTable tfoot th,
|
|
table.dataTable tfoot td {
|
|
text-align: left;
|
|
}
|
|
table.dataTable thead th.dt-head-left,
|
|
table.dataTable thead td.dt-head-left,
|
|
table.dataTable tfoot th.dt-head-left,
|
|
table.dataTable tfoot td.dt-head-left {
|
|
text-align: left;
|
|
}
|
|
table.dataTable thead th.dt-head-center,
|
|
table.dataTable thead td.dt-head-center,
|
|
table.dataTable tfoot th.dt-head-center,
|
|
table.dataTable tfoot td.dt-head-center {
|
|
text-align: center;
|
|
}
|
|
table.dataTable thead th.dt-head-right,
|
|
table.dataTable thead td.dt-head-right,
|
|
table.dataTable tfoot th.dt-head-right,
|
|
table.dataTable tfoot td.dt-head-right {
|
|
text-align: right;
|
|
}
|
|
table.dataTable thead th.dt-head-justify,
|
|
table.dataTable thead td.dt-head-justify,
|
|
table.dataTable tfoot th.dt-head-justify,
|
|
table.dataTable tfoot td.dt-head-justify {
|
|
text-align: justify;
|
|
}
|
|
table.dataTable thead th.dt-head-nowrap,
|
|
table.dataTable thead td.dt-head-nowrap,
|
|
table.dataTable tfoot th.dt-head-nowrap,
|
|
table.dataTable tfoot td.dt-head-nowrap {
|
|
white-space: nowrap;
|
|
}
|
|
table.dataTable tbody th.dt-body-left,
|
|
table.dataTable tbody td.dt-body-left {
|
|
text-align: left;
|
|
}
|
|
table.dataTable tbody th.dt-body-center,
|
|
table.dataTable tbody td.dt-body-center {
|
|
text-align: center;
|
|
}
|
|
table.dataTable tbody th.dt-body-right,
|
|
table.dataTable tbody td.dt-body-right {
|
|
text-align: right;
|
|
}
|
|
table.dataTable tbody th.dt-body-justify,
|
|
table.dataTable tbody td.dt-body-justify {
|
|
text-align: justify;
|
|
}
|
|
table.dataTable tbody th.dt-body-nowrap,
|
|
table.dataTable tbody td.dt-body-nowrap {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
table.dataTable {
|
|
clear: both;
|
|
margin-top: 6px !important;
|
|
margin-bottom: 6px !important;
|
|
max-width: none !important;
|
|
border-collapse: separate !important;
|
|
}
|
|
table.dataTable td,
|
|
table.dataTable th {
|
|
-webkit-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
}
|
|
table.dataTable td.dataTables_empty,
|
|
table.dataTable th.dataTables_empty {
|
|
text-align: center;
|
|
}
|
|
table.dataTable.nowrap th,
|
|
table.dataTable.nowrap td {
|
|
white-space: nowrap;
|
|
}
|
|
table.dataTable.table-striped > tbody > tr:nth-of-type(2n+1) {
|
|
background-color: transparent;
|
|
}
|
|
table.dataTable > tbody > tr {
|
|
background-color: transparent;
|
|
}
|
|
table.dataTable > tbody > tr.selected > * {
|
|
box-shadow: inset 0 0 0 9999px rgb(0, 136, 204);
|
|
box-shadow: inset 0 0 0 9999px rgb(var(--dt-row-selected));
|
|
color: rgb(255, 255, 255);
|
|
color: rgb(var(--dt-row-selected-text));
|
|
}
|
|
table.dataTable > tbody > tr.selected a {
|
|
color: rgb(9, 10, 11);
|
|
color: rgb(var(--dt-row-selected-link));
|
|
}
|
|
table.dataTable.table-striped > tbody > tr.odd > * {
|
|
box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.023);
|
|
}
|
|
table.dataTable.table-striped > tbody > tr.odd.selected > * {
|
|
box-shadow: inset 0 0 0 9999px rgba(0, 136, 204, 0.923);
|
|
box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.923);
|
|
}
|
|
table.dataTable.table-hover > tbody > tr:hover > * {
|
|
box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.075);
|
|
}
|
|
table.dataTable.table-hover > tbody > tr.selected:hover > * {
|
|
box-shadow: inset 0 0 0 9999px rgba(0, 136, 204, 0.975);
|
|
box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.975);
|
|
}
|
|
|
|
div.dataTables_wrapper div.dataTables_length label {
|
|
font-weight: normal;
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_length select {
|
|
width: 75px;
|
|
display: inline-block;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_filter {
|
|
text-align: right;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_filter label {
|
|
font-weight: normal;
|
|
white-space: nowrap;
|
|
text-align: left;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_filter input {
|
|
margin-left: 0.5em;
|
|
display: inline-block;
|
|
width: auto;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_info {
|
|
padding-top: 8px;
|
|
white-space: nowrap;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_paginate {
|
|
margin: 0;
|
|
white-space: nowrap;
|
|
text-align: right;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_paginate ul.pagination {
|
|
margin: 2px 0;
|
|
white-space: nowrap;
|
|
}
|
|
div.dataTables_wrapper div.dataTables_processing {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 200px;
|
|
margin-left: -100px;
|
|
margin-top: -26px;
|
|
text-align: center;
|
|
padding: 1em 0;
|
|
}
|
|
|
|
div.dataTables_scrollHead table.dataTable {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
div.dataTables_scrollBody > table {
|
|
border-top: none;
|
|
margin-top: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
div.dataTables_scrollBody > table > thead .sorting:after,
|
|
div.dataTables_scrollBody > table > thead .sorting_asc:after,
|
|
div.dataTables_scrollBody > table > thead .sorting_desc:after {
|
|
display: none;
|
|
}
|
|
div.dataTables_scrollBody > table > tbody > tr:first-child > th,
|
|
div.dataTables_scrollBody > table > tbody > tr:first-child > td {
|
|
border-top: none;
|
|
}
|
|
|
|
div.dataTables_scrollFoot > .dataTables_scrollFootInner {
|
|
box-sizing: content-box;
|
|
}
|
|
div.dataTables_scrollFoot > .dataTables_scrollFootInner > table {
|
|
margin-top: 0 !important;
|
|
border-top: none;
|
|
}
|
|
|
|
@media screen and (max-width: 767px) {
|
|
div.dataTables_wrapper div.dataTables_length,
|
|
div.dataTables_wrapper div.dataTables_filter,
|
|
div.dataTables_wrapper div.dataTables_info,
|
|
div.dataTables_wrapper div.dataTables_paginate {
|
|
text-align: center;
|
|
}
|
|
}
|
|
table.dataTable.table-condensed > thead > tr > th {
|
|
padding-right: 20px;
|
|
}
|
|
|
|
table.table-bordered.dataTable {
|
|
border-right-width: 0;
|
|
}
|
|
table.table-bordered.dataTable th,
|
|
table.table-bordered.dataTable td {
|
|
border-left-width: 0;
|
|
}
|
|
table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child,
|
|
table.table-bordered.dataTable td:last-child,
|
|
table.table-bordered.dataTable td:last-child {
|
|
border-right-width: 1px;
|
|
}
|
|
table.table-bordered.dataTable tbody th,
|
|
table.table-bordered.dataTable tbody td {
|
|
border-bottom-width: 0;
|
|
}
|
|
|
|
div.dataTables_scrollHead table.table-bordered {
|
|
border-bottom-width: 0;
|
|
}
|
|
|
|
div.table-responsive > div.dataTables_wrapper > div.row {
|
|
margin: 0;
|
|
}
|
|
div.table-responsive > div.dataTables_wrapper > div.row > div[class^=col-]:first-child {
|
|
padding-left: 0;
|
|
}
|
|
div.table-responsive > div.dataTables_wrapper > div.row > div[class^=col-]:last-child {
|
|
padding-right: 0;
|
|
}
|