gojs/api/assets/custom.css

Interactive diagrams, charts, and graphs, such as trees, flowcharts, orgcharts, UML, BPMN, or business diagrams

/* Colors */
:root {
  --light-color-background-secondary: #fff;
  --light-color-icon-background: var(--light-color-background-secondary);
  --dark-color-background-secondary: #23262b;
  --color-extension: #fbbf24;
}

/* Override Tailwind */
h1 {
  font-weight: bold;
}

h2 {
  font-weight: bold;
}

p:not(.box, .boxrun, .boxread),
ul,
ol {
  padding-bottom: 0;
}

a:hover.tsd-kind-project {
  color: var(--color-ts-project);
}
a:hover.tsd-kind-module {
  color: var(--color-ts-module);
}
a:hover.tsd-kind-namespace {
  color: var(--color-ts-namespace);
}
a:hover.tsd-kind-enum {
  color: var(--color-ts-enum);
}
a:hover.tsd-kind-enum-member {
  color: var(--color-ts-enum-member);
}
a:hover.tsd-kind-variable {
  color: var(--color-ts-variable);
}
a:hover.tsd-kind-function {
  color: var(--color-ts-function);
}
a:hover.tsd-kind-class {
  color: var(--color-ts-class);
}
a:hover.tsd-kind-interface {
  color: var(--color-ts-interface);
}
a:hover.tsd-kind-constructor {
  color: var(--color-ts-constructor);
}
a:hover.tsd-kind-property {
  color: var(--color-ts-property);
}
a:hover.tsd-kind-method {
  color: var(--color-ts-method);
}
a:hover.tsd-kind-call-signature {
  color: var(--color-ts-call-signature);
}
a:hover.tsd-kind-index-signature {
  color: var(--color-ts-index-signature);
}
a:hover.tsd-kind-constructor-signature {
  color: var(--color-ts-constructor-signature);
}
a:hover.tsd-kind-parameter {
  color: var(--color-ts-parameter);
}
a:hover.tsd-kind-type-literal {
  color: var(--color-ts-type-literal);
}
a:hover.tsd-kind-type-parameter {
  color: var(--color-ts-type-parameter);
}
a:hover.tsd-kind-accessor {
  color: var(--color-ts-accessor);
}
a:hover.tsd-kind-get-signature {
  color: var(--color-ts-get-signature);
}
a:hover.tsd-kind-set-signature {
  color: var(--color-ts-set-signature);
}
a:hover.tsd-kind-type-alias {
  color: var(--color-ts-type-alias);
}

svg {
  display: unset;
}

code[class*='lang'],
pre[class*='lang'],
pre[class*='lang'] code {
  background: inherit;
  color: inherit;
  font-size: inherit;
  text-shadow: inherit;
  font-family: inherit;
  direction: inherit;
  text-align: inherit;
  white-space: inherit;
  word-spacing: inherit;
  word-break: inherit;
  line-height: inherit;
  -moz-tab-size: inherit;
  -o-tab-size: inherit;
  tab-size: inherit;
  -webkit-hyphens: inherit;
  -ms-hyphens: inherit;
  hyphens: inherit;
}

/* Override Typedoc style.css */
body {
  font-family: Inter var, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
    'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}

.container-main {
  margin: 2rem auto;
  padding: 0 0.5rem;
}

.col-content {
  padding: 0;
}

@media (min-width: 770px) {
  .container-main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
  }
}

@media (min-width: 1200px) {
  .container-main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 3.5fr) minmax(0, 20rem);
  }

  .col-content {
    padding: 0 1rem;
  }

  .page-menu {
    padding-left: 0;
  }
}

@media (min-width: 770px) and (max-width: 1399px) {
  .col-content {
    padding-left: 1rem;
  }

  .col-sidebar {
    padding-top: 0;
  }

  .site-menu {
    margin-top: 0;
  }
}

@media (max-width: 769px) {
  .has-menu .col-sidebar {
    gap: 0;
  }
}

h1 {
  font-size: 2.25rem;
}

h2 {
  font-size: 1.5rem;
}

h3 {
  font-size: 1.1rem;
}

h4 {
  font-size: 1rem;
}

h5 {
  font-size: 1rem;
}

h1,
h2,
h3,
h4,
h5 {
  margin: 0;
}

h3,
h4 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

#tsd-search .field input {
  top: 0;
}

.tsd-panel-group,
.tsd-panel-group.tsd-index-group,
.tsd-panel-group.tsd-index-group details,
.tsd-index-heading {
  margin: 0;
}

section.tsd-index-section {
  margin-top: 0.75rem;
}

h3.tsd-index-heading {
  margin-bottom: 0.5rem;
}

.tsd-panel.tsd-member {
  margin-bottom: 1rem;
}

.tsd-index-panel .tsd-index-list {
  padding: 0;
  display: block;
  column-count: 3;
}
@media (max-width: 769px) {
  .tsd-index-panel .tsd-index-list {
    column-count: 1;
  }
}
@media (min-width: 770px) and (max-width: 1024px) {
  .tsd-index-panel .tsd-index-list {
    column-count: 2;
  }
}

a.tsd-index-link {
  display: flex;
  font-size: inherit;
  position: relative;
}

.tsd-comment > :first-child {
  margin-top: 0;
}
.tsd-comment > :last-child,
.tsd-description > :last-child,
.tsd-signatures > :last-child {
  margin-bottom: 0;
}

.tsd-signatures {
  margin: 0;
}

.tsd-signatures .tsd-signature {
  margin: 0.5rem -1rem;
  padding: 1rem;
}

