DataDesigner/docs/css/style.css

.nvidia-green {
    color: #76B900; /* NVIDIA green */
}

/* Style "NeMo" in the site name with pure CSS */
.md-header__topic:first-child .md-ellipsis {
    visibility: hidden;
    position: relative;
}

/* Make "NeMo" green using a gradient background trick */
.md-header__topic:first-child .md-ellipsis::after {
    content: "NeMo Data Designer";
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(90deg, #76B900 0%, #76B900 4.8ch, currentColor 4.8ch, currentColor 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Prevent selection of prompt and output markers */
.highlight .gp,
.highlight .go {
    user-select: none;
}

/* Reduce space between logo and site name */
.md-header__button.md-logo {
    margin-right: -1rem;
}

/* Remove background from Jupyter notebook outputs */
.jp-RenderedText pre,
.jp-OutputArea-output pre,
.output_stderr,
.output_stdout,
.output_stream,
div.output_area pre,
div.output_subarea pre,
.jupyter-wrapper .output_stream,
.jupyter-wrapper .output_stdout,
.jupyter-wrapper .output_stderr,
.jp-RenderedText[data-mime-type="application/vnd.jupyter.stderr"],
.jp-RenderedText[data-mime-type="application/vnd.jupyter.stderr"] pre,
.jp-OutputArea-output[data-mime-type="application/vnd.jupyter.stderr"],
.jp-OutputArea-output[data-mime-type="application/vnd.jupyter.stderr"] pre {
    background-color: transparent !important;
}

/* Override stderr-specific styling */
.highlight .err {
    background-color: transparent !important;
    border: none !important;
}

/* Make notebook cells grow with window size */
.md-content__inner {
    max-width: none !important;
}

.md-content__inner:has(.jp-Notebook) {
    padding-left: 0rem !important;
    padding-right: 0.5rem !important;
}

/* Rich output with horizontal scroll and compact tables */
.jp-RenderedText pre,
.jp-OutputArea-output pre,
.jp-RenderedHTMLCommon pre,
.jp-RenderedHTML pre {
    white-space: pre !important;
    overflow-x: auto !important;
    font-size: 0.6rem !important;
    line-height: 1.1 !important;
    padding: 0.25rem !important;
    margin: 0.25rem 0 !important;
}

/* Narrow sidebar */
.md-sidebar--primary,
.md-sidebar--primary .md-sidebar__scrollwrap {
    width: 10rem !important;
}

/* Hide right sidebar (TOC) by default, JavaScript will show it on Concepts and Plugins pages */
.md-sidebar.md-sidebar--secondary {
    display: none !important;
}

/* Show TOC on selected pages (controlled by JavaScript) */
body.show-toc .md-sidebar.md-sidebar--secondary {
    display: block !important;
}

/* Add color to TOC links on Concepts pages */
body.show-toc .md-sidebar--secondary .md-nav__link {
    transition: color 0.2s ease;
}

body.show-toc .md-sidebar--secondary .md-nav__link:hover {
    color: #76B900 !important;
}

body.show-toc .md-sidebar--secondary .md-nav__link--active {
    color: #76B900 !important;
    font-weight: 500;
}

/* Move repo and palette icons to the right */
.md-header__inner {
    padding-right: 0rem !important;
}

/* Reduce space between h1 headings and content below */
h1 {
    margin-bottom: 0.5rem !important;
}
h2 {
    margin-top: 0.2rem !important;
    margin-bottom: 0.2rem !important;
}

.md-typeset .devnote-dek {
    border-left: 0.18rem solid #76B900;
    color: var(--md-default-fg-color);
    font-size: 1.05rem;
    font-weight: 500;
    line-height: 1.45;
    margin: 0.6rem 0 1rem;
    padding-left: 0.8rem;
}

.md-typeset img.devnote-float-right,
.md-typeset img.devnote-section-graphic {
    background: var(--md-default-bg-color);
    border: 0.05rem solid var(--md-default-fg-color--lightest);
    border-radius: 0.3rem;
    box-shadow: 0 0.25rem 0.8rem rgb(0 0 0 / 18%);
}

.md-typeset img.devnote-float-right {
    float: right;
    width: min(42%, 28rem);
    max-width: 100%;
    height: auto;
    margin: 0 0 0.7rem 1rem;
}

.md-typeset img.devnote-section-graphic {
    float: right;
    width: min(38%, 24rem);
    max-width: 100%;
    height: auto;
    margin: 0.1rem 0 0.7rem 1rem;
}

.md-typeset .devnote-clear {
    clear: right;
}

.md-post--excerpt .devnote-hide-in-index {
    display: none;
}

@media screen and (max-width: 60em) {
    .md-typeset img.devnote-float-right,
    .md-typeset img.devnote-section-graphic {
        float: none;
        display: block;
        width: 100%;
        margin: 1rem 0;
    }
}

/* Define the company grid layout */

#grid-container {
    width: 100%;
    text-align: center;
  }

  #company-grid {
    display: inline-block;
    margin: 0 auto;
    gap: 10px;
    align-content: center;
    justify-content: center;
    grid-auto-flow: column;
  }

  [data-md-color-scheme="slate"] #company-grid {
    background-color: #ffffff;
    border-radius: .5rem;
    color: black;
  }

  .tile {
    display: inline-block;
    text-align: center;
    width: 120px;
    height: 120px;
    margin: 10px;
    padding: 5px;
    border-radius: .5rem;
  }

  .tile img {
    width: 100px;
  }

  .md-typeset__table > table {
    max-height: 60vh;
    min-width: 100%;
    width: max-content;
  }

  .md-typeset__table {
    display: block;
    overflow-x: auto;
  }

  .md-typeset__table code {
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
  }

  .md-typeset__table > table thead {
    position: sticky;
    top: 0;
    background-color: var(--md-default-bg-color);
  }

  .md-typeset__table > table th {
    border-bottom: .05rem solid var(--md-typeset-table-color);
  }

  .md-typeset__table > table tr:first-child td {
    border-top: none;
  }