infima/styles/content/table.css

A UI framework for content-centric websites.

:root {
  --ifm-table-cell-padding: 0.75rem;

  --ifm-table-background: transparent;
  --ifm-table-stripe-background: var(--ifm-color-emphasis-100);

  --ifm-table-border-width: 1px;
  --ifm-table-border-color: var(--ifm-color-emphasis-300);

  --ifm-table-head-background: inherit;
  --ifm-table-head-color: inherit;
  --ifm-table-head-font-weight: var(--ifm-font-weight-bold);

  --ifm-table-cell-color: inherit;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  display: block;
  margin-bottom: var(--ifm-spacing-vertical);
  margin-top: 0;
  overflow: auto;
  width: 100%;

  & tr {
    background-color: var(--ifm-table-background);
    border-top: var(--ifm-table-border-width) solid
      var(--ifm-table-border-color);
  }

  & tr:nth-child(2n) {
    background-color: var(--ifm-table-stripe-background);
  }

  & th,
  & td {
    border: var(--ifm-table-border-width) solid var(--ifm-table-border-color);
    padding: var(--ifm-table-cell-padding);
  }

  & th {
    background-color: var(--ifm-table-head-background);
    color: var(--ifm-table-head-color);
    font-weight: var(--ifm-table-head-font-weight);
  }

  & td {
    color: var(--ifm-table-cell-color);
  }
}