.tsd-signatures .tsd-signature:first-child {
  border-top-width: 0;
  margin: 0 -0.875rem 0.875rem -0.875rem;
  padding: 0 0.875rem 0.875rem 0.875rem;
}

.tsd-description .tsd-signatures .tsd-signature {
  border-top-width: 1px;
  border-radius: 0.2rem;
  margin: 0.5rem -1rem;
  padding: 1rem;
}

.tsd-nested-navigation {
  margin-left: 1.5rem;
}
.tsd-nested-navigation > li > details {
  margin-left: 0;
}

.tsd-navigation.settings {
  margin: 0;
}

.tsd-navigation a,
.tsd-page-navigation a {
  line-height: 1.25rem;
}

.tsd-page-navigation a {
  position: relative;
  padding: 0.25rem 0;
}

.tsd-member .tsd-anchor + h3 {
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--color-accent);
}

ul.tsd-parameter-list h5,
ul.tsd-type-parameter-list h5 {
  font-size: 1rem;
  margin: 0.25rem 0;
}

ul.tsd-parameters,
ul.tsd-type-parameters {
  list-style: square;
  margin: 0;
  padding-left: 20px;
}

ul.tsd-parameters > li.tsd-parameter-signature,
ul.tsd-type-parameters > li.tsd-parameter-signature {
  list-style: none;
  margin-left: -15px;
}

.tsd-typography ul {
  margin: 0;
}

h1 code.tsd-tag:first-of-type {
  margin-left: 0.5rem;
}

/* Add extra custom styling */
#topnavList a {
  color: inherit;
  font-weight: inherit;
}

#navTop a:hover {
  text-decoration: none;
}

.tsd-page-title {
  margin-bottom: 1rem;
}

#tsd-search-help {
  position: absolute;
  right: 1.5rem;
  opacity: 0.8;
}

.tsd-panel {
  margin: 1rem 0;
  padding: 0.875rem;
  border-radius: 0.2rem;
  background-color: var(--color-background-secondary);
}

.tsd-panel .tsd-panel {
  margin: 0;
  padding: 0;
}

.col-content .tsd-panel:first-child {
  margin-top: 0;
}

.tsd-panel > h1,
.tsd-panel > h2,
.tsd-panel > h3,
.tsd-panel > h4 {
  margin: 0 -0.875rem 0.875rem -0.875rem;
  padding: 0 0.875rem 0.875rem 0.875rem;
  border-bottom: 1px solid var(--color-accent);
}

.tsd-panel .tsd-panel > h4 {
  margin: 0.75rem 0;
  padding: 0;
  border-bottom: none;
}

.tsd-panel.tsd-extension {
  border: 2px solid var(--color-extension);
}

.tsd-panel.tsd-extension::before {
  content: 'note';
  text-transform: uppercase;
  color: var(--color-extension);
  margin-bottom: 0.5rem;
  font-weight: 600;
  display: block;
}

.tsd-panel.targeted {
  border: 2px solid var(--color-accent);
}

.tsd-hierarchy > h4 {
  margin-top: 0;
}

pre,
code {
  border-radius: 0.2rem;
}

.tsd-comment-tags {
  margin-top: 1em;
}
.tsd-comment-tags p {
  margin: 0;
}

ul.tsd-descriptions {
  position: relative;
  overflow: hidden;
  margin-top: 0;
  padding: 0;
  padding-top: 10px;
  list-style: none;
}
ul.tsd-descriptions.active > .tsd-description {
  display: none;
}
ul.tsd-descriptions.active > .tsd-description.current {
  display: block;
}

@media (min-width: 770px) and (max-width: 1399px) {
  .col-sidebar {
    max-height: calc(100vh - 2rem - 65px - 42px); /* navtop, toolbar */
  }
}

@media (min-width: 1200px) {
  .page-menu,
  .site-menu {
    max-height: calc(100vh - 2rem - 65px - 42px); /* navtop, toolbar */
  }
}

.tsd-page-navigation {
  margin-bottom: 1rem;
}

.tsd-navigation.settings {
  margin-bottom: 1rem;
}

.tsd-accordion-summary > h3,
.tsd-accordion-summary > h4,
.tsd-accordion-summary > h5 {
  display: flex;
}

.tsd-theme-toggle {
  display: flex;
  align-items: center;
  padding: 0;
}

.tsd-theme-toggle > h4 {
  margin-top: 0;
  margin-bottom: 0;
}

.membertype {
  display: block;
}
.membertype > br {
  display: none;
}
.membertype > span:not([class]) {
  display: none;
}

.tsd-subicon {
  width: 10px;
  height: 10px;
  min-width: 10px;
  min-height: 10px;
  position: absolute;
  left: 13px;
}

.tsd-subicon.static {
  top: 1px;
}

.tsd-subicon.readonly {
  bottom: 1px;
}

/* Displays a box around text */
.box,
.boxrun,
.boxread {
  border: 1px solid var(--color-accent);
  border-radius: 0.2rem;
  padding: 0.5rem;
  background: var(--color-background);
}

/* Copyright at bottom of page */
.bottom-copyright {
  margin-bottom: 2rem;
}

/* These rules are used since Tailwind can't seem to
   register third party CSS variables in arbitrary values */
#navTop {
  background-color: var(--color-background-secondary);
  border-bottom-color: var(--color-accent);
}

#topnavButton {
  color: var(--color-text);
}

#topnavList > div {
  border-color: var(--color-accent);
  background-color: var(--color-background-secondary);
  color: var(--color-text);
}