@gravity-ui/uikit/build/cjs/components/Table/Table.css

Gravity UI base styling and components

.g-table {
  overflow: auto;
  position: relative;
}
.g-table__scroll-container {
  overflow: auto;
  position: relative;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.g-table__scroll-container::-webkit-scrollbar {
  display: none;
}
.g-table__horizontal-scroll-bar {
  overflow-x: auto;
  margin-block-start: -1px;
}
.g-table__horizontal-scroll-bar-inner {
  height: 1px;
  position: relative;
}
.g-table__horizontal-scroll-bar-inner::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 1px;
  inset-block-start: 0;
  inset-inline-start: 0;
  background-color: rgba(255, 255, 255, 0.01);
}
.g-table__horizontal-scroll-bar_sticky-horizontal-scroll {
  position: sticky;
  z-index: 3;
}
.g-table__table {
  border-spacing: 0;
  border-collapse: separate;
}
.g-table__table_width_max {
  width: 100%;
}
.g-table__cell {
  box-sizing: content-box;
  padding: 11px var(--g-spacing-2) 10px;
  border-block-end: 1px solid var(--g-color-line-generic);
  line-height: 18px;
  text-align: start;
  overflow-wrap: break-word;
}
.g-table__cell:first-child {
  padding-inline-start: 0;
}
.g-table__cell:last-child {
  padding-inline-end: 0;
}
.g-table__cell:not(.g-table__cell_word-wrap) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.g-table__cell_align_center {
  text-align: center;
}
.g-table__cell_align_end {
  text-align: end;
}
.g-table .g-table__cell_sticky_start, .g-table .g-table__cell_sticky_end {
  position: sticky;
  z-index: 2;
  background: var(--g-color-base-background);
}
.g-table__cell_border_right {
  border-inline-end: 1px solid var(--g-color-line-generic);
}
.g-table__cell_edge-padding:first-child {
  padding-inline-start: var(--g-spacing-3);
}
.g-table__cell_edge-padding:last-child {
  padding-inline-end: var(--g-spacing-3);
}
.g-table__row_vertical-align_top {
  vertical-align: top;
}
.g-table__row_vertical-align_middle {
  vertical-align: middle;
}
.g-table__row_empty .g-table__cell {
  text-align: center;
}
.g-table__body .g-table__row:last-child .g-table__cell {
  border-block-end-color: transparent;
}
.g-table__head .g-table__cell {
  font-weight: var(--g-text-accent-font-weight);
}
.g-table__body .g-table__row_interactive:hover {
  background-color: var(--g-color-base-simple-hover-solid);
  cursor: pointer;
}
.g-table__body .g-table__row_interactive:hover .g-table__cell_sticky_start,
.g-table__body .g-table__row_interactive:hover .g-table__cell_sticky_end {
  background: var(--g-color-base-simple-hover-solid);
}
.g-table__body .g-table__row_disabled {
  opacity: 0.3;
}
.g-table_with-primary .g-table__body .g-table__cell {
  color: var(--g-color-text-secondary);
}
.g-table_with-primary .g-table__body .g-table__cell_primary {
  color: var(--g-color-text-primary);
}
.g-table_with-sticky-scroll {
  overflow: visible;
}