hbase-server/src/main/resources/hbase-webapps/static/css/hbase.css

/**
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/* General styling */

/* Preserve original HBase UI colors */
:root,
[data-bs-theme=light] {
  --bs-blue: #337ab7;
  --bs-primary: #337ab7;
  --bs-link-color: #337ab7;
  --bs-link-color-rgb: #337ab7;
  --bs-link-hover-color: #23527c;
  --bs-link-hover-color-rgb: #23527c;
}
.nav-pills {
  --bs-nav-pills-link-active-bg: #337ab7;
}
.btn-primary {
  --bs-btn-bg: #337ab7;
  --bs-btn-border-color: #337ab7;
  --bs-btn-hover-bg: #265a88;
  --bs-btn-hover-border-color: #204d74;
  --bs-btn-disabled-bg: #337ab7;
  --bs-btn-disabled-border-color: #337ab7;
}
.form-control:focus {
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}
/* Avoid links with black color. */
a {
  color: var(--bs-link-color-rgb);
}
.pagination {
  --bs-pagination-active-border-color: #337ab7;
}
/* Restore active navbar link background-color */
.navbar-nav .nav-link.active {
  background: linear-gradient(to bottom, #dbdbdb 0, #e2e2e2 100%);
}
@media (min-width: 768px) {
  /* With Bootstrap 5 the navbar has 8px vertical padding and the links are smaller vertically.
   For desktop view only we "grow" the link to the same height as navbar
   and "position it to reach" navbar. */
  .navbar-nav .nav-link.active {
    height: calc(100% + 16px);
    margin: -8px 0;
    padding-top: 16px;
  }
}
/* Make sure background color is visible in tables (Tasks) where alert class is used. */
tr.alert td {
  background: none;
}
/* End of Preserve original HBase UI colors */

body { padding-top: 50px; }
html .content {
  padding: 0 2.0em;
}
.navbar-brand img {
  margin-top: -7px;
}
.inner_header { margin-bottom: 1em;}
section {
  width: 100%;
  margin-bottom: 3em;
}

/** Avoid double bottom borders with tables in tab contents.  */
td, tfoot, th, thead, tr {
  border-style: none;
  border-top: 1px solid #ddd;
}

.page-header {
  padding-bottom: 9px;
  margin: 40px 0 20px;
  border-bottom: 1px solid #eee;
}

.page-header small {
  font-size: 65%;
  color: #6c757d;
}

.tab-content {
  padding-bottom: 9px;
  border-bottom: 1px solid #ddd;
}

/* Master page styling */
#tab_catalogTables table {
    /*
     Catalog tab on master doesn't have any content before
     it. Make sure there is some padding so it
     doesn't look crowded.
     */
    margin-top: 1.2em;
}

table#tab_Procedures td:nth-child(-n+7) {
    word-break: normal;
    overflow-wrap: normal;
}

table#userTables td:nth-child(-n+11) {
    word-break: normal;
    overflow-wrap: normal;
}

.top_header { margin-top: 1.5em; }

/* Region Server page styling */

/* striped tables styling */
table.table-striped td {
    word-break: break-all;
    overflow-wrap: break-word;
}

/* sortable tables styling */
table.tablesorter thead tr .tablesorter-header {
    background-image: url(bg.gif);
    background-repeat: no-repeat;
    background-position: center right;
    cursor: pointer;
    padding-right: 30px;
}
table.tablesorter thead tr .tablesorter-headerAsc {
    background-image: url(asc.gif);
}
table.tablesorter thead tr .tablesorter-headerDesc {
    background-image: url(desc.gif);
}

table.nowrap th, table.nowrap td {
    white-space: nowrap;
}

/* Block Cache pagination */
.pagination-container {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 0;
}

.page-numbers {
  display: flex;
  gap: 4px;
}

.page-number {
  min-width: 30px;
  text-align: center;
}

.page-number.active {
  font-weight: bold;
  background-color: #eee;
}

.page-info {
  margin-left: 15px;
  font-size: 0.9em;
  color: #666;
}