//- 💫 INCLUDES > MIXINS include _functions include _mixins-base //- Headlines level - [integer] headline level, corresponds to h1, h2, h3 etc. id - [string] unique identifier, creates permalink (optional) mixin h(level, id, source) +headline(level).u-heading(id=id)&attributes(attributes) +permalink(id) block if source +button(gh("spacy", source), false, "secondary", "small").u-nowrap.u-float-right span Source #[+icon("code", 14).o-icon--inline] //- External links url - [string] link href trusted - [boolean] if not set / false, rel="noopener nofollow" is added info: https://mathiasbynens.github.io/rel-noopener/ mixin a(url, trusted) - external = url.includes("http") a(href=url target=external ? "_blank" : null rel=external && !trusted ? "noopener nofollow" : null)&attributes(attributes) block //- Source link (with added icon for "code") url - [string] link href, can also be gh() function to generate GitHub link see _functions.jade for more info mixin src(url) span.u-inline-block.u-nowrap +a(url) block | #[+icon("code", 16).o-icon--inline.u-color-theme] //- API link (with added tag and automatically generated path) path - [string] path to API docs page relative to /api/ mixin api(path) - path = convertAPIPath(path) +a("/api/" + path, true)(target="_self").u-no-border.u-inline-block.u-nowrap block | #[+icon("book", 16).o-icon--inline.u-color-theme] //- Help icon with tooltip tooltip - [string] Tooltip text icon_size - [integer] Optional size of help icon in px. mixin help(tooltip, icon_size) span(data-tooltip=tooltip)&attributes(attributes) if tooltip span.u-hidden(aria-role="tooltip")=tooltip +icon("help_o", icon_size || 16).o-icon--inline //- Aside for text label - [string] aside title (optional) mixin aside(label) +aside-wrapper(label) .c-aside__text.u-text-small block //- Aside for code label - [string] aside title (optional or false for no label) language - [string] language for syntax highlighting (default: "python") supports basic relevant languages available for PrismJS prompt - [string] prompt displayed before first line, e.g. "$" mixin aside-code(label, language, prompt) +aside-wrapper(label) +code(false, language, prompt).o-no-block block //- Infobox label - [string] infobox title (optional or false for no title) emoji - [string] optional emoji displayed before the title, necessary as argument to be able to wrap it for spacing mixin infobox(label, emoji) aside.o-box.o-block.u-text-small if label h3.u-heading.u-text-label.u-color-theme if emoji span.o-emoji=emoji | #{label} block //- Logos displayed in the top corner of some infoboxes logos - [array] List of icon ID, width, height and link. mixin infobox-logos(...logos) .o-box__logos.u-text-right.u-float-right for logo in logos if logo[3] | #[+a(logo[3]).u-inline-block.u-hide-link.u-padding-small #[+icon(logo[0], logo[1], logo[2]).u-color-dark]] else | #[+icon(logo[0], logo[1], logo[2]).u-color-dark] //- Link button url - [string] link href trusted - [boolean] if not set / false, rel="noopener nofollow" is added info: https://mathiasbynens.github.io/rel-noopener/ ...style - all other arguments are added as class names c-button--argument see assets/css/_components/_buttons.sass mixin button(url, trusted, ...style) - external = url && url.includes("http") a.c-button.u-text-label(href=url class=prefixArgs(style, "c-button") role="button" target=external ? "_blank" : null rel=external && !trusted ? "noopener nofollow" : null)&attributes(attributes) block //- Code block label - [string] aside title (optional or false for no label) language - [string] language for syntax highlighting (default: "python") supports basic relevant languages available for PrismJS prompt - [string] prompt displayed before first line, e.g. "$" height - [integer] optional height to clip code block to icon - [string] icon displayed next to code block (e.g. "accept" for new code) wrap - [boolean] wrap text and disable horizontal scrolling mixin code(label, language, prompt, height, icon, wrap) pre.c-code-block.o-block(class="lang-#{(language || DEFAULT_SYNTAX)}" class=icon ? "c-code-block--has-icon" : null style=height ? "height: #{height}px" : null)&attributes(attributes) if label h4.u-text-label.u-text-label--dark=label - var icon = icon || (prompt == 'accept' || prompt == 'reject') if icon - var classes = {'accept': 'u-color-green', 'reject': 'u-color-red'} .c-code-block__icon(class=classes[icon] || null class=classes[icon] ? "c-code-block__icon--border" : null) +icon(icon, 18) code.c-code-block__content(class=wrap ? "u-wrap" : null data-prompt=icon ? null : prompt) block //- Wrapper for code blocks to display old/new versions mixin code-wrapper() span.u-inline-block.u-padding-top.u-width-full block //- Code blocks to display old/new versions label - [string] ARIA label for block. Defaults to "correct"/"incorrect". mixin code-old(label) - var label = label || 'incorrect' +code(false, false, false, false, "reject").o-block-small(aria-label=label) block mixin code-new(label) - var label = label || 'correct' +code(false, false, false, false, "accept").o-block-small(aria-label=label) block //- CodePen embed slug - [string] ID of CodePen demo (taken from URL) height - [integer] height of demo embed iframe default_tab - [string] code tab(s) visible on load (default: "result") mixin codepen(slug, height, default_tab) figure.o-block(style="min-height: #{height}px")&attributes(attributes) .codepen(data-height=height data-theme-id="31335" data-slug-hash=slug data-default-tab=(default_tab || "result") data-embed-version="2" data-user=SOCIAL.codepen) +a("https://codepen.io/" + SOCIAL.codepen + "/" + slug) View on CodePen script(async src="https://assets.codepen.io/assets/embed/ei.js") //- GitHub embed repo - [string] repository owned by explosion organization file - [string] logical path to file, relative to repository root alt_file - [string] alternative file path used in footer and link button height - [integer] height of code preview in px mixin github(repo, file, height, alt_file, language) - var branch = ALPHA ? "develop" : "master" - var height = height || 250 figure.o-block pre.c-code-block.o-block-small(class="lang-#{(language || DEFAULT_SYNTAX)}" style="height: #{height}px; min-height: #{height}px") code.c-code-block__content(data-gh-embed="#{repo}/#{branch}/#{file}") footer.o-grid.u-text .o-block-small.u-flex-full.u-padding-small #[+icon("github")] #[code.u-break.u-break--all=repo + '/' + (alt_file || file)] div +button(gh(repo, alt_file || file), false, "primary", "small") View on GitHub //- Images / figures url - [string] url or path to image width - [integer] image width in px, for better rendering (default: 500) caption - [string] image caption alt - [string] alternative image text, defaults to caption mixin image(url, width, caption, alt) figure.o-block&attributes(attributes) if url img(src=url alt=(alt || caption) width="#{width || 500}") if caption +image-caption=caption block //- Image caption mixin image-caption() figcaption.u-text-small.u-color-subtle.u-padding-small&attributes(attributes) block //- Graphic or illustration with button original - [string] Path to original image mixin graphic(original) +image block if original .u-text-right +button(original, false, "secondary", "small") View large graphic //- Labels mixin label() .u-text-label.u-color-dark&attributes(attributes) block mixin label-inline() strong.u-text-label.u-color-dark&attributes(attributes) block //- Tag tooltip - [string] optional tooltip text. hide_icon - [boolean] hide tooltip icon mixin tag(tooltip, hide_icon) div.u-text-tag.u-text-tag--spaced(data-tooltip=tooltip)&attributes(attributes) block if tooltip if !hide_icon | #[+icon("help", 12).o-icon--tag] | #[span.u-hidden(aria-role="tooltip")=tooltip] //- "Requires model" tag with tooltip and list of capabilities ...capabs - [string] Required model capabilities, e.g. "vectors". mixin tag-model(...capabs) - var intro = "To use this functionality, spaCy needs a model to be installed" - var ext = capabs.length ? " that supports the following capabilities: " + capabs.join(', ') : "" +tag(intro + ext + ".") Needs model //- "New" tag to label features new in a specific version By using a separate mixin with a version ID, it becomes easy to quickly enable/disable tags without having to modify the markup in the docs. version - [string or integer] version number, without "v" prefix mixin tag-new(version) - var version = (typeof version == 'number') ? version.toFixed(1) : version - var tooltip = "This feature is new and was introduced in spaCy v" + version +tag(tooltip, true) v#{version} //- List type - [string] "numbers", "letters", "roman" (bulleted list if none set) start - [integer] start number mixin list(type, start) if type ol.c-list.o-block.u-text(class="c-list--#{type}" style=(start === 0 || start) ? "counter-reset: li #{(start - 1)}" : null)&attributes(attributes) block else ul.c-list.c-list--bullets.o-block.u-text&attributes(attributes) block //- List item (only used within +list) mixin item() li.c-list__item&attributes(attributes) block //- Table head - [array] table headings (should match number of columns) mixin table(head) table.c-table.o-block&attributes(attributes) if head +row("head") each column in head +head-cell=column block //- Table row (only used within +table) mixin row(...style) tr.c-table__row(class=prefixArgs(style, "c-table__row"))&attributes(attributes) block //- Header table cell (only used within +row) mixin head-cell() th.c-table__head-cell.u-text-label&attributes(attributes) block //- Table cell (only used within +row in +table) mixin cell() td.c-table__cell.u-text&attributes(attributes) block //- Grid Container ...style - all arguments are added as class names o-grid--argument see assets/css/_base/_grid.sass mixin grid(...style) .o-grid.o-block(class=prefixArgs(style, "o-grid"))&attributes(attributes) block //- Grid Column (only used within +grid) width - [string] "quarter", "third", "half", "two-thirds", "three-quarters" see $grid in assets/css/_variables.sass mixin grid-col(width) .o-grid__col(class="o-grid__col--#{width}")&attributes(attributes) block //- Card (only used within +grid) title - [string] card title url - [string] link for card author - [string] optional author, displayed as byline at the bottom icon - [string] optional ID of icon displayed with card width - [string] optional width of grid column, defaults to "half" mixin card(title, url, author, icon, width) +grid-col(width || "half").o-box.o-grid.o-grid--space.u-text&attributes(attributes) +a(url) h4.u-heading.u-text-label if icon +icon(icon, 25).u-float-right if title span.u-color-dark=title .o-block-small.u-text-small block if author .u-color-subtle.u-text-tiny by #{author} //- Table of contents, to be used with +item mixins for links col - [string] width of column (see +grid-col) mixin table-of-contents(col) +grid-col(col || "half") +infobox +label.o-block-small Table of contents +list("numbers").u-text-small.o-no-block block //- Bibliography id - [string] ID of bibliography component, for anchor links. Can be used if there's more than one bibliography on one page. mixin bibliography(id) section(id=id || "bibliography") +infobox +label.o-block-small Bibliography +list("numbers").u-text-small.o-no-block block //- Footnote id - [string / integer] ID of footnote. bib_id - [string] ID of bibliography component, defaults to "bibliography". tooltip - [string] optional text displayed as tooltip mixin fn(id, bib_id, tooltip) sup.u-padding-small(id="bib" + id data-tooltip=tooltip) span.u-text-tag +a("#" + (bib_id || "bibliography")).u-hide-link #{id} //- Table rows for annotation specs mixin pos-row(tag, pos, morph, desc) +row +cell #[code=tag] +cell #[code=pos] +cell each m in morph.split(" ") if m | #[code=m] +cell.u-text-small=desc mixin dep-row(label, desc) +row +cell #[code=label] +cell=desc //- Table rows for linguistic annotations annots [array] - array of cell content style [array] array of 1 (display as code) or 0 (display as text) mixin annotation-row(annots, style) +row for cell, i in annots if style && style[i] - cell = (typeof(cell) != 'boolean') ? cell : cell ? 'True' : 'False' +cell #[code=cell] else +cell=cell block