mirror of
https://github.com/explosion/spaCy.git
synced 2024-09-21 11:29:13 +03:00
Merge mixins and mixins-base
The distinction was never clear anyways and it was progressively getting messier. So all mixins live in one file now.
This commit is contained in:
ines
parent
256c7dac5a
commit
08869c19fd
|
|
@ -1,244 +0,0 @@
|
||||||
//- 💫 MIXINS > BASE
|
|
||||||
|
|
||||||
//- Section
|
|
||||||
id - [string] anchor assigned to section (used for breadcrumb navigation)
|
|
||||||
|
|
||||||
mixin section(id)
|
|
||||||
section.o-section(id="section-" + id data-section=id)
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- Aside wrapper
|
|
||||||
label - [string] aside label
|
|
||||||
|
|
||||||
mixin aside-wrapper(label)
|
|
||||||
aside.c-aside
|
|
||||||
.c-aside__content(role="complementary")&attributes(attributes)
|
|
||||||
if label
|
|
||||||
h4.u-text-label.u-text-label--dark=label
|
|
||||||
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- SVG from map (uses embedded SVG sprite)
|
|
||||||
name - [string] SVG symbol id
|
|
||||||
width - [integer] width in px
|
|
||||||
height - [integer] height in px (default: same as width)
|
|
||||||
|
|
||||||
mixin svg(name, width, height)
|
|
||||||
svg(aria-hidden="true" viewBox="0 0 #{width} #{height || width}" width=width height=(height || width))&attributes(attributes)
|
|
||||||
use(xlink:href="#svg_#{name}")
|
|
||||||
|
|
||||||
|
|
||||||
//- Icon
|
|
||||||
name - [string] icon name (will be used as symbol id: #svg_{name})
|
|
||||||
width - [integer] icon width (default: 20)
|
|
||||||
height - [integer] icon height (defaults to width)
|
|
||||||
|
|
||||||
mixin icon(name, width, height)
|
|
||||||
- var width = width || 20
|
|
||||||
- var height = height || width
|
|
||||||
+svg(name, width, height).o-icon(style="min-width: #{width}px")&attributes(attributes)
|
|
||||||
|
|
||||||
|
|
||||||
//- Pro/Con/Neutral icon
|
|
||||||
icon - [string] "pro", "con" or "neutral" (default: "neutral")
|
|
||||||
size - [integer] icon size (optional)
|
|
||||||
|
|
||||||
mixin procon(icon, label, show_label, size)
|
|
||||||
- var colors = { yes: "green", no: "red", neutral: "subtle" }
|
|
||||||
span.u-nowrap
|
|
||||||
+icon(icon, size || 20)(class="u-color-#{colors[icon] || 'subtle'}").o-icon--inline&attributes(attributes)
|
|
||||||
span.u-text-small(class=show_label ? null : "u-hidden")=(label || icon)
|
|
||||||
|
|
||||||
//- Headlines Helper Mixin
|
|
||||||
level - [integer] 1, 2, 3, 4, or 5
|
|
||||||
|
|
||||||
mixin headline(level)
|
|
||||||
if level == 1
|
|
||||||
h1.u-heading-1&attributes(attributes)
|
|
||||||
block
|
|
||||||
|
|
||||||
else if level == 2
|
|
||||||
h2.u-heading-2&attributes(attributes)
|
|
||||||
block
|
|
||||||
|
|
||||||
else if level == 3
|
|
||||||
h3.u-heading-3&attributes(attributes)
|
|
||||||
block
|
|
||||||
|
|
||||||
else if level == 4
|
|
||||||
h4.u-heading-4&attributes(attributes)
|
|
||||||
block
|
|
||||||
|
|
||||||
else if level == 5
|
|
||||||
h5.u-heading-5&attributes(attributes)
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- Permalink rendering
|
|
||||||
id - [string] permalink ID used for link anchor
|
|
||||||
|
|
||||||
mixin permalink(id)
|
|
||||||
if id
|
|
||||||
a.u-permalink(href="##{id}")
|
|
||||||
block
|
|
||||||
|
|
||||||
else
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- Quickstart widget
|
|
||||||
quickstart.js with manual markup, inspired by PyTorch's "Getting started"
|
|
||||||
groups - [object] option groups, uses global variable QUICKSTART
|
|
||||||
headline - [string] optional text to be rendered as widget headline
|
|
||||||
|
|
||||||
mixin quickstart(groups, headline, description, hide_results)
|
|
||||||
.c-quickstart.o-block-small#qs
|
|
||||||
.c-quickstart__content
|
|
||||||
if headline
|
|
||||||
+h(2)=headline
|
|
||||||
if description
|
|
||||||
p=description
|
|
||||||
for group in groups
|
|
||||||
.c-quickstart__group.u-text-small(data-qs-group=group.id)
|
|
||||||
if group.title
|
|
||||||
.c-quickstart__legend=group.title
|
|
||||||
if group.help
|
|
||||||
| #[+help(group.help)]
|
|
||||||
.c-quickstart__fields
|
|
||||||
for option in group.options
|
|
||||||
input.c-quickstart__input(class="c-quickstart__input--" + (group.input_style ? group.input_style : group.multiple ? "check" : "radio") type=group.multiple ? "checkbox" : "radio" name=group.id id="qs-#{option.id}" value=option.id checked=option.checked)
|
|
||||||
label.c-quickstart__label.u-text-tiny(for="qs-#{option.id}")!=option.title
|
|
||||||
if option.meta
|
|
||||||
| #[span.c-quickstart__label__meta (#{option.meta})]
|
|
||||||
if option.help
|
|
||||||
| #[+help(option.help)]
|
|
||||||
|
|
||||||
if hide_results
|
|
||||||
block
|
|
||||||
else
|
|
||||||
pre.c-code-block
|
|
||||||
code.c-code-block__content.c-quickstart__code(data-qs-results="")
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- Quickstart code item
|
|
||||||
data - [object] Rendering conditions (keyed by option group ID, value: option)
|
|
||||||
style - [string] modifier ID for line style
|
|
||||||
|
|
||||||
mixin qs(data, style)
|
|
||||||
- args = {}
|
|
||||||
for value, setting in data
|
|
||||||
- args['data-qs-' + setting] = value
|
|
||||||
span.c-quickstart__line(class="c-quickstart__line--#{style || 'bash'}")&attributes(args)
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- Terminal-style code window
|
|
||||||
label - [string] title displayed in top bar of terminal window
|
|
||||||
|
|
||||||
mixin terminal(label)
|
|
||||||
.x-terminal
|
|
||||||
.x-terminal__icons: span
|
|
||||||
.u-padding-small.u-text-label.u-text-center=label
|
|
||||||
|
|
||||||
+code.x-terminal__code
|
|
||||||
block
|
|
||||||
|
|
||||||
//- Chart.js
|
|
||||||
id - [string] chart ID, will be assigned as #chart_{id}
|
|
||||||
|
|
||||||
mixin chart(id, height)
|
|
||||||
figure.o-block&attributes(attributes)
|
|
||||||
canvas(id="chart_#{id}" width="800" height=(height || "400") style="max-width: 100%")
|
|
||||||
|
|
||||||
|
|
||||||
//- Gitter chat button and widget
|
|
||||||
button - [string] text shown on button
|
|
||||||
label - [string] title of chat window (default: same as button)
|
|
||||||
|
|
||||||
mixin gitter(button, label)
|
|
||||||
aside.js-gitter.c-chat.is-collapsed(data-title=(label || button))
|
|
||||||
|
|
||||||
button.js-gitter-button.c-chat__button.u-text-tag
|
|
||||||
+icon("chat", 16).o-icon--inline
|
|
||||||
!=button
|
|
||||||
|
|
||||||
|
|
||||||
//- Badge
|
|
||||||
image - [string] path to badge image
|
|
||||||
url - [string] badge link
|
|
||||||
|
|
||||||
mixin badge(image, url)
|
|
||||||
+a(url).u-padding-small.u-hide-link&attributes(attributes)
|
|
||||||
img.o-badge(src=image alt=url height="20")
|
|
||||||
|
|
||||||
|
|
||||||
//- spaCy logo
|
|
||||||
|
|
||||||
mixin logo()
|
|
||||||
+svg("spacy", 675, 215).o-logo&attributes(attributes)
|
|
||||||
|
|
||||||
|
|
||||||
//- Landing
|
|
||||||
|
|
||||||
mixin landing-header()
|
|
||||||
header.c-landing
|
|
||||||
.c-landing__wrapper
|
|
||||||
.c-landing__content
|
|
||||||
block
|
|
||||||
|
|
||||||
mixin landing-banner(headline, label)
|
|
||||||
.c-landing__banner.u-padding.o-block.u-color-light
|
|
||||||
+grid.c-landing__banner__content.o-no-block
|
|
||||||
+grid-col("third")
|
|
||||||
h3.u-heading.u-heading-1
|
|
||||||
if label
|
|
||||||
div
|
|
||||||
span.u-text-label.u-text-label--light=label
|
|
||||||
!=headline
|
|
||||||
|
|
||||||
+grid-col("two-thirds").c-landing__banner__text
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
mixin landing-logos(title, logos)
|
|
||||||
.o-content.u-text-center&attributes(attributes)
|
|
||||||
h3.u-heading.u-text-label.u-color-dark=title
|
|
||||||
|
|
||||||
each row, i in logos
|
|
||||||
- var is_last = i == logos.length - 1
|
|
||||||
+grid("center").o-inline-list.o-no-block(class=is_last ? "o-no-block" : null)
|
|
||||||
each details, name in row
|
|
||||||
+a(details[0]).u-padding-medium
|
|
||||||
+icon(name, details[1], details[2])
|
|
||||||
|
|
||||||
if is_last
|
|
||||||
block
|
|
||||||
|
|
||||||
|
|
||||||
//- Under construction (temporary)
|
|
||||||
Marks sections that still need to be completed for the v2.0 release.
|
|
||||||
|
|
||||||
mixin under-construction()
|
|
||||||
+infobox("Under construction", "🚧")
|
|
||||||
| This section is still being written and will be updated for the v2.0
|
|
||||||
| release. Is there anything that you think should definitely mentioned or
|
|
||||||
| explained here? Any examples you'd like to see? #[strong Let us know]
|
|
||||||
| on the #[+a(gh("spacy") + "/issues/1105") v2.0 alpha thread] on GitHub!
|
|
||||||
|
|
||||||
|
|
||||||
//- Alpha infobox (temporary)
|
|
||||||
Added in the templates to notify user that they're visiting the alpha site.
|
|
||||||
|
|
||||||
mixin alpha-info()
|
|
||||||
+infobox("You are viewing the spaCy v2.0.0 alpha docs", "⚠️")
|
|
||||||
strong This page is part of the alpha documentation for spaCy v2.0.
|
|
||||||
| It does not reflect the state of the latest stable release.
|
|
||||||
| Because v2.0 is still under development, the implementation
|
|
||||||
| may differ from the intended state described here. See the
|
|
||||||
| #[+a(gh("spaCy") + "/releases/tag/v2.0.0-alpha") release notes]
|
|
||||||
| for details on how to install and test the new version. To
|
|
||||||
| read the official docs for spaCy v1.x,
|
|
||||||
| #[+a("https://spacy.io/docs") go here].
|
|
||||||
|
|
@ -1,7 +1,39 @@
|
||||||
//- 💫 INCLUDES > MIXINS
|
//- 💫 INCLUDES > MIXINS
|
||||||
|
|
||||||
include _functions
|
include _functions
|
||||||
include _mixins-base
|
|
||||||
|
|
||||||
|
//- Section
|
||||||
|
id - [string] anchor assigned to section (used for breadcrumb navigation)
|
||||||
|
|
||||||
|
mixin section(id)
|
||||||
|
section.o-section(id="section-" + id data-section=id)
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
|
//- Headlines Helper Mixin
|
||||||
|
level - [integer] 1, 2, 3, 4, or 5
|
||||||
|
|
||||||
|
mixin headline(level)
|
||||||
|
if level == 1
|
||||||
|
h1.u-heading-1&attributes(attributes)
|
||||||
|
block
|
||||||
|
|
||||||
|
else if level == 2
|
||||||
|
h2.u-heading-2&attributes(attributes)
|
||||||
|
block
|
||||||
|
|
||||||
|
else if level == 3
|
||||||
|
h3.u-heading-3&attributes(attributes)
|
||||||
|
block
|
||||||
|
|
||||||
|
else if level == 4
|
||||||
|
h4.u-heading-4&attributes(attributes)
|
||||||
|
block
|
||||||
|
|
||||||
|
else if level == 5
|
||||||
|
h5.u-heading-5&attributes(attributes)
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
//- Headlines
|
//- Headlines
|
||||||
|
|
@ -18,6 +50,18 @@ mixin h(level, id, source)
|
||||||
span Source #[+icon("code", 14).o-icon--inline]
|
span Source #[+icon("code", 14).o-icon--inline]
|
||||||
|
|
||||||
|
|
||||||
|
//- Permalink rendering
|
||||||
|
id - [string] permalink ID used for link anchor
|
||||||
|
|
||||||
|
mixin permalink(id)
|
||||||
|
if id
|
||||||
|
a.u-permalink(href="##{id}")
|
||||||
|
block
|
||||||
|
|
||||||
|
else
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
//- External links
|
//- External links
|
||||||
url - [string] link href
|
url - [string] link href
|
||||||
trusted - [boolean] if not set / false, rel="noopener nofollow" is added
|
trusted - [boolean] if not set / false, rel="noopener nofollow" is added
|
||||||
|
|
@ -63,6 +107,18 @@ mixin help(tooltip, icon_size)
|
||||||
+icon("help_o", icon_size || 16).o-icon--inline
|
+icon("help_o", icon_size || 16).o-icon--inline
|
||||||
|
|
||||||
|
|
||||||
|
//- Aside wrapper
|
||||||
|
label - [string] aside label
|
||||||
|
|
||||||
|
mixin aside-wrapper(label)
|
||||||
|
aside.c-aside
|
||||||
|
.c-aside__content(role="complementary")&attributes(attributes)
|
||||||
|
if label
|
||||||
|
h4.u-text-label.u-text-label--dark=label
|
||||||
|
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
//- Aside for text
|
//- Aside for text
|
||||||
label - [string] aside title (optional)
|
label - [string] aside title (optional)
|
||||||
|
|
||||||
|
|
@ -112,6 +168,37 @@ mixin infobox-logos(...logos)
|
||||||
| #[+icon(logo[0], logo[1], logo[2]).u-color-dark]
|
| #[+icon(logo[0], logo[1], logo[2]).u-color-dark]
|
||||||
|
|
||||||
|
|
||||||
|
//- SVG from map (uses embedded SVG sprite)
|
||||||
|
name - [string] SVG symbol id
|
||||||
|
width - [integer] width in px
|
||||||
|
height - [integer] height in px (default: same as width)
|
||||||
|
|
||||||
|
mixin svg(name, width, height)
|
||||||
|
svg(aria-hidden="true" viewBox="0 0 #{width} #{height || width}" width=width height=(height || width))&attributes(attributes)
|
||||||
|
use(xlink:href="#svg_#{name}")
|
||||||
|
|
||||||
|
|
||||||
|
//- Icon
|
||||||
|
name - [string] icon name (will be used as symbol id: #svg_{name})
|
||||||
|
width - [integer] icon width (default: 20)
|
||||||
|
height - [integer] icon height (defaults to width)
|
||||||
|
|
||||||
|
mixin icon(name, width, height)
|
||||||
|
- var width = width || 20
|
||||||
|
- var height = height || width
|
||||||
|
+svg(name, width, height).o-icon(style="min-width: #{width}px")&attributes(attributes)
|
||||||
|
|
||||||
|
|
||||||
|
//- Pro/Con/Neutral icon
|
||||||
|
icon - [string] "pro", "con" or "neutral" (default: "neutral")
|
||||||
|
size - [integer] icon size (optional)
|
||||||
|
|
||||||
|
mixin procon(icon, label, show_label, size)
|
||||||
|
- var colors = { yes: "green", no: "red", neutral: "subtle" }
|
||||||
|
span.u-nowrap
|
||||||
|
+icon(icon, size || 20)(class="u-color-#{colors[icon] || 'subtle'}").o-icon--inline&attributes(attributes)
|
||||||
|
span.u-text-small(class=show_label ? null : "u-hidden")=(label || icon)
|
||||||
|
|
||||||
|
|
||||||
//- Link button
|
//- Link button
|
||||||
url - [string] link href
|
url - [string] link href
|
||||||
|
|
@ -238,6 +325,14 @@ mixin graphic(original)
|
||||||
+button(original, false, "secondary", "small") View large graphic
|
+button(original, false, "secondary", "small") View large graphic
|
||||||
|
|
||||||
|
|
||||||
|
//- Chart.js
|
||||||
|
id - [string] chart ID, will be assigned as #chart_{id}
|
||||||
|
|
||||||
|
mixin chart(id, height)
|
||||||
|
figure.o-block&attributes(attributes)
|
||||||
|
canvas(id="chart_#{id}" width="800" height=(height || "400") style="max-width: 100%")
|
||||||
|
|
||||||
|
|
||||||
//- Labels
|
//- Labels
|
||||||
|
|
||||||
mixin label()
|
mixin label()
|
||||||
|
|
@ -445,3 +540,137 @@ mixin annotation-row(annots, style)
|
||||||
else
|
else
|
||||||
+cell=cell
|
+cell=cell
|
||||||
block
|
block
|
||||||
|
|
||||||
|
|
||||||
|
//- spaCy logo
|
||||||
|
|
||||||
|
mixin logo()
|
||||||
|
+svg("spacy", 675, 215).o-logo&attributes(attributes)
|
||||||
|
|
||||||
|
|
||||||
|
//- Gitter chat button and widget
|
||||||
|
button - [string] text shown on button
|
||||||
|
label - [string] title of chat window (default: same as button)
|
||||||
|
|
||||||
|
mixin gitter(button, label)
|
||||||
|
aside.js-gitter.c-chat.is-collapsed(data-title=(label || button))
|
||||||
|
|
||||||
|
button.js-gitter-button.c-chat__button.u-text-tag
|
||||||
|
+icon("chat", 16).o-icon--inline
|
||||||
|
!=button
|
||||||
|
|
||||||
|
|
||||||
|
//- Badge
|
||||||
|
image - [string] path to badge image
|
||||||
|
url - [string] badge link
|
||||||
|
|
||||||
|
mixin badge(image, url)
|
||||||
|
+a(url).u-padding-small.u-hide-link&attributes(attributes)
|
||||||
|
img.o-badge(src=image alt=url height="20")
|
||||||
|
|
||||||
|
|
||||||
|
//- Quickstart widget
|
||||||
|
quickstart.js with manual markup, inspired by PyTorch's "Getting started"
|
||||||
|
groups - [object] option groups, uses global variable QUICKSTART
|
||||||
|
headline - [string] optional text to be rendered as widget headline
|
||||||
|
|
||||||
|
mixin quickstart(groups, headline, description, hide_results)
|
||||||
|
.c-quickstart.o-block-small#qs
|
||||||
|
.c-quickstart__content
|
||||||
|
if headline
|
||||||
|
+h(2)=headline
|
||||||
|
if description
|
||||||
|
p=description
|
||||||
|
for group in groups
|
||||||
|
.c-quickstart__group.u-text-small(data-qs-group=group.id)
|
||||||
|
if group.title
|
||||||
|
.c-quickstart__legend=group.title
|
||||||
|
if group.help
|
||||||
|
| #[+help(group.help)]
|
||||||
|
.c-quickstart__fields
|
||||||
|
for option in group.options
|
||||||
|
input.c-quickstart__input(class="c-quickstart__input--" + (group.input_style ? group.input_style : group.multiple ? "check" : "radio") type=group.multiple ? "checkbox" : "radio" name=group.id id="qs-#{option.id}" value=option.id checked=option.checked)
|
||||||
|
label.c-quickstart__label.u-text-tiny(for="qs-#{option.id}")!=option.title
|
||||||
|
if option.meta
|
||||||
|
| #[span.c-quickstart__label__meta (#{option.meta})]
|
||||||
|
if option.help
|
||||||
|
| #[+help(option.help)]
|
||||||
|
|
||||||
|
if hide_results
|
||||||
|
block
|
||||||
|
else
|
||||||
|
pre.c-code-block
|
||||||
|
code.c-code-block__content.c-quickstart__code(data-qs-results="")
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
|
//- Quickstart code item
|
||||||
|
data - [object] Rendering conditions (keyed by option group ID, value: option)
|
||||||
|
style - [string] modifier ID for line style
|
||||||
|
|
||||||
|
mixin qs(data, style)
|
||||||
|
- args = {}
|
||||||
|
for value, setting in data
|
||||||
|
- args['data-qs-' + setting] = value
|
||||||
|
span.c-quickstart__line(class="c-quickstart__line--#{style || 'bash'}")&attributes(args)
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
|
//- Terminal-style code window
|
||||||
|
label - [string] title displayed in top bar of terminal window
|
||||||
|
|
||||||
|
mixin terminal(label)
|
||||||
|
.x-terminal
|
||||||
|
.x-terminal__icons: span
|
||||||
|
.u-padding-small.u-text-label.u-text-center=label
|
||||||
|
|
||||||
|
+code.x-terminal__code
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
|
//- Landing
|
||||||
|
|
||||||
|
mixin landing-header()
|
||||||
|
header.c-landing
|
||||||
|
.c-landing__wrapper
|
||||||
|
.c-landing__content
|
||||||
|
block
|
||||||
|
|
||||||
|
mixin landing-banner(headline, label)
|
||||||
|
.c-landing__banner.u-padding.o-block.u-color-light
|
||||||
|
+grid.c-landing__banner__content.o-no-block
|
||||||
|
+grid-col("third")
|
||||||
|
h3.u-heading.u-heading-1
|
||||||
|
if label
|
||||||
|
div
|
||||||
|
span.u-text-label.u-text-label--light=label
|
||||||
|
!=headline
|
||||||
|
|
||||||
|
+grid-col("two-thirds").c-landing__banner__text
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
|
mixin landing-logos(title, logos)
|
||||||
|
.o-content.u-text-center&attributes(attributes)
|
||||||
|
h3.u-heading.u-text-label.u-color-dark=title
|
||||||
|
|
||||||
|
each row, i in logos
|
||||||
|
- var is_last = i == logos.length - 1
|
||||||
|
+grid("center").o-inline-list.o-no-block(class=is_last ? "o-no-block" : null)
|
||||||
|
each details, name in row
|
||||||
|
+a(details[0]).u-padding-medium
|
||||||
|
+icon(name, details[1], details[2])
|
||||||
|
|
||||||
|
if is_last
|
||||||
|
block
|
||||||
|
|
||||||
|
|
||||||
|
//- Under construction (temporary)
|
||||||
|
Marks sections that still need to be completed for the v2.0 release.
|
||||||
|
|
||||||
|
mixin under-construction()
|
||||||
|
+infobox("Under construction", "🚧")
|
||||||
|
| This section is still being written and will be updated for the v2.0
|
||||||
|
| release. Is there anything that you think should definitely mentioned or
|
||||||
|
| explained here? Any examples you'd like to see? #[strong Let us know]
|
||||||
|
| on the #[+a(gh("spacy") + "/issues/1105") v2.0 alpha thread] on GitHub!
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user