wdl-doc 0.15.0

Documentation generator for Workflow Description Language (WDL) documents.
Documentation
@import "tailwindcss";
@import "../../../../web-common/css/main.css";

/* Scan Rust source code */
@source "../../src/";

@layer components {
  .body--base {
    @apply size-full table-auto border-collapse text-base;
  }
  /**
   * Layout
   */
  .layout__header {
    @apply fixed flex flex-row top-0 right-0 left-0 w-screen z-50 border-b border-slate-900 bg-slate-950 transition-all;
  }
  /**
   * Layout - Alternative Layouts
   * Ex: The following layout states are supported. Requires the .layout__container--alt-layout class
   * .layout__container--left-hidden // left sidebar is hidden for larger center column (similar to mobile view)
   * .layout__container--left-lg // left sidebar is 50% larger than normal
   * .layout__container--left-xl // left sidebar is 100% larger than normal
   * .layout__container--right-hidden // right sidebar is hidden for larger center column (similar to mobile view)
   */
  .layout__container--alt-layout.layout__container--left-hidden .layout__sidebar-left {
    @apply -translate-x-full;
  }
  .layout__container--alt-layout.layout__container--left-hidden {
    @apply pl-0;
  }
  
  .layout__container--alt-layout.layout__container--left-lg .layout__sidebar-left {
    @apply w-96;
  }
  .layout__container--alt-layout.layout__container--left-lg {
    @apply pl-0 md:pl-96;
  }
  
  .layout__container--alt-layout.layout__container--left-xl .layout__sidebar-left {
    @apply w-full md:w-144;
  }
  .layout__container--alt-layout.layout__container--left-xl {
    @apply pl-0 md:pl-144;
  }

  .layout__container--alt-layout.layout__container--right-hidden .layout__sidebar-right {
    @apply hidden;
  }
  .layout__container--alt-layout.layout__container--right-hidden .layout__main-center {
    @apply max-w-full;
  }
  /**
   * Layout - Breadcrumbs
   */
  .layout__breadcrumb-container {
    @apply mb-8 text-xs;
  }
  .layout__breadcrumb-clickable {
    @apply text-slate-50 hover:text-slate-300 hover:underline;
  }
  .layout__breadcrumb-inactive {
    @apply text-slate-500;
  }
  /* RUN WITH component */
  .main__run-with-container {
    @apply flex flex-col gap-1.5 text-sm rounded-md bg-slate-900 border border-slate-800 mt-4 p-3;
  }
  .main__run-with-label {
    @apply flex flex-row items-center shrink gap-2 text-slate-50 text-xs;
  }
  .main__run-with-label-text {
    @apply text-slate-500 text-xs;
  }
  .main__run-with-toggle {
    @apply flex items-center justify-center rounded-full border border-slate-700 p-[2px];
  }
  .main__run-with-toggle-label--active {
    @apply bg-slate-50 text-slate-900 rounded-full px-1.5 py-0.5 transition-all cursor-pointer;
  }
  .main__run-with-toggle-label--inactive {
    @apply bg-slate-900 text-slate-50 rounded-full px-1.5 py-0.5 transition-all cursor-pointer;
  }
  .main__run-with-content {
    @apply flex flex-row gap-2;
  }
  .main__run-with-content-text {
    @apply text-sm border-slate-700 bg-slate-950 text-slate-300 rounded-md font-mono py-[0.2em] px-[0.4em];
  }
  /**
   * Main Grids
   */
  .main__grid-container {
    @apply rounded py-8;
  }
  .main__grid-header-separator {
    @apply col-span-full border-b border-slate-700;
  }
  .main__grid-row-separator {
    @apply col-span-full border-b border-slate-800;
  }
  .main__grid-row {
    @apply contents;
  }
  .main__grid-header-cell {
    @apply text-sm font-bold;
  }
  .main__grid-cell {
    @apply text-sm;
  }
  .main__grid-full-width-cell {
    @apply col-span-full text-sm gap-2;
  }
  .main__grid-toc-container {
    @apply grid grid-cols-[1fr_1fr_3fr] gap-4;
  }
  .main__grid-runtime-container {
    @apply grid grid-cols-[20%_1fr] gap-4;
  }
  .main__grid-req-inputs-container {
    @apply grid grid-cols-[1fr_1fr_3fr] gap-4;
  }
  .main__grid-non-req-param-container {
    @apply grid grid-cols-[1fr_1fr_2fr_3fr] gap-4;
  }
  .main__grid-struct-member-container {
    @apply grid grid-cols-[1fr_1fr_3fr] gap-4;
  }
  .main__grid-enum-choice-container {
    @apply grid grid-cols-[1fr_3fr] gap-4;
  }
  /**
   * Metadata
   */
  .main__grid-nested-container {
    @apply grid grid-cols-[20%_1fr] gap-4;
  }
  .main__addl-meta-outer-container {
    @apply flex flex-col gap-2 mb-4;
  }
  .main__addl-meta-inner-container {
    @apply flex flex-col gap-4 text-slate-300 bg-slate-900 rounded-md p-4;
  }
  .main__grid-meta-object-container {
    @apply grid grid-cols-[20%_1fr] gap-4;
  }
  .main__grid-nested-row {
    @apply contents;
  }
  .main__grid-nested-cell {
    @apply text-sm;
  }
  .main__grid-meta-array-container {
    @apply flex flex-row gap-2 flex-wrap;
  }
  .main__grid-meta-array-item {
    @apply flex;
  }
  .main__summary-container {
    @apply inline;
  }
  .main__grid-full-width-cell p,
  .main__grid-cell p {
    margin-top: 1em;
    margin-bottom: 1em;
  }
  .main__grid-full-width-cell p:first-of-type,
  .main__grid-cell p:first-of-type {
    margin-top: 0;
  }
  .main__grid-full-width-cell p:last-of-type,
  .main__grid-cell p:last-of-type {
    margin-bottom: 0;
  }
  /**
   * Left sidebar
   */
  .left-sidebar__indent {
    @apply w-px h-full border rounded-none border-gray-800 ml-1.5 mr-1;
  }
  .left-sidebar__container {
    @apply flex flex-col size-full text-nowrap pt-4 text-slate-400 border-r border-slate-900;
  }
  .left-sidebar__tabs-container {
    @apply flex items-center;
  }
  .left-sidebar__tabs {
    @apply flex grow items-center gap-x-1 border-b hover:cursor-pointer border-b-slate-700 py-3 px-1.5;
  }
  .left-sidebar__icon {
    @apply size-4;
  }
  .left-sidebar__content-container {
    @apply size-full rounded-md overflow-x-clip overflow-y-scroll pl-4 pr-2;
  }
  .left-sidebar__content {
    @apply w-full;
  }
  .left-sidebar__row {
    @apply flex flex-row items-center gap-x-1 h-8 w-full rounded-md hover:bg-slate-700/40 hover:text-slate-50 cursor-pointer;
  }
  .left-sidebar__row.left-sidebar__row--unclickable {
    @apply hover:bg-transparent cursor-default;
  }
  .left-sidebar__row--active {
    /* currently viewed page */
    @apply bg-slate-600/50 text-slate-50;
  }
  .left-sidebar__row-folder {
    @apply text-slate-400;
  }
  .left-sidebar__content-item-container {
    @apply flex flex-row items-center gap-x-1;
  }
  .left-sidebar__content-item-container--ancestor {
    @apply text-slate-50;
  }
  .left-sidebar__search-result-item {
    @apply flex flex-col border-b border-gray-700 text-slate-50 pl-2 pt-2;
  }
  .left-sidebar__search-result-item-container {
    @apply flex flex-row items-center gap-x-1 mb-2;
  }
  .left-sidebar__category {
    @apply flex items-center gap-x-1 h-6 text-slate-50 mt-2;
  }
  .left-sidebar__workflow {
    @apply flex flex-row items-center gap-x-1 h-8;
  }
  .left-sidebar__workflow-container {
    @apply flex flex-row items-center gap-x-1;
  }
  .left-sidebar__size-button {
    @apply w-6 h-6 rounded flex items-center justify-center opacity-40 text-lg hover:bg-slate-700 text-slate-500 hover:text-slate-100 focus:ring-2 focus:outline-0 focus:ring-slate-500 hover:opacity-100 cursor-pointer;
  }
  .left-sidebar__size-button.left-sidebar__size-button--active {
    @apply text-slate-100 bg-slate-700 opacity-100;
  }

  /**
   * Right Sidebar
   */
  .right-sidebar__container {
    @apply p-4 size-full bg-slate-950 text-white isolate flex flex-col;
  }
  .right-sidebar__header {
    @apply text-xs text-slate-600;
  }
  .right-sidebar__section-header {
    @apply max-w-xs h-8 px-2 flex items-center rounded-sm text-sm text-slate-400 hover:text-slate-300 hover:bg-slate-700/40 cursor-pointer;
  }
  .right-sidebar__section-header--active {
    @apply bg-slate-600/50 text-white;
  }
  .right-sidebar__section-items {
    @apply flex flex-col gap-1.5 ml-4 border-l border-slate-600;
  }
  .right-sidebar__section-item {
    @apply max-w-xs h-8 px-4 flex items-center rounded-sm text-sm text-slate-400 -ml-2 hover:text-slate-300 hover:bg-slate-700/40 cursor-pointer;
  }
  .right-sidebar__section-item--active {
    @apply bg-slate-600/50 text-white;
  }
  .right-sidebar__back-to-top-container {
    @apply mt-4;
  }
  .right-sidebar__back-to-top {
    @apply flex items-center text-slate-400 hover:text-slate-300 cursor-pointer;
  }
  .right-sidebar__back-to-top-icon {
    @apply mr-2 flex items-center justify-center w-6 h-6 rounded-full border border-slate-500;
  }
  .right-sidebar__back-to-top-text {
    @apply text-sm;
  }
  /**
   * Search
   */
  #searchbox {
    @apply flex text-slate-400 w-full h-full px-8 outline-none bg-transparent items-center rounded-md border border-slate-700 transition-colors focus:border-slate-400 placeholder:text-slate-400;
  }
  #search-shortcut-hint {
    @apply absolute right-2 top-1/2 -translate-y-1/2 size-6 border border-slate-700 rounded-sm text-slate-400 font-bold flex items-center justify-center;

    background: linear-gradient(
      to top,
      var(--color-slate-800) 0%,
      oklch(from var(--color-slate-800) l c h / 0) 100%
    );
  }
  .search-result {
    @apply py-4 flex flex-col gap-2 border-b border-b-slate-800;
  }
  .search-result-excerpt {
    @apply text-sm leading-[1.375rem] font-normal;
  }
  .search-result-excerpt mark {
    @apply text-slate-950 bg-cyan-400 rounded;
  }
}

@layer utilities {
  .crop-ellipsis {
    @apply overflow-x-hidden text-ellipsis whitespace-nowrap;
  }
}