taipy/frontend/taipy-gui/public/stylekit/controls/table.css

/*
 * Copyright 2021-2024 Avaiga Private Limited
 *
 * Licensed 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.
 */

/**************************************************************

                  TABLE

***************************************************************/

:root {
  --table-stripe-opacity: 0.5;
}

/*************************************************
          NORMALIZATION
**************************************************/

.taipy-table {
  position: relative;
  max-width: 100%;
  z-index: 0; /* Fix table sticky header going above app fixed header on scroll */
}

.card .taipy-table .MuiPaper-elevation {
  box-shadow: none;
}

/*************************************************
          OVERRIDES/RESET CLASSES
          Give a softer look to default tables with, but allow resetting MUI defaults with classes
**************************************************/

/* Soft header on rows as Stylekit default */
/* "header-plain" class to return to MUI default plain header */
.taipy-table:where(:not(.header-plain)) thead th {
  background: var(--color-paper);
  font-weight: bold;
}

/* No borders on rows as Stylekit default */
/* "rows-bordered" class to return to MUI default rows with borders */
.taipy-table:where(:not(.rows-bordered)) thead th,
.taipy-table:where(:not(.rows-bordered)) tbody td {
  border-bottom: none;
}

/* Striped rows as Stylekit default */
/* "rows-similar" to return to MUI default similar looking rows */
.taipy-table:where(:not(.rows-similar)) tbody tr:nth-child(odd) {
  position: relative;
  z-index: 0;
}
.taipy-table:where(:not(.rows-similar)) tbody tr:nth-child(odd)::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background: var(--color-background);
  opacity: var(--table-stripe-opacity, 0.5);
}