aboutsummaryrefslogtreecommitdiffstats
path: root/docs/src/assets
diff options
context:
space:
mode:
Diffstat (limited to 'docs/src/assets')
-rw-r--r--docs/src/assets/badge.scss18
-rw-r--r--docs/src/assets/bulma/base/_all.sass5
-rw-r--r--docs/src/assets/bulma/base/generic.sass142
-rw-r--r--docs/src/assets/bulma/base/helpers.sass281
-rw-r--r--docs/src/assets/bulma/base/minireset.sass79
-rw-r--r--docs/src/assets/bulma/components/_all.sass15
-rw-r--r--docs/src/assets/bulma/components/breadcrumb.sass75
-rw-r--r--docs/src/assets/bulma/components/card.sass79
-rw-r--r--docs/src/assets/bulma/components/dropdown.sass81
-rw-r--r--docs/src/assets/bulma/components/level.sass77
-rw-r--r--docs/src/assets/bulma/components/list.sass39
-rw-r--r--docs/src/assets/bulma/components/media.sass50
-rw-r--r--docs/src/assets/bulma/components/menu.sass57
-rw-r--r--docs/src/assets/bulma/components/message.sass99
-rw-r--r--docs/src/assets/bulma/components/modal.sass113
-rw-r--r--docs/src/assets/bulma/components/navbar.sass443
-rw-r--r--docs/src/assets/bulma/components/pagination.sass150
-rw-r--r--docs/src/assets/bulma/components/panel.sass119
-rw-r--r--docs/src/assets/bulma/components/tabs.sass151
-rw-r--r--docs/src/assets/bulma/elements/_all.sass15
-rw-r--r--docs/src/assets/bulma/elements/box.sass24
-rw-r--r--docs/src/assets/bulma/elements/button.sass323
-rw-r--r--docs/src/assets/bulma/elements/container.sass24
-rw-r--r--docs/src/assets/bulma/elements/content.sass155
-rw-r--r--docs/src/assets/bulma/elements/form.sass1
-rw-r--r--docs/src/assets/bulma/elements/icon.sass21
-rw-r--r--docs/src/assets/bulma/elements/image.sass71
-rw-r--r--docs/src/assets/bulma/elements/notification.sass43
-rw-r--r--docs/src/assets/bulma/elements/other.sass39
-rw-r--r--docs/src/assets/bulma/elements/progress.sass67
-rw-r--r--docs/src/assets/bulma/elements/table.sass127
-rw-r--r--docs/src/assets/bulma/elements/tag.sass128
-rw-r--r--docs/src/assets/bulma/elements/title.sass70
-rw-r--r--docs/src/assets/bulma/form/_all.sass8
-rw-r--r--docs/src/assets/bulma/form/checkbox-radio.sass21
-rw-r--r--docs/src/assets/bulma/form/file.sass180
-rw-r--r--docs/src/assets/bulma/form/input-textarea.sass64
-rw-r--r--docs/src/assets/bulma/form/select.sass85
-rw-r--r--docs/src/assets/bulma/form/shared.sass55
-rw-r--r--docs/src/assets/bulma/form/tools.sass205
-rw-r--r--docs/src/assets/bulma/grid/_all.sass4
-rw-r--r--docs/src/assets/bulma/grid/columns.sass504
-rw-r--r--docs/src/assets/bulma/grid/tiles.sass34
-rw-r--r--docs/src/assets/bulma/layout/_all.sass5
-rw-r--r--docs/src/assets/bulma/layout/footer.sass9
-rw-r--r--docs/src/assets/bulma/layout/hero.sass144
-rw-r--r--docs/src/assets/bulma/layout/section.sass13
-rw-r--r--docs/src/assets/bulma/utilities/_all.sass8
-rw-r--r--docs/src/assets/bulma/utilities/animations.sass5
-rw-r--r--docs/src/assets/bulma/utilities/controls.sass50
-rw-r--r--docs/src/assets/bulma/utilities/derived-variables.sass106
-rw-r--r--docs/src/assets/bulma/utilities/functions.sass103
-rw-r--r--docs/src/assets/bulma/utilities/initial-variables.sass77
-rw-r--r--docs/src/assets/bulma/utilities/mixins.sass261
-rw-r--r--docs/src/assets/fa/_animated.scss20
-rw-r--r--docs/src/assets/fa/_bordered-pulled.scss20
-rw-r--r--docs/src/assets/fa/_core.scss16
-rw-r--r--docs/src/assets/fa/_fixed-width.scss6
-rw-r--r--docs/src/assets/fa/_icons.scss792
-rw-r--r--docs/src/assets/fa/_larger.scss23
-rw-r--r--docs/src/assets/fa/_list.scss18
-rw-r--r--docs/src/assets/fa/_mixins.scss57
-rw-r--r--docs/src/assets/fa/_rotated-flipped.scss23
-rw-r--r--docs/src/assets/fa/_screen-reader.scss5
-rw-r--r--docs/src/assets/fa/_stacked.scss31
-rw-r--r--docs/src/assets/fa/_variables.scss805
-rw-r--r--docs/src/assets/fa/fa-brands.scss21
-rw-r--r--docs/src/assets/fa/fa-regular.scss22
-rw-r--r--docs/src/assets/fa/fa-solid.scss23
-rw-r--r--docs/src/assets/fa/fontawesome.scss16
-rw-r--r--docs/src/assets/style.scss93
-rw-r--r--docs/src/assets/syntax.css59
72 files changed, 7172 insertions, 0 deletions
diff --git a/docs/src/assets/badge.scss b/docs/src/assets/badge.scss
new file mode 100644
index 00000000..8082f6c7
--- /dev/null
+++ b/docs/src/assets/badge.scss
@@ -0,0 +1,18 @@
+.badge {
+ color: #fff;
+ background-color: #6c757d;
+ display: inline-block;
+ padding: .25em .4em;
+ font-size: 75%;
+ font-weight: 1;
+ line-height: 1;
+ text-align: center;
+ white-space: nowrap;
+ vertical-align: baseline;
+ border-radius: 0.25rem;
+
+ // Empty badges collapse automatically
+ &:empty {
+ display: none;
+ }
+}
diff --git a/docs/src/assets/bulma/base/_all.sass b/docs/src/assets/bulma/base/_all.sass
new file mode 100644
index 00000000..e913d6ba
--- /dev/null
+++ b/docs/src/assets/bulma/base/_all.sass
@@ -0,0 +1,5 @@
+@charset "utf-8"
+
+@import "minireset.sass"
+@import "generic.sass"
+@import "helpers.sass"
diff --git a/docs/src/assets/bulma/base/generic.sass b/docs/src/assets/bulma/base/generic.sass
new file mode 100644
index 00000000..31eedfe9
--- /dev/null
+++ b/docs/src/assets/bulma/base/generic.sass
@@ -0,0 +1,142 @@
+$body-background-color: $scheme-main !default
+$body-size: 16px !default
+$body-min-width: 300px !default
+$body-rendering: optimizeLegibility !default
+$body-family: $family-primary !default
+$body-overflow-x: hidden !default
+$body-overflow-y: scroll !default
+
+$body-color: $text !default
+$body-font-size: 1em !default
+$body-weight: $weight-normal !default
+$body-line-height: 1.5 !default
+
+$code-family: $family-code !default
+$code-padding: 0.25em 0.5em 0.25em !default
+$code-weight: normal !default
+$code-size: 0.875em !default
+
+$small-font-size: 0.875em !default
+
+$hr-background-color: $background !default
+$hr-height: 2px !default
+$hr-margin: 1.5rem 0 !default
+
+$strong-color: $text-strong !default
+$strong-weight: $weight-bold !default
+
+$pre-font-size: 0.875em !default
+$pre-padding: 1.25rem 1.5rem !default
+$pre-code-font-size: 1em !default
+
+html
+ background-color: $body-background-color
+ font-size: $body-size
+ -moz-osx-font-smoothing: grayscale
+ -webkit-font-smoothing: antialiased
+ min-width: $body-min-width
+ overflow-x: $body-overflow-x
+ overflow-y: $body-overflow-y
+ text-rendering: $body-rendering
+ text-size-adjust: 100%
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section
+ display: block
+
+body,
+button,
+input,
+select,
+textarea
+ font-family: $body-family
+
+code,
+pre
+ -moz-osx-font-smoothing: auto
+ -webkit-font-smoothing: auto
+ font-family: $code-family
+
+body
+ color: $body-color
+ font-size: $body-font-size
+ font-weight: $body-weight
+ line-height: $body-line-height
+
+// Inline
+
+a
+ color: $link
+ cursor: pointer
+ text-decoration: none
+ strong
+ color: currentColor
+ &:hover
+ color: $link-hover
+
+code
+ background-color: $code-background
+ color: $code
+ font-size: $code-size
+ font-weight: $code-weight
+ padding: $code-padding
+
+hr
+ background-color: $hr-background-color
+ border: none
+ display: block
+ height: $hr-height
+ margin: $hr-margin
+
+img
+ height: auto
+ max-width: 100%
+
+input[type="checkbox"],
+input[type="radio"]
+ vertical-align: baseline
+
+small
+ font-size: $small-font-size
+
+span
+ font-style: inherit
+ font-weight: inherit
+
+strong
+ color: $strong-color
+ font-weight: $strong-weight
+
+// Block
+
+fieldset
+ border: none
+
+pre
+ +overflow-touch
+ background-color: $pre-background
+ color: $pre
+ font-size: $pre-font-size
+ overflow-x: auto
+ padding: $pre-padding
+ white-space: pre
+ word-wrap: normal
+ code
+ background-color: transparent
+ color: currentColor
+ font-size: $pre-code-font-size
+ padding: 0
+
+table
+ td,
+ th
+ vertical-align: top
+ &:not([align])
+ text-align: left
+ th
+ color: $text-strong
diff --git a/docs/src/assets/bulma/base/helpers.sass b/docs/src/assets/bulma/base/helpers.sass
new file mode 100644
index 00000000..bbb489dd
--- /dev/null
+++ b/docs/src/assets/bulma/base/helpers.sass
@@ -0,0 +1,281 @@
+// Float
+
+.is-clearfix
+ +clearfix
+
+.is-pulled-left
+ float: left !important
+
+.is-pulled-right
+ float: right !important
+
+// Overflow
+
+.is-clipped
+ overflow: hidden !important
+
+// Overlay
+
+.is-overlay
+ @extend %overlay
+
+// Typography
+
+=typography-size($target:'')
+ @each $size in $sizes
+ $i: index($sizes, $size)
+ .is-size-#{$i}#{if($target == '', '', '-' + $target)}
+ font-size: $size !important
+
++typography-size()
+
++mobile
+ +typography-size('mobile')
+
++tablet
+ +typography-size('tablet')
+
++touch
+ +typography-size('touch')
+
++desktop
+ +typography-size('desktop')
+
++widescreen
+ +typography-size('widescreen')
+
++fullhd
+ +typography-size('fullhd')
+
+$alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'right': 'right')
+
+@each $alignment, $text-align in $alignments
+ .has-text-#{$alignment}
+ text-align: #{$text-align} !important
+
+@each $alignment, $text-align in $alignments
+ +mobile
+ .has-text-#{$alignment}-mobile
+ text-align: #{$text-align} !important
+ +tablet
+ .has-text-#{$alignment}-tablet
+ text-align: #{$text-align} !important
+ +tablet-only
+ .has-text-#{$alignment}-tablet-only
+ text-align: #{$text-align} !important
+ +touch
+ .has-text-#{$alignment}-touch
+ text-align: #{$text-align} !important
+ +desktop
+ .has-text-#{$alignment}-desktop
+ text-align: #{$text-align} !important
+ +desktop-only
+ .has-text-#{$alignment}-desktop-only
+ text-align: #{$text-align} !important
+ +widescreen
+ .has-text-#{$alignment}-widescreen
+ text-align: #{$text-align} !important
+ +widescreen-only
+ .has-text-#{$alignment}-widescreen-only
+ text-align: #{$text-align} !important
+ +fullhd
+ .has-text-#{$alignment}-fullhd
+ text-align: #{$text-align} !important
+
+.is-capitalized
+ text-transform: capitalize !important
+
+.is-lowercase
+ text-transform: lowercase !important
+
+.is-uppercase
+ text-transform: uppercase !important
+
+.is-italic
+ font-style: italic !important
+
+@each $name, $pair in $colors
+ $color: nth($pair, 1)
+ .has-text-#{$name}
+ color: $color !important
+ a.has-text-#{$name}
+ &:hover,
+ &:focus
+ color: darken($color, 10%) !important
+ .has-background-#{$name}
+ background-color: $color !important
+
+@each $name, $shade in $shades
+ .has-text-#{$name}
+ color: $shade !important
+ .has-background-#{$name}
+ background-color: $shade !important
+
+.has-text-weight-light
+ font-weight: $weight-light !important
+.has-text-weight-normal
+ font-weight: $weight-normal !important
+.has-text-weight-medium
+ font-weight: $weight-medium !important
+.has-text-weight-semibold
+ font-weight: $weight-semibold !important
+.has-text-weight-bold
+ font-weight: $weight-bold !important
+
+.is-family-primary
+ font-family: $family-primary !important
+
+.is-family-secondary
+ font-family: $family-secondary !important
+
+.is-family-sans-serif
+ font-family: $family-sans-serif !important
+
+.is-family-monospace
+ font-family: $family-monospace !important
+
+.is-family-code
+ font-family: $family-code !important
+
+// Visibility
+
+$displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
+
+@each $display in $displays
+ .is-#{$display}
+ display: #{$display} !important
+ +mobile
+ .is-#{$display}-mobile
+ display: #{$display} !important
+ +tablet
+ .is-#{$display}-tablet
+ display: #{$display} !important
+ +tablet-only
+ .is-#{$display}-tablet-only
+ display: #{$display} !important
+ +touch
+ .is-#{$display}-touch
+ display: #{$display} !important
+ +desktop
+ .is-#{$display}-desktop
+ display: #{$display} !important
+ +desktop-only
+ .is-#{$display}-desktop-only
+ display: #{$display} !important
+ +widescreen
+ .is-#{$display}-widescreen
+ display: #{$display} !important
+ +widescreen-only
+ .is-#{$display}-widescreen-only
+ display: #{$display} !important
+ +fullhd
+ .is-#{$display}-fullhd
+ display: #{$display} !important
+
+.is-hidden
+ display: none !important
+
+.is-sr-only
+ border: none !important
+ clip: rect(0, 0, 0, 0) !important
+ height: 0.01em !important
+ overflow: hidden !important
+ padding: 0 !important
+ position: absolute !important
+ white-space: nowrap !important
+ width: 0.01em !important
+
++mobile
+ .is-hidden-mobile
+ display: none !important
+
++tablet
+ .is-hidden-tablet
+ display: none !important
+
++tablet-only
+ .is-hidden-tablet-only
+ display: none !important
+
++touch
+ .is-hidden-touch
+ display: none !important
+
++desktop
+ .is-hidden-desktop
+ display: none !important
+
++desktop-only
+ .is-hidden-desktop-only
+ display: none !important
+
++widescreen
+ .is-hidden-widescreen
+ display: none !important
+
++widescreen-only
+ .is-hidden-widescreen-only
+ display: none !important
+
++fullhd
+ .is-hidden-fullhd
+ display: none !important
+
+.is-invisible
+ visibility: hidden !important
+
++mobile
+ .is-invisible-mobile
+ visibility: hidden !important
+
++tablet
+ .is-invisible-tablet
+ visibility: hidden !important
+
++tablet-only
+ .is-invisible-tablet-only
+ visibility: hidden !important
+
++touch
+ .is-invisible-touch
+ visibility: hidden !important
+
++desktop
+ .is-invisible-desktop
+ visibility: hidden !important
+
++desktop-only
+ .is-invisible-desktop-only
+ visibility: hidden !important
+
++widescreen
+ .is-invisible-widescreen
+ visibility: hidden !important
+
++widescreen-only
+ .is-invisible-widescreen-only
+ visibility: hidden !important
+
++fullhd
+ .is-invisible-fullhd
+ visibility: hidden !important
+
+// Other
+
+.is-marginless
+ margin: 0 !important
+
+.is-paddingless
+ padding: 0 !important
+
+.is-radiusless
+ border-radius: 0 !important
+
+.is-shadowless
+ box-shadow: none !important
+
+.is-unselectable
+ @extend %unselectable
+
+.is-relative
+ position: relative !important
diff --git a/docs/src/assets/bulma/base/minireset.sass b/docs/src/assets/bulma/base/minireset.sass
new file mode 100644
index 00000000..c5657ebd
--- /dev/null
+++ b/docs/src/assets/bulma/base/minireset.sass
@@ -0,0 +1,79 @@
+/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
+// Blocks
+html,
+body,
+p,
+ol,
+ul,
+li,
+dl,
+dt,
+dd,
+blockquote,
+figure,
+fieldset,
+legend,
+textarea,
+pre,
+iframe,
+hr,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6
+ margin: 0
+ padding: 0
+
+// Headings
+h1,
+h2,
+h3,
+h4,
+h5,
+h6
+ font-size: 100%
+ font-weight: normal
+
+// List
+ul
+ list-style: none
+
+// Form
+button,
+input,
+select,
+textarea
+ margin: 0
+
+// Box sizing
+html
+ box-sizing: border-box
+
+*
+ &,
+ &::before,
+ &::after
+ box-sizing: inherit
+
+// Media
+img,
+video
+ height: auto
+ max-width: 100%
+
+// Iframe
+iframe
+ border: 0
+
+// Table
+table
+ border-collapse: collapse
+ border-spacing: 0
+
+td,
+th
+ padding: 0
+ &:not([align])
+ text-align: left
diff --git a/docs/src/assets/bulma/components/_all.sass b/docs/src/assets/bulma/components/_all.sass
new file mode 100644
index 00000000..88fd45c5
--- /dev/null
+++ b/docs/src/assets/bulma/components/_all.sass
@@ -0,0 +1,15 @@
+@charset "utf-8"
+
+@import "breadcrumb.sass"
+@import "card.sass"
+@import "dropdown.sass"
+@import "level.sass"
+@import "list.sass"
+@import "media.sass"
+@import "menu.sass"
+@import "message.sass"
+@import "modal.sass"
+@import "navbar.sass"
+@import "pagination.sass"
+@import "panel.sass"
+@import "tabs.sass"
diff --git a/docs/src/assets/bulma/components/breadcrumb.sass b/docs/src/assets/bulma/components/breadcrumb.sass
new file mode 100644
index 00000000..3d7f4eb3
--- /dev/null
+++ b/docs/src/assets/bulma/components/breadcrumb.sass
@@ -0,0 +1,75 @@
+$breadcrumb-item-color: $link !default
+$breadcrumb-item-hover-color: $link-hover !default
+$breadcrumb-item-active-color: $text-strong !default
+
+$breadcrumb-item-padding-vertical: 0 !default
+$breadcrumb-item-padding-horizontal: 0.75em !default
+
+$breadcrumb-item-separator-color: $border-hover !default
+
+.breadcrumb
+ @extend %block
+ @extend %unselectable
+ font-size: $size-normal
+ white-space: nowrap
+ a
+ align-items: center
+ color: $breadcrumb-item-color
+ display: flex
+ justify-content: center
+ padding: $breadcrumb-item-padding-vertical $breadcrumb-item-padding-horizontal
+ &:hover
+ color: $breadcrumb-item-hover-color
+ li
+ align-items: center
+ display: flex
+ &:first-child a
+ padding-left: 0
+ &.is-active
+ a
+ color: $breadcrumb-item-active-color
+ cursor: default
+ pointer-events: none
+ & + li::before
+ color: $breadcrumb-item-separator-color
+ content: "\0002f"
+ ul,
+ ol
+ align-items: flex-start
+ display: flex
+ flex-wrap: wrap
+ justify-content: flex-start
+ .icon
+ &:first-child
+ margin-right: 0.5em
+ &:last-child
+ margin-left: 0.5em
+ // Alignment
+ &.is-centered
+ ol,
+ ul
+ justify-content: center
+ &.is-right
+ ol,
+ ul
+ justify-content: flex-end
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
+ // Styles
+ &.has-arrow-separator
+ li + li::before
+ content: "\02192"
+ &.has-bullet-separator
+ li + li::before
+ content: "\02022"
+ &.has-dot-separator
+ li + li::before
+ content: "\000b7"
+ &.has-succeeds-separator
+ li + li::before
+ content: "\0227B"
diff --git a/docs/src/assets/bulma/components/card.sass b/docs/src/assets/bulma/components/card.sass
new file mode 100644
index 00000000..3cdf0008
--- /dev/null
+++ b/docs/src/assets/bulma/components/card.sass
@@ -0,0 +1,79 @@
+$card-color: $text !default
+$card-background-color: $scheme-main !default
+$card-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
+
+$card-header-background-color: transparent !default
+$card-header-color: $text-strong !default
+$card-header-padding: 0.75rem 1rem !default
+$card-header-shadow: 0 0.125em 0.25em rgba($scheme-invert, 0.1) !default
+$card-header-weight: $weight-bold !default
+
+$card-content-background-color: transparent !default
+$card-content-padding: 1.5rem !default
+
+$card-footer-background-color: transparent !default
+$card-footer-border-top: 1px solid $border-light !default
+$card-footer-padding: 0.75rem !default
+
+$card-media-margin: $block-spacing !default
+
+.card
+ background-color: $card-background-color
+ box-shadow: $card-shadow
+ color: $card-color
+ max-width: 100%
+ position: relative
+
+.card-header
+ background-color: $card-header-background-color
+ align-items: stretch
+ box-shadow: $card-header-shadow
+ display: flex
+
+.card-header-title
+ align-items: center
+ color: $card-header-color
+ display: flex
+ flex-grow: 1
+ font-weight: $card-header-weight
+ padding: $card-header-padding
+ &.is-centered
+ justify-content: center
+
+.card-header-icon
+ align-items: center
+ cursor: pointer
+ display: flex
+ justify-content: center
+ padding: $card-header-padding
+
+.card-image
+ display: block
+ position: relative
+
+.card-content
+ background-color: $card-content-background-color
+ padding: $card-content-padding
+
+.card-footer
+ background-color: $card-footer-background-color
+ border-top: $card-footer-border-top
+ align-items: stretch
+ display: flex
+
+.card-footer-item
+ align-items: center
+ display: flex
+ flex-basis: 0
+ flex-grow: 1
+ flex-shrink: 0
+ justify-content: center
+ padding: $card-footer-padding
+ &:not(:last-child)
+ border-right: $card-footer-border-top
+
+// Combinations
+
+.card
+ .media:not(:last-child)
+ margin-bottom: $card-media-margin
diff --git a/docs/src/assets/bulma/components/dropdown.sass b/docs/src/assets/bulma/components/dropdown.sass
new file mode 100644
index 00000000..d62a6d88
--- /dev/null
+++ b/docs/src/assets/bulma/components/dropdown.sass
@@ -0,0 +1,81 @@
+$dropdown-menu-min-width: 12rem !default
+
+$dropdown-content-background-color: $scheme-main !default
+$dropdown-content-arrow: $link !default
+$dropdown-content-offset: 4px !default
+$dropdown-content-padding-bottom: 0.5rem !default
+$dropdown-content-padding-top: 0.5rem !default
+$dropdown-content-radius: $radius !default
+$dropdown-content-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
+$dropdown-content-z: 20 !default
+
+$dropdown-item-color: $text !default
+$dropdown-item-hover-color: $scheme-invert !default
+$dropdown-item-hover-background-color: $background !default
+$dropdown-item-active-color: $link-invert !default
+$dropdown-item-active-background-color: $link !default
+
+$dropdown-divider-background-color: $border-light !default
+
+.dropdown
+ display: inline-flex
+ position: relative
+ vertical-align: top
+ &.is-active,
+ &.is-hoverable:hover
+ .dropdown-menu
+ display: block
+ &.is-right
+ .dropdown-menu
+ left: auto
+ right: 0
+ &.is-up
+ .dropdown-menu
+ bottom: 100%
+ padding-bottom: $dropdown-content-offset
+ padding-top: initial
+ top: auto
+
+.dropdown-menu
+ display: none
+ left: 0
+ min-width: $dropdown-menu-min-width
+ padding-top: $dropdown-content-offset
+ position: absolute
+ top: 100%
+ z-index: $dropdown-content-z
+
+.dropdown-content
+ background-color: $dropdown-content-background-color
+ border-radius: $dropdown-content-radius
+ box-shadow: $dropdown-content-shadow
+ padding-bottom: $dropdown-content-padding-bottom
+ padding-top: $dropdown-content-padding-top
+
+.dropdown-item
+ color: $dropdown-item-color
+ display: block
+ font-size: 0.875rem
+ line-height: 1.5
+ padding: 0.375rem 1rem
+ position: relative
+
+a.dropdown-item,
+button.dropdown-item
+ padding-right: 3rem
+ text-align: left
+ white-space: nowrap
+ width: 100%
+ &:hover
+ background-color: $dropdown-item-hover-background-color
+ color: $dropdown-item-hover-color
+ &.is-active
+ background-color: $dropdown-item-active-background-color
+ color: $dropdown-item-active-color
+
+.dropdown-divider
+ background-color: $dropdown-divider-background-color
+ border: none
+ display: block
+ height: 1px
+ margin: 0.5rem 0
diff --git a/docs/src/assets/bulma/components/level.sass b/docs/src/assets/bulma/components/level.sass
new file mode 100644
index 00000000..608f291e
--- /dev/null
+++ b/docs/src/assets/bulma/components/level.sass
@@ -0,0 +1,77 @@
+$level-item-spacing: ($block-spacing / 2) !default
+
+.level
+ @extend %block
+ align-items: center
+ justify-content: space-between
+ code
+ border-radius: $radius
+ img
+ display: inline-block
+ vertical-align: top
+ // Modifiers
+ &.is-mobile
+ display: flex
+ .level-left,
+ .level-right
+ display: flex
+ .level-left + .level-right
+ margin-top: 0
+ .level-item
+ &:not(:last-child)
+ margin-bottom: 0
+ margin-right: $level-item-spacing
+ &:not(.is-narrow)
+ flex-grow: 1
+ // Responsiveness
+ +tablet
+ display: flex
+ & > .level-item
+ &:not(.is-narrow)
+ flex-grow: 1
+
+.level-item
+ align-items: center
+ display: flex
+ flex-basis: auto
+ flex-grow: 0
+ flex-shrink: 0
+ justify-content: center
+ .title,
+ .subtitle
+ margin-bottom: 0
+ // Responsiveness
+ +mobile
+ &:not(:last-child)
+ margin-bottom: $level-item-spacing
+
+.level-left,
+.level-right
+ flex-basis: auto
+ flex-grow: 0
+ flex-shrink: 0
+ .level-item
+ // Modifiers
+ &.is-flexible
+ flex-grow: 1
+ // Responsiveness
+ +tablet
+ &:not(:last-child)
+ margin-right: $level-item-spacing
+
+.level-left
+ align-items: center
+ justify-content: flex-start
+ // Responsiveness
+ +mobile
+ & + .level-right
+ margin-top: 1.5rem
+ +tablet
+ display: flex
+
+.level-right
+ align-items: center
+ justify-content: flex-end
+ // Responsiveness
+ +tablet
+ display: flex
diff --git a/docs/src/assets/bulma/components/list.sass b/docs/src/assets/bulma/components/list.sass
new file mode 100644
index 00000000..bc99428a
--- /dev/null
+++ b/docs/src/assets/bulma/components/list.sass
@@ -0,0 +1,39 @@
+$list-background-color: $scheme-main !default
+$list-shadow: 0 2px 3px rgba($scheme-invert, 0.1), 0 0 0 1px rgba($scheme-invert, 0.1) !default
+$list-radius: $radius !default
+
+$list-item-border: 1px solid $border !default
+$list-item-color: $text !default
+$list-item-active-background-color: $link !default
+$list-item-active-color: $link-invert !default
+$list-item-hover-background-color: $background !default
+
+.list
+ @extend %block
+ background-color: $list-background-color
+ border-radius: $list-radius
+ box-shadow: $list-shadow
+ // &.is-hoverable > .list-item:hover:not(.is-active)
+ // background-color: $list-item-hover-background-color
+ // cursor: pointer
+
+.list-item
+ display: block
+ padding: 0.5em 1em
+ &:not(a)
+ color: $list-item-color
+ &:first-child
+ border-top-left-radius: $list-radius
+ border-top-right-radius: $list-radius
+ &:last-child
+ border-bottom-left-radius: $list-radius
+ border-bottom-right-radius: $list-radius
+ &:not(:last-child)
+ border-bottom: $list-item-border
+ &.is-active
+ background-color: $list-item-active-background-color
+ color: $list-item-active-color
+
+a.list-item
+ background-color: $list-item-hover-background-color
+ cursor: pointer
diff --git a/docs/src/assets/bulma/components/media.sass b/docs/src/assets/bulma/components/media.sass
new file mode 100644
index 00000000..a9ad114a
--- /dev/null
+++ b/docs/src/assets/bulma/components/media.sass
@@ -0,0 +1,50 @@
+$media-border-color: bulmaRgba($border, 0.5) !default
+
+.media
+ align-items: flex-start
+ display: flex
+ text-align: left
+ .content:not(:last-child)
+ margin-bottom: 0.75rem
+ .media
+ border-top: 1px solid $media-border-color
+ display: flex
+ padding-top: 0.75rem
+ .content:not(:last-child),
+ .control:not(:last-child)
+ margin-bottom: 0.5rem
+ .media
+ padding-top: 0.5rem
+ & + .media
+ margin-top: 0.5rem
+ & + .media
+ border-top: 1px solid $media-border-color
+ margin-top: 1rem
+ padding-top: 1rem
+ // Sizes
+ &.is-large
+ & + .media
+ margin-top: 1.5rem
+ padding-top: 1.5rem
+
+.media-left,
+.media-right
+ flex-basis: auto
+ flex-grow: 0
+ flex-shrink: 0
+
+.media-left
+ margin-right: 1rem
+
+.media-right
+ margin-left: 1rem
+
+.media-content
+ flex-basis: auto
+ flex-grow: 1
+ flex-shrink: 1
+ text-align: left
+
++mobile
+ .media-content
+ overflow-x: auto
diff --git a/docs/src/assets/bulma/components/menu.sass b/docs/src/assets/bulma/components/menu.sass
new file mode 100644
index 00000000..3de7e18d
--- /dev/null
+++ b/docs/src/assets/bulma/components/menu.sass
@@ -0,0 +1,57 @@
+$menu-item-color: $text !default
+$menu-item-radius: $radius-small !default
+$menu-item-hover-color: $text-strong !default
+$menu-item-hover-background-color: $background !default
+$menu-item-active-color: $link-invert !default
+$menu-item-active-background-color: $link !default
+
+$menu-list-border-left: 1px solid $border !default
+$menu-list-line-height: 1.25 !default
+$menu-list-link-padding: 0.5em 0.75em !default
+$menu-nested-list-margin: 0.75em !default
+$menu-nested-list-padding-left: 0.75em !default
+
+$menu-label-color: $text-light !default
+$menu-label-font-size: 0.75em !default
+$menu-label-letter-spacing: 0.1em !default
+$menu-label-spacing: 1em !default
+
+.menu
+ font-size: $size-normal
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
+
+.menu-list
+ line-height: $menu-list-line-height
+ a
+ border-radius: $menu-item-radius
+ color: $menu-item-color
+ display: block
+ padding: $menu-list-link-padding
+ &:hover
+ background-color: $menu-item-hover-background-color
+ color: $menu-item-hover-color
+ // Modifiers
+ &.is-active
+ background-color: $menu-item-active-background-color
+ color: $menu-item-active-color
+ li
+ ul
+ border-left: $menu-list-border-left
+ margin: $menu-nested-list-margin
+ padding-left: $menu-nested-list-padding-left
+
+.menu-label
+ color: $menu-label-color
+ font-size: $menu-label-font-size
+ letter-spacing: $menu-label-letter-spacing
+ text-transform: uppercase
+ &:not(:first-child)
+ margin-top: $menu-label-spacing
+ &:not(:last-child)
+ margin-bottom: $menu-label-spacing
diff --git a/docs/src/assets/bulma/components/message.sass b/docs/src/assets/bulma/components/message.sass
new file mode 100644
index 00000000..89e4cc9a
--- /dev/null
+++ b/docs/src/assets/bulma/components/message.sass
@@ -0,0 +1,99 @@
+$message-background-color: $background !default
+$message-radius: $radius !default
+
+$message-header-background-color: $text !default
+$message-header-color: $text-invert !default
+$message-header-weight: $weight-bold !default
+$message-header-padding: 0.75em 1em !default
+$message-header-radius: $radius !default
+
+$message-body-border-color: $border !default
+$message-body-border-width: 0 0 0 4px !default
+$message-body-color: $text !default
+$message-body-padding: 1.25em 1.5em !default
+$message-body-radius: $radius !default
+
+$message-body-pre-background-color: $scheme-main !default
+$message-body-pre-code-background-color: transparent !default
+
+$message-header-body-border-width: 0 !default
+$message-colors: $colors !default
+
+.message
+ @extend %block
+ background-color: $message-background-color
+ border-radius: $message-radius
+ font-size: $size-normal
+ strong
+ color: currentColor
+ a:not(.button):not(.tag):not(.dropdown-item)
+ color: currentColor
+ text-decoration: underline
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
+ // Colors
+ @each $name, $components in $message-colors
+ $color: nth($components, 1)
+ $color-invert: nth($components, 2)
+ $color-light: null
+ $color-dark: null
+
+ @if length($components) >= 3
+ $color-light: nth($components, 3)
+ @if length($components) >= 4
+ $color-dark: nth($components, 4)
+ @else
+ $color-luminance: colorLuminance($color)
+ $darken-percentage: $color-luminance * 70%
+ $desaturate-percentage: $color-luminance * 30%
+ $color-dark: desaturate(darken($color, $darken-percentage), $desaturate-percentage)
+ @else
+ $color-lightning: max((100% - lightness($color)) - 2%, 0%)
+ $color-light: lighten($color, $color-lightning)
+
+ &.is-#{$name}
+ background-color: $color-light
+ .message-header
+ background-color: $color
+ color: $color-invert
+ .message-body
+ border-color: $color
+ color: $color-dark
+
+.message-header
+ align-items: center
+ background-color: $message-header-background-color
+ border-radius: $message-header-radius $message-header-radius 0 0
+ color: $message-header-color
+ display: flex
+ font-weight: $message-header-weight
+ justify-content: space-between
+ line-height: 1.25
+ padding: $message-header-padding
+ position: relative
+ .delete
+ flex-grow: 0
+ flex-shrink: 0
+ margin-left: 0.75em
+ & + .message-body
+ border-width: $message-header-body-border-width
+ border-top-left-radius: 0
+ border-top-right-radius: 0
+
+.message-body
+ border-color: $message-body-border-color
+ border-radius: $message-body-radius
+ border-style: solid
+ border-width: $message-body-border-width
+ color: $message-body-color
+ padding: $message-body-padding
+ code,
+ pre
+ background-color: $message-body-pre-background-color
+ pre code
+ background-color: $message-body-pre-code-background-color
diff --git a/docs/src/assets/bulma/components/modal.sass b/docs/src/assets/bulma/components/modal.sass
new file mode 100644
index 00000000..377dfa78
--- /dev/null
+++ b/docs/src/assets/bulma/components/modal.sass
@@ -0,0 +1,113 @@
+$modal-z: 40 !default
+
+$modal-background-background-color: bulmaRgba($scheme-invert, 0.86) !default
+
+$modal-content-width: 640px !default
+$modal-content-margin-mobile: 20px !default
+$modal-content-spacing-mobile: 160px !default
+$modal-content-spacing-tablet: 40px !default
+
+$modal-close-dimensions: 40px !default
+$modal-close-right: 20px !default
+$modal-close-top: 20px !default
+
+$modal-card-spacing: 40px !default
+
+$modal-card-head-background-color: $background !default
+$modal-card-head-border-bottom: 1px solid $border !default
+$modal-card-head-padding: 20px !default
+$modal-card-head-radius: $radius-large !default
+
+$modal-card-title-color: $text-strong !default
+$modal-card-title-line-height: 1 !default
+$modal-card-title-size: $size-4 !default
+
+$modal-card-foot-radius: $radius-large !default
+$modal-card-foot-border-top: 1px solid $border !default
+
+$modal-card-body-background-color: $scheme-main !default
+$modal-card-body-padding: 20px !default
+
+.modal
+ @extend %overlay
+ align-items: center
+ display: none
+ flex-direction: column
+ justify-content: center
+ overflow: hidden
+ position: fixed
+ z-index: $modal-z
+ // Modifiers
+ &.is-active
+ display: flex
+
+.modal-background
+ @extend %overlay
+ background-color: $modal-background-background-color
+
+.modal-content,
+.modal-card
+ margin: 0 $modal-content-margin-mobile
+ max-height: calc(100vh - #{$modal-content-spacing-mobile})
+ overflow: auto
+ position: relative
+ width: 100%
+ // Responsiveness
+ +tablet
+ margin: 0 auto
+ max-height: calc(100vh - #{$modal-content-spacing-tablet})
+ width: $modal-content-width
+
+.modal-close
+ @extend %delete
+ background: none
+ height: $modal-close-dimensions
+ position: fixed
+ right: $modal-close-right
+ top: $modal-close-top
+ width: $modal-close-dimensions
+
+.modal-card
+ display: flex
+ flex-direction: column
+ max-height: calc(100vh - #{$modal-card-spacing})
+ overflow: hidden
+ -ms-overflow-y: visible
+
+.modal-card-head,
+.modal-card-foot
+ align-items: center
+ background-color: $modal-card-head-background-color
+ display: flex
+ flex-shrink: 0
+ justify-content: flex-start
+ padding: $modal-card-head-padding
+ position: relative
+
+.modal-card-head
+ border-bottom: $modal-card-head-border-bottom
+ border-top-left-radius: $modal-card-head-radius
+ border-top-right-radius: $modal-card-head-radius
+
+.modal-card-title
+ color: $modal-card-title-color
+ flex-grow: 1
+ flex-shrink: 0
+ font-size: $modal-card-title-size
+ line-height: $modal-card-title-line-height
+
+.modal-card-foot
+ border-bottom-left-radius: $modal-card-foot-radius
+ border-bottom-right-radius: $modal-card-foot-radius
+ border-top: $modal-card-foot-border-top
+ .button
+ &:not(:last-child)
+ margin-right: 0.5em
+
+.modal-card-body
+ +overflow-touch
+ background-color: $modal-card-body-background-color
+ flex-grow: 1
+ flex-shrink: 1
+ overflow: auto
+ padding: $modal-card-body-padding
diff --git a/docs/src/assets/bulma/components/navbar.sass b/docs/src/assets/bulma/components/navbar.sass
new file mode 100644
index 00000000..664558f7
--- /dev/null
+++ b/docs/src/assets/bulma/components/navbar.sass
@@ -0,0 +1,443 @@
+$navbar-background-color: $scheme-main !default
+$navbar-box-shadow-size: 0 2px 0 0 !default
+$navbar-box-shadow-color: $background !default
+$navbar-height: 3.25rem !default
+$navbar-padding-vertical: 1rem !default
+$navbar-padding-horizontal: 2rem !default
+$navbar-z: 30 !default
+$navbar-fixed-z: 30 !default
+
+$navbar-item-color: $text !default
+$navbar-item-hover-color: $link !default
+$navbar-item-hover-background-color: $scheme-main-bis !default
+$navbar-item-active-color: $scheme-invert !default
+$navbar-item-active-background-color: transparent !default
+$navbar-item-img-max-height: 1.75rem !default
+
+$navbar-burger-color: $navbar-item-color !default
+
+$navbar-tab-hover-background-color: transparent !default
+$navbar-tab-hover-border-bottom-color: $link !default
+$navbar-tab-active-color: $link !default
+$navbar-tab-active-background-color: transparent !default
+$navbar-tab-active-border-bottom-color: $link !default
+$navbar-tab-active-border-bottom-style: solid !default
+$navbar-tab-active-border-bottom-width: 3px !default
+
+$navbar-dropdown-background-color: $scheme-main !default
+$navbar-dropdown-border-top: 2px solid $border !default
+$navbar-dropdown-offset: -4px !default
+$navbar-dropdown-arrow: $link !default
+$navbar-dropdown-radius: $radius-large !default
+$navbar-dropdown-z: 20 !default
+
+$navbar-dropdown-boxed-radius: $radius-large !default
+$navbar-dropdown-boxed-shadow: 0 8px 8px rgba($scheme-invert, 0.1), 0 0 0 1px rgba($scheme-invert, 0.1) !default
+
+$navbar-dropdown-item-hover-color: $scheme-invert !default
+$navbar-dropdown-item-hover-background-color: $background !default
+$navbar-dropdown-item-active-color: $link !default
+$navbar-dropdown-item-active-background-color: $background !default
+
+$navbar-divider-background-color: $background !default
+$navbar-divider-height: 2px !default
+
+$navbar-bottom-box-shadow-size: 0 -2px 0 0 !default
+
+$navbar-breakpoint: $desktop !default
+
+=navbar-fixed
+ left: 0
+ position: fixed
+ right: 0
+ z-index: $navbar-fixed-z
+
+.navbar
+ background-color: $navbar-background-color
+ min-height: $navbar-height
+ position: relative
+ z-index: $navbar-z
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ color: $color-invert
+ .navbar-brand
+ & > .navbar-item,
+ .navbar-link
+ color: $color-invert
+ & > a.navbar-item,
+ .navbar-link
+ &:focus,
+ &:hover,
+ &.is-active
+ background-color: darken($color, 5%)
+ color: $color-invert
+ .navbar-link
+ &::after
+ border-color: $color-invert
+ .navbar-burger
+ color: $color-invert
+ +from($navbar-breakpoint)
+ .navbar-start,
+ .navbar-end
+ & > .navbar-item,
+ .navbar-link
+ color: $color-invert
+ & > a.navbar-item,
+ .navbar-link
+ &:focus,
+ &:hover,
+ &.is-active
+ background-color: darken($color, 5%)
+ color: $color-invert
+ .navbar-link
+ &::after
+ border-color: $color-invert
+ .navbar-item.has-dropdown:focus .navbar-link,
+ .navbar-item.has-dropdown:hover .navbar-link,
+ .navbar-item.has-dropdown.is-active .navbar-link
+ background-color: darken($color, 5%)
+ color: $color-invert
+ .navbar-dropdown
+ a.navbar-item
+ &.is-active
+ background-color: $color
+ color: $color-invert
+ & > .container
+ align-items: stretch
+ display: flex
+ min-height: $navbar-height
+ width: 100%
+ &.has-shadow
+ box-shadow: $navbar-box-shadow-size $navbar-box-shadow-color
+ &.is-fixed-bottom,
+ &.is-fixed-top
+ +navbar-fixed
+ &.is-fixed-bottom
+ bottom: 0
+ &.has-shadow
+ box-shadow: $navbar-bottom-box-shadow-size $navbar-box-shadow-color
+ &.is-fixed-top
+ top: 0
+
+html,
+body
+ &.has-navbar-fixed-top
+ padding-top: $navbar-height
+ &.has-navbar-fixed-bottom
+ padding-bottom: $navbar-height
+
+.navbar-brand,
+.navbar-tabs
+ align-items: stretch
+ display: flex
+ flex-shrink: 0
+ min-height: $navbar-height
+
+.navbar-brand
+ a.navbar-item
+ &:focus,
+ &:hover
+ background-color: transparent
+
+.navbar-tabs
+ +overflow-touch
+ max-width: 100vw
+ overflow-x: auto
+ overflow-y: hidden
+
+.navbar-burger
+ color: $navbar-burger-color
+ +hamburger($navbar-height)
+ margin-left: auto
+
+.navbar-menu
+ display: none
+
+.navbar-item,
+.navbar-link
+ color: $navbar-item-color
+ display: block
+ line-height: 1.5
+ padding: 0.5rem 0.75rem
+ position: relative
+ .icon
+ &:only-child
+ margin-left: -0.25rem
+ margin-right: -0.25rem
+
+a.navbar-item,
+.navbar-link
+ cursor: pointer
+ &:focus,
+ &:focus-within,
+ &:hover,
+ &.is-active
+ background-color: $navbar-item-hover-background-color
+ color: $navbar-item-hover-color
+
+.navbar-item
+ display: block
+ flex-grow: 0
+ flex-shrink: 0
+ img
+ max-height: $navbar-item-img-max-height
+ &.has-dropdown
+ padding: 0
+ &.is-expanded
+ flex-grow: 1
+ flex-shrink: 1
+ &.is-tab
+ border-bottom: 1px solid transparent
+ min-height: $navbar-height
+ padding-bottom: calc(0.5rem - 1px)
+ &:focus,
+ &:hover
+ background-color: $navbar-tab-hover-background-color
+ border-bottom-color: $navbar-tab-hover-border-bottom-color
+ &.is-active
+ background-color: $navbar-tab-active-background-color
+ border-bottom-color: $navbar-tab-active-border-bottom-color
+ border-bottom-style: $navbar-tab-active-border-bottom-style
+ border-bottom-width: $navbar-tab-active-border-bottom-width
+ color: $navbar-tab-active-color
+ padding-bottom: calc(0.5rem - #{$navbar-tab-active-border-bottom-width})
+
+.navbar-content
+ flex-grow: 1
+ flex-shrink: 1
+
+.navbar-link:not(.is-arrowless)
+ padding-right: 2.5em
+ &::after
+ @extend %arrow
+ border-color: $navbar-dropdown-arrow
+ margin-top: -0.375em
+ right: 1.125em
+
+.navbar-dropdown
+ font-size: 0.875rem
+ padding-bottom: 0.5rem
+ padding-top: 0.5rem
+ .navbar-item
+ padding-left: 1.5rem
+ padding-right: 1.5rem
+
+.navbar-divider
+ background-color: $navbar-divider-background-color
+ border: none
+ display: none
+ height: $navbar-divider-height
+ margin: 0.5rem 0
+
++until($navbar-breakpoint)
+ .navbar > .container
+ display: block
+ .navbar-brand,
+ .navbar-tabs
+ .navbar-item
+ align-items: center
+ display: flex
+ .navbar-link
+ &::after
+ display: none
+ .navbar-menu
+ background-color: $navbar-background-color
+ box-shadow: 0 8px 16px rgba($scheme-invert, 0.1)
+ padding: 0.5rem 0
+ &.is-active
+ display: block
+ // Fixed navbar
+ .navbar
+ &.is-fixed-bottom-touch,
+ &.is-fixed-top-touch
+ +navbar-fixed
+ &.is-fixed-bottom-touch
+ bottom: 0
+ &.has-shadow
+ box-shadow: 0 -2px 3px rgba($scheme-invert, 0.1)
+ &.is-fixed-top-touch
+ top: 0
+ &.is-fixed-top,
+ &.is-fixed-top-touch
+ .navbar-menu
+ +overflow-touch
+ max-height: calc(100vh - #{$navbar-height})
+ overflow: auto
+ html,
+ body
+ &.has-navbar-fixed-top-touch
+ padding-top: $navbar-height
+ &.has-navbar-fixed-bottom-touch
+ padding-bottom: $navbar-height
+
++from($navbar-breakpoint)
+ .navbar,
+ .navbar-menu,
+ .navbar-start,
+ .navbar-end
+ align-items: stretch
+ display: flex
+ .navbar
+ min-height: $navbar-height
+ &.is-spaced
+ padding: $navbar-padding-vertical $navbar-padding-horizontal
+ .navbar-start,
+ .navbar-end
+ align-items: center
+ a.navbar-item,
+ .navbar-link
+ border-radius: $radius
+ &.is-transparent
+ a.navbar-item,
+ .navbar-link
+ &:focus,
+ &:hover,
+ &.is-active
+ background-color: transparent !important
+ .navbar-item.has-dropdown
+ &.is-active,
+ &.is-hoverable:focus,
+ &.is-hoverable:focus-within,
+ &.is-hoverable:hover
+ .navbar-link
+ background-color: transparent !important
+ .navbar-dropdown
+ a.navbar-item
+ &:focus,
+ &:hover
+ background-color: $navbar-dropdown-item-hover-background-color
+ color: $navbar-dropdown-item-hover-color
+ &.is-active
+ background-color: $navbar-dropdown-item-active-background-color
+ color: $navbar-dropdown-item-active-color
+ .navbar-burger
+ display: none
+ .navbar-item,
+ .navbar-link
+ align-items: center
+ display: flex
+ .navbar-item
+ display: flex
+ &.has-dropdown
+ align-items: stretch
+ &.has-dropdown-up
+ .navbar-link::after
+ transform: rotate(135deg) translate(0.25em, -0.25em)
+ .navbar-dropdown
+ border-bottom: $navbar-dropdown-border-top
+ border-radius: $navbar-dropdown-radius $navbar-dropdown-radius 0 0
+ border-top: none
+ bottom: 100%
+ box-shadow: 0 -8px 8px rgba($scheme-invert, 0.1)
+ top: auto
+ &.is-active,
+ &.is-hoverable:focus,
+ &.is-hoverable:focus-within,
+ &.is-hoverable:hover
+ .navbar-dropdown
+ display: block
+ .navbar.is-spaced &,
+ &.is-boxed
+ opacity: 1
+ pointer-events: auto
+ transform: translateY(0)
+ .navbar-menu
+ flex-grow: 1
+ flex-shrink: 0
+ .navbar-start
+ justify-content: flex-start
+ margin-right: auto
+ .navbar-end
+ justify-content: flex-end
+ margin-left: auto
+ .navbar-dropdown
+ background-color: $navbar-dropdown-background-color
+ border-bottom-left-radius: $navbar-dropdown-radius
+ border-bottom-right-radius: $navbar-dropdown-radius
+ border-top: $navbar-dropdown-border-top
+ box-shadow: 0 8px 8px rgba($scheme-invert, 0.1)
+ display: none
+ font-size: 0.875rem
+ left: 0
+ min-width: 100%
+ position: absolute
+ top: 100%
+ z-index: $navbar-dropdown-z
+ .navbar-item
+ padding: 0.375rem 1rem
+ white-space: nowrap
+ a.navbar-item
+ padding-right: 3rem
+ &:focus,
+ &:hover
+ background-color: $navbar-dropdown-item-hover-background-color
+ color: $navbar-dropdown-item-hover-color
+ &.is-active
+ background-color: $navbar-dropdown-item-active-background-color
+ color: $navbar-dropdown-item-active-color
+ .navbar.is-spaced &,
+ &.is-boxed
+ border-radius: $navbar-dropdown-boxed-radius
+ border-top: none
+ box-shadow: $navbar-dropdown-boxed-shadow
+ display: block
+ opacity: 0
+ pointer-events: none
+ top: calc(100% + (#{$navbar-dropdown-offset}))
+ transform: translateY(-5px)
+ transition-duration: $speed
+ transition-property: opacity, transform
+ &.is-right
+ left: auto
+ right: 0
+ .navbar-divider
+ display: block
+ .navbar > .container,
+ .container > .navbar
+ .navbar-brand
+ margin-left: -.75rem
+ .navbar-menu
+ margin-right: -.75rem
+ // Fixed navbar
+ .navbar
+ &.is-fixed-bottom-desktop,
+ &.is-fixed-top-desktop
+ +navbar-fixed
+ &.is-fixed-bottom-desktop
+ bottom: 0
+ &.has-shadow
+ box-shadow: 0 -2px 3px rgba($scheme-invert, 0.1)
+ &.is-fixed-top-desktop
+ top: 0
+ html,
+ body
+ &.has-navbar-fixed-top-desktop
+ padding-top: $navbar-height
+ &.has-navbar-fixed-bottom-desktop
+ padding-bottom: $navbar-height
+ &.has-spaced-navbar-fixed-top
+ padding-top: $navbar-height + ($navbar-padding-vertical * 2)
+ &.has-spaced-navbar-fixed-bottom
+ padding-bottom: $navbar-height + ($navbar-padding-vertical * 2)
+ // Hover/Active states
+ a.navbar-item,
+ .navbar-link
+ &.is-active
+ color: $navbar-item-active-color
+ &.is-active:not(:focus):not(:hover)
+ background-color: $navbar-item-active-background-color
+ .navbar-item.has-dropdown
+ &:focus,
+ &:hover,
+ &.is-active
+ .navbar-link
+ background-color: $navbar-item-hover-background-color
+
+// Combination
+
+.hero
+ &.is-fullheight-with-navbar
+ min-height: calc(100vh - #{$navbar-height})
diff --git a/docs/src/assets/bulma/components/pagination.sass b/docs/src/assets/bulma/components/pagination.sass
new file mode 100644
index 00000000..822c2e81
--- /dev/null
+++ b/docs/src/assets/bulma/components/pagination.sass
@@ -0,0 +1,150 @@
+$pagination-color: $text-strong !default
+$pagination-border-color: $border !default
+$pagination-margin: -0.25rem !default
+$pagination-min-width: $control-height !default
+
+$pagination-item-font-size: 1em !default
+$pagination-item-margin: 0.25rem !default
+$pagination-item-padding-left: 0.5em !default
+$pagination-item-padding-right: 0.5em !default
+
+$pagination-hover-color: $link-hover !default
+$pagination-hover-border-color: $link-hover-border !default
+
+$pagination-focus-color: $link-focus !default
+$pagination-focus-border-color: $link-focus-border !default
+
+$pagination-active-color: $link-active !default
+$pagination-active-border-color: $link-active-border !default
+
+$pagination-disabled-color: $text-light !default
+$pagination-disabled-background-color: $border !default
+$pagination-disabled-border-color: $border !default
+
+$pagination-current-color: $link-invert !default
+$pagination-current-background-color: $link !default
+$pagination-current-border-color: $link !default
+
+$pagination-ellipsis-color: $grey-light !default
+
+$pagination-shadow-inset: inset 0 1px 2px rgba($scheme-invert, 0.2)
+
+.pagination
+ @extend %block
+ font-size: $size-normal
+ margin: $pagination-margin
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
+ &.is-rounded
+ .pagination-previous,
+ .pagination-next
+ padding-left: 1em
+ padding-right: 1em
+ border-radius: $radius-rounded
+ .pagination-link
+ border-radius: $radius-rounded
+
+.pagination,
+.pagination-list
+ align-items: center
+ display: flex
+ justify-content: center
+ text-align: center
+
+.pagination-previous,
+.pagination-next,
+.pagination-link,
+.pagination-ellipsis
+ @extend %control
+ @extend %unselectable
+ font-size: $pagination-item-font-size
+ justify-content: center
+ margin: $pagination-item-margin
+ padding-left: $pagination-item-padding-left
+ padding-right: $pagination-item-padding-right
+ text-align: center
+
+.pagination-previous,
+.pagination-next,
+.pagination-link
+ border-color: $pagination-border-color
+ color: $pagination-color
+ min-width: $pagination-min-width
+ &:hover
+ border-color: $pagination-hover-border-color
+ color: $pagination-hover-color
+ &:focus
+ border-color: $pagination-focus-border-color
+ &:active
+ box-shadow: $pagination-shadow-inset
+ &[disabled]
+ background-color: $pagination-disabled-background-color
+ border-color: $pagination-disabled-border-color
+ box-shadow: none
+ color: $pagination-disabled-color
+ opacity: 0.5
+
+.pagination-previous,
+.pagination-next
+ padding-left: 0.75em
+ padding-right: 0.75em
+ white-space: nowrap
+
+.pagination-link
+ &.is-current
+ background-color: $pagination-current-background-color
+ border-color: $pagination-current-border-color
+ color: $pagination-current-color
+
+.pagination-ellipsis
+ color: $pagination-ellipsis-color
+ pointer-events: none
+
+.pagination-list
+ flex-wrap: wrap
+
++mobile
+ .pagination
+ flex-wrap: wrap
+ .pagination-previous,
+ .pagination-next
+ flex-grow: 1
+ flex-shrink: 1
+ .pagination-list
+ li
+ flex-grow: 1
+ flex-shrink: 1
+
++tablet
+ .pagination-list
+ flex-grow: 1
+ flex-shrink: 1
+ justify-content: flex-start
+ order: 1
+ .pagination-previous
+ order: 2
+ .pagination-next
+ order: 3
+ .pagination
+ justify-content: space-between
+ &.is-centered
+ .pagination-previous
+ order: 1
+ .pagination-list
+ justify-content: center
+ order: 2
+ .pagination-next
+ order: 3
+ &.is-right
+ .pagination-previous
+ order: 1
+ .pagination-next
+ order: 2
+ .pagination-list
+ justify-content: flex-end
+ order: 3
diff --git a/docs/src/assets/bulma/components/panel.sass b/docs/src/assets/bulma/components/panel.sass
new file mode 100644
index 00000000..c7b14877
--- /dev/null
+++ b/docs/src/assets/bulma/components/panel.sass
@@ -0,0 +1,119 @@
+$panel-margin: $block-spacing !default
+$panel-item-border: 1px solid $border-light !default
+$panel-radius: $radius-large !default
+$panel-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
+
+$panel-heading-background-color: $border-light !default
+$panel-heading-color: $text-strong !default
+$panel-heading-line-height: 1.25 !default
+$panel-heading-padding: 0.75em 1em !default
+$panel-heading-radius: $radius !default
+$panel-heading-size: 1.25em !default
+$panel-heading-weight: $weight-bold !default
+
+$panel-tabs-font-size: 0.875em !default
+$panel-tab-border-bottom: 1px solid $border !default
+$panel-tab-active-border-bottom-color: $link-active-border !default
+$panel-tab-active-color: $link-active !default
+
+$panel-list-item-color: $text !default
+$panel-list-item-hover-color: $link !default
+
+$panel-block-color: $text-strong !default
+$panel-block-hover-background-color: $background !default
+$panel-block-active-border-left-color: $link !default
+$panel-block-active-color: $link-active !default
+$panel-block-active-icon-color: $link !default
+
+$panel-icon-color: $text-light !default
+$panel-colors: $colors !default
+
+.panel
+ border-radius: $panel-radius
+ box-shadow: $panel-shadow
+ font-size: $size-normal
+ &:not(:last-child)
+ margin-bottom: $panel-margin
+ // Colors
+ @each $name, $components in $panel-colors
+ $color: nth($components, 1)
+ $color-invert: nth($components, 2)
+ &.is-#{$name}
+ .panel-heading
+ background-color: $color
+ color: $color-invert
+ .panel-tabs a.is-active
+ border-bottom-color: $color
+ .panel-block.is-active .panel-icon
+ color: $color
+
+.panel-tabs,
+.panel-block
+ &:not(:last-child)
+ border-bottom: $panel-item-border
+
+.panel-heading
+ background-color: $panel-heading-background-color
+ border-radius: $panel-radius $panel-radius 0 0
+ color: $panel-heading-color
+ font-size: $panel-heading-size
+ font-weight: $panel-heading-weight
+ line-height: $panel-heading-line-height
+ padding: $panel-heading-padding
+
+.panel-tabs
+ align-items: flex-end
+ display: flex
+ font-size: $panel-tabs-font-size
+ justify-content: center
+ a
+ border-bottom: $panel-tab-border-bottom
+ margin-bottom: -1px
+ padding: 0.5em
+ // Modifiers
+ &.is-active
+ border-bottom-color: $panel-tab-active-border-bottom-color
+ color: $panel-tab-active-color
+
+.panel-list
+ a
+ color: $panel-list-item-color
+ &:hover
+ color: $panel-list-item-hover-color
+
+.panel-block
+ align-items: center
+ color: $panel-block-color
+ display: flex
+ justify-content: flex-start
+ padding: 0.5em 0.75em
+ input[type="checkbox"]
+ margin-right: 0.75em
+ & > .control
+ flex-grow: 1
+ flex-shrink: 1
+ width: 100%
+ &.is-wrapped
+ flex-wrap: wrap
+ &.is-active
+ border-left-color: $panel-block-active-border-left-color
+ color: $panel-block-active-color
+ .panel-icon
+ color: $panel-block-active-icon-color
+ &:last-child
+ border-bottom-left-radius: $panel-radius
+ border-bottom-right-radius: $panel-radius
+
+a.panel-block,
+label.panel-block
+ cursor: pointer
+ &:hover
+ background-color: $panel-block-hover-background-color
+
+.panel-icon
+ +fa(14px, 1em)
+ color: $panel-icon-color
+ margin-right: 0.75em
+ .fa
+ font-size: inherit
+ line-height: inherit
diff --git a/docs/src/assets/bulma/components/tabs.sass b/docs/src/assets/bulma/components/tabs.sass
new file mode 100644
index 00000000..8c28c257
--- /dev/null
+++ b/docs/src/assets/bulma/components/tabs.sass
@@ -0,0 +1,151 @@
+$tabs-border-bottom-color: $border !default
+$tabs-border-bottom-style: solid !default
+$tabs-border-bottom-width: 1px !default
+$tabs-link-color: $text !default
+$tabs-link-hover-border-bottom-color: $text-strong !default
+$tabs-link-hover-color: $text-strong !default
+$tabs-link-active-border-bottom-color: $link !default
+$tabs-link-active-color: $link !default
+$tabs-link-padding: 0.5em 1em !default
+
+$tabs-boxed-link-radius: $radius !default
+$tabs-boxed-link-hover-background-color: $background !default
+$tabs-boxed-link-hover-border-bottom-color: $border !default
+
+$tabs-boxed-link-active-background-color: $scheme-main !default
+$tabs-boxed-link-active-border-color: $border !default
+$tabs-boxed-link-active-border-bottom-color: transparent !default
+
+$tabs-toggle-link-border-color: $border !default
+$tabs-toggle-link-border-style: solid !default
+$tabs-toggle-link-border-width: 1px !default
+$tabs-toggle-link-hover-background-color: $background !default
+$tabs-toggle-link-hover-border-color: $border-hover !default
+$tabs-toggle-link-radius: $radius !default
+$tabs-toggle-link-active-background-color: $link !default
+$tabs-toggle-link-active-border-color: $link !default
+$tabs-toggle-link-active-color: $link-invert !default
+
+.tabs
+ @extend %block
+ +overflow-touch
+ @extend %unselectable
+ align-items: stretch
+ display: flex
+ font-size: $size-normal
+ justify-content: space-between
+ overflow: hidden
+ overflow-x: auto
+ white-space: nowrap
+ a
+ align-items: center
+ border-bottom-color: $tabs-border-bottom-color
+ border-bottom-style: $tabs-border-bottom-style
+ border-bottom-width: $tabs-border-bottom-width
+ color: $tabs-link-color
+ display: flex
+ justify-content: center
+ margin-bottom: -#{$tabs-border-bottom-width}
+ padding: $tabs-link-padding
+ vertical-align: top
+ &:hover
+ border-bottom-color: $tabs-link-hover-border-bottom-color
+ color: $tabs-link-hover-color
+ li
+ display: block
+ &.is-active
+ a
+ border-bottom-color: $tabs-link-active-border-bottom-color
+ color: $tabs-link-active-color
+ ul
+ align-items: center
+ border-bottom-color: $tabs-border-bottom-color
+ border-bottom-style: $tabs-border-bottom-style
+ border-bottom-width: $tabs-border-bottom-width
+ display: flex
+ flex-grow: 1
+ flex-shrink: 0
+ justify-content: flex-start
+ &.is-left
+ padding-right: 0.75em
+ &.is-center
+ flex: none
+ justify-content: center
+ padding-left: 0.75em
+ padding-right: 0.75em
+ &.is-right
+ justify-content: flex-end
+ padding-left: 0.75em
+ .icon
+ &:first-child
+ margin-right: 0.5em
+ &:last-child
+ margin-left: 0.5em
+ // Alignment
+ &.is-centered
+ ul
+ justify-content: center
+ &.is-right
+ ul
+ justify-content: flex-end
+ // Styles
+ &.is-boxed
+ a
+ border: 1px solid transparent
+ border-radius: $tabs-boxed-link-radius $tabs-boxed-link-radius 0 0
+ &:hover
+ background-color: $tabs-boxed-link-hover-background-color
+ border-bottom-color: $tabs-boxed-link-hover-border-bottom-color
+ li
+ &.is-active
+ a
+ background-color: $tabs-boxed-link-active-background-color
+ border-color: $tabs-boxed-link-active-border-color
+ border-bottom-color: $tabs-boxed-link-active-border-bottom-color !important
+ &.is-fullwidth
+ li
+ flex-grow: 1
+ flex-shrink: 0
+ &.is-toggle
+ a
+ border-color: $tabs-toggle-link-border-color
+ border-style: $tabs-toggle-link-border-style
+ border-width: $tabs-toggle-link-border-width
+ margin-bottom: 0
+ position: relative
+ &:hover
+ background-color: $tabs-toggle-link-hover-background-color
+ border-color: $tabs-toggle-link-hover-border-color
+ z-index: 2
+ li
+ & + li
+ margin-left: -#{$tabs-toggle-link-border-width}
+ &:first-child a
+ border-radius: $tabs-toggle-link-radius 0 0 $tabs-toggle-link-radius
+ &:last-child a
+ border-radius: 0 $tabs-toggle-link-radius $tabs-toggle-link-radius 0
+ &.is-active
+ a
+ background-color: $tabs-toggle-link-active-background-color
+ border-color: $tabs-toggle-link-active-border-color
+ color: $tabs-toggle-link-active-color
+ z-index: 1
+ ul
+ border-bottom: none
+ &.is-toggle-rounded
+ li
+ &:first-child a
+ border-bottom-left-radius: $radius-rounded
+ border-top-left-radius: $radius-rounded
+ padding-left: 1.25em
+ &:last-child a
+ border-bottom-right-radius: $radius-rounded
+ border-top-right-radius: $radius-rounded
+ padding-right: 1.25em
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
diff --git a/docs/src/assets/bulma/elements/_all.sass b/docs/src/assets/bulma/elements/_all.sass
new file mode 100644
index 00000000..7490c00d
--- /dev/null
+++ b/docs/src/assets/bulma/elements/_all.sass
@@ -0,0 +1,15 @@
+@charset "utf-8"
+
+@import "box.sass"
+@import "button.sass"
+@import "container.sass"
+@import "content.sass"
+@import "icon.sass"
+@import "image.sass"
+@import "notification.sass"
+@import "progress.sass"
+@import "table.sass"
+@import "tag.sass"
+@import "title.sass"
+
+@import "other.sass"
diff --git a/docs/src/assets/bulma/elements/box.sass b/docs/src/assets/bulma/elements/box.sass
new file mode 100644
index 00000000..2fd18d49
--- /dev/null
+++ b/docs/src/assets/bulma/elements/box.sass
@@ -0,0 +1,24 @@
+$box-color: $text !default
+$box-background-color: $scheme-main !default
+$box-radius: $radius-large !default
+$box-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
+$box-padding: 1.25rem !default
+
+$box-link-hover-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0 0 1px $link !default
+$box-link-active-shadow: inset 0 1px 2px rgba($scheme-invert, 0.2), 0 0 0 1px $link !default
+
+.box
+ @extend %block
+ background-color: $box-background-color
+ border-radius: $box-radius
+ box-shadow: $box-shadow
+ color: $box-color
+ display: block
+ padding: $box-padding
+
+a.box
+ &:hover,
+ &:focus
+ box-shadow: $box-link-hover-shadow
+ &:active
+ box-shadow: $box-link-active-shadow
diff --git a/docs/src/assets/bulma/elements/button.sass b/docs/src/assets/bulma/elements/button.sass
new file mode 100644
index 00000000..df5417c8
--- /dev/null
+++ b/docs/src/assets/bulma/elements/button.sass
@@ -0,0 +1,323 @@
+$button-color: $text-strong !default
+$button-background-color: $scheme-main !default
+$button-family: false !default
+
+$button-border-color: $border !default
+$button-border-width: $control-border-width !default
+
+$button-padding-vertical: calc(0.5em - #{$button-border-width}) !default
+$button-padding-horizontal: 1em !default
+
+$button-hover-color: $link-hover !default
+$button-hover-border-color: $link-hover-border !default
+
+$button-focus-color: $link-focus !default
+$button-focus-border-color: $link-focus-border !default
+$button-focus-box-shadow-size: 0 0 0 0.125em !default
+$button-focus-box-shadow-color: bulmaRgba($link, 0.25) !default
+
+$button-active-color: $link-active !default
+$button-active-border-color: $link-active-border !default
+
+$button-text-color: $text !default
+$button-text-decoration: underline !default
+$button-text-hover-background-color: $background !default
+$button-text-hover-color: $text-strong !default
+
+$button-disabled-background-color: $scheme-main !default
+$button-disabled-border-color: $border !default
+$button-disabled-shadow: none !default
+$button-disabled-opacity: 0.5 !default
+
+$button-static-color: $text-light !default
+$button-static-background-color: $scheme-main-ter !default
+$button-static-border-color: $border !default
+
+// The button sizes use mixins so they can be used at different breakpoints
+=button-small
+ border-radius: $radius-small
+ font-size: $size-small
+=button-normal
+ font-size: $size-normal
+=button-medium
+ font-size: $size-medium
+=button-large
+ font-size: $size-large
+
+.button
+ @extend %control
+ @extend %unselectable
+ background-color: $button-background-color
+ border-color: $button-border-color
+ border-width: $button-border-width
+ color: $button-color
+ cursor: pointer
+ @if $button-family
+ font-family: $button-family
+ justify-content: center
+ padding-bottom: $button-padding-vertical
+ padding-left: $button-padding-horizontal
+ padding-right: $button-padding-horizontal
+ padding-top: $button-padding-vertical
+ text-align: center
+ white-space: nowrap
+ strong
+ color: inherit
+ .icon
+ &,
+ &.is-small,
+ &.is-medium,
+ &.is-large
+ height: 1.5em
+ width: 1.5em
+ &:first-child:not(:last-child)
+ margin-left: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width})
+ margin-right: $button-padding-horizontal / 4
+ &:last-child:not(:first-child)
+ margin-left: $button-padding-horizontal / 4
+ margin-right: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width})
+ &:first-child:last-child
+ margin-left: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width})
+ margin-right: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width})
+ // States
+ &:hover,
+ &.is-hovered
+ border-color: $button-hover-border-color
+ color: $button-hover-color
+ &:focus,
+ &.is-focused
+ border-color: $button-focus-border-color
+ color: $button-focus-color
+ &:not(:active)
+ box-shadow: $button-focus-box-shadow-size $button-focus-box-shadow-color
+ &:active,
+ &.is-active
+ border-color: $button-active-border-color
+ color: $button-active-color
+ // Colors
+ &.is-text
+ background-color: transparent
+ border-color: transparent
+ color: $button-text-color
+ text-decoration: $button-text-decoration
+ &:hover,
+ &.is-hovered,
+ &:focus,
+ &.is-focused
+ background-color: $button-text-hover-background-color
+ color: $button-text-hover-color
+ &:active,
+ &.is-active
+ background-color: darken($button-text-hover-background-color, 5%)
+ color: $button-text-hover-color
+ &[disabled],
+ fieldset[disabled] &
+ background-color: transparent
+ border-color: transparent
+ box-shadow: none
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ border-color: transparent
+ color: $color-invert
+ &:hover,
+ &.is-hovered
+ background-color: darken($color, 2.5%)
+ border-color: transparent
+ color: $color-invert
+ &:focus,
+ &.is-focused
+ border-color: transparent
+ color: $color-invert
+ &:not(:active)
+ box-shadow: $button-focus-box-shadow-size rgba($color, 0.25)
+ &:active,
+ &.is-active
+ background-color: darken($color, 5%)
+ border-color: transparent
+ color: $color-invert
+ &[disabled],
+ fieldset[disabled] &
+ background-color: $color
+ border-color: transparent
+ box-shadow: none
+ &.is-inverted
+ background-color: $color-invert
+ color: $color
+ &:hover,
+ &.is-hovered
+ background-color: darken($color-invert, 5%)
+ &[disabled],
+ fieldset[disabled] &
+ background-color: $color-invert
+ border-color: transparent
+ box-shadow: none
+ color: $color
+ &.is-loading
+ &::after
+ border-color: transparent transparent $color-invert $color-invert !important
+ &.is-outlined
+ background-color: transparent
+ border-color: $color
+ color: $color
+ &:hover,
+ &.is-hovered,
+ &:focus,
+ &.is-focused
+ background-color: $color
+ border-color: $color
+ color: $color-invert
+ &.is-loading
+ &::after
+ border-color: transparent transparent $color $color !important
+ &:hover,
+ &.is-hovered,
+ &:focus,
+ &.is-focused
+ &::after
+ border-color: transparent transparent $color-invert $color-invert !important
+ &[disabled],
+ fieldset[disabled] &
+ background-color: transparent
+ border-color: $color
+ box-shadow: none
+ color: $color
+ &.is-inverted.is-outlined
+ background-color: transparent
+ border-color: $color-invert
+ color: $color-invert
+ &:hover,
+ &.is-hovered,
+ &:focus,
+ &.is-focused
+ background-color: $color-invert
+ color: $color
+ &.is-loading
+ &:hover,
+ &.is-hovered,
+ &:focus,
+ &.is-focused
+ &::after
+ border-color: transparent transparent $color $color !important
+ &[disabled],
+ fieldset[disabled] &
+ background-color: transparent
+ border-color: $color-invert
+ box-shadow: none
+ color: $color-invert
+ // If light and dark colors are provided
+ @if length($pair) >= 4
+ $color-light: nth($pair, 3)
+ $color-dark: nth($pair, 4)
+ &.is-light
+ background-color: $color-light
+ color: $color-dark
+ &:hover,
+ &.is-hovered
+ background-color: darken($color-light, 2.5%)
+ border-color: transparent
+ color: $color-dark
+ &:active,
+ &.is-active
+ background-color: darken($color-light, 5%)
+ border-color: transparent
+ color: $color-dark
+ // Sizes
+ &.is-small
+ +button-small
+ &.is-normal
+ +button-normal
+ &.is-medium
+ +button-medium
+ &.is-large
+ +button-large
+ // Modifiers
+ &[disabled],
+ fieldset[disabled] &
+ background-color: $button-disabled-background-color
+ border-color: $button-disabled-border-color
+ box-shadow: $button-disabled-shadow
+ opacity: $button-disabled-opacity
+ &.is-fullwidth
+ display: flex
+ width: 100%
+ &.is-loading
+ color: transparent !important
+ pointer-events: none
+ &::after
+ @extend %loader
+ +center(1em)
+ position: absolute !important
+ &.is-static
+ background-color: $button-static-background-color
+ border-color: $button-static-border-color
+ color: $button-static-color
+ box-shadow: none
+ pointer-events: none
+ &.is-rounded
+ border-radius: $radius-rounded
+ padding-left: calc(#{$button-padding-horizontal} + 0.25em)
+ padding-right: calc(#{$button-padding-horizontal} + 0.25em)
+
+.buttons
+ align-items: center
+ display: flex
+ flex-wrap: wrap
+ justify-content: flex-start
+ .button
+ margin-bottom: 0.5rem
+ &:not(:last-child):not(.is-fullwidth)
+ margin-right: 0.5rem
+ &:last-child
+ margin-bottom: -0.5rem
+ &:not(:last-child)
+ margin-bottom: 1rem
+ // Sizes
+ &.are-small
+ .button:not(.is-normal):not(.is-medium):not(.is-large)
+ +button-small
+ &.are-medium
+ .button:not(.is-small):not(.is-normal):not(.is-large)
+ +button-medium
+ &.are-large
+ .button:not(.is-small):not(.is-normal):not(.is-medium)
+ +button-large
+ &.has-addons
+ .button
+ &:not(:first-child)
+ border-bottom-left-radius: 0
+ border-top-left-radius: 0
+ &:not(:last-child)
+ border-bottom-right-radius: 0
+ border-top-right-radius: 0
+ margin-right: -1px
+ &:last-child
+ margin-right: 0
+ &:hover,
+ &.is-hovered
+ z-index: 2
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active,
+ &.is-selected
+ z-index: 3
+ &:hover
+ z-index: 4
+ &.is-expanded
+ flex-grow: 1
+ flex-shrink: 1
+ &.is-centered
+ justify-content: center
+ &:not(.has-addons)
+ .button:not(.is-fullwidth)
+ margin-left: 0.25rem
+ margin-right: 0.25rem
+ &.is-right
+ justify-content: flex-end
+ &:not(.has-addons)
+ .button:not(.is-fullwidth)
+ margin-left: 0.25rem
+ margin-right: 0.25rem
diff --git a/docs/src/assets/bulma/elements/container.sass b/docs/src/assets/bulma/elements/container.sass
new file mode 100644
index 00000000..d88eb94a
--- /dev/null
+++ b/docs/src/assets/bulma/elements/container.sass
@@ -0,0 +1,24 @@
+$container-offset: (2 * $gap) !default
+
+.container
+ flex-grow: 1
+ margin: 0 auto
+ position: relative
+ width: auto
+ &.is-fluid
+ max-width: none
+ padding-left: $gap
+ padding-right: $gap
+ width: 100%
+ +desktop
+ max-width: $desktop - $container-offset
+ +until-widescreen
+ &.is-widescreen
+ max-width: $widescreen - $container-offset
+ +until-fullhd
+ &.is-fullhd
+ max-width: $fullhd - $container-offset
+ +widescreen
+ max-width: $widescreen - $container-offset
+ +fullhd
+ max-width: $fullhd - $container-offset
diff --git a/docs/src/assets/bulma/elements/content.sass b/docs/src/assets/bulma/elements/content.sass
new file mode 100644
index 00000000..001419ab
--- /dev/null
+++ b/docs/src/assets/bulma/elements/content.sass
@@ -0,0 +1,155 @@
+$content-heading-color: $text-strong !default
+$content-heading-weight: $weight-semibold !default
+$content-heading-line-height: 1.125 !default
+
+$content-blockquote-background-color: $background !default
+$content-blockquote-border-left: 5px solid $border !default
+$content-blockquote-padding: 1.25em 1.5em !default
+
+$content-pre-padding: 1.25em 1.5em !default
+
+$content-table-cell-border: 1px solid $border !default
+$content-table-cell-border-width: 0 0 1px !default
+$content-table-cell-padding: 0.5em 0.75em !default
+$content-table-cell-heading-color: $text-strong !default
+$content-table-head-cell-border-width: 0 0 2px !default
+$content-table-head-cell-color: $text-strong !default
+$content-table-foot-cell-border-width: 2px 0 0 !default
+$content-table-foot-cell-color: $text-strong !default
+
+.content
+ @extend %block
+ // Inline
+ li + li
+ margin-top: 0.25em
+ // Block
+ p,
+ dl,
+ ol,
+ ul,
+ blockquote,
+ pre,
+ table
+ &:not(:last-child)
+ margin-bottom: 1em
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6
+ color: $content-heading-color
+ font-weight: $content-heading-weight
+ line-height: $content-heading-line-height
+ h1
+ font-size: 2em
+ margin-bottom: 0.5em
+ &:not(:first-child)
+ margin-top: 1em
+ h2
+ font-size: 1.75em
+ margin-bottom: 0.5714em
+ &:not(:first-child)
+ margin-top: 1.1428em
+ h3
+ font-size: 1.5em
+ margin-bottom: 0.6666em
+ &:not(:first-child)
+ margin-top: 1.3333em
+ h4
+ font-size: 1.25em
+ margin-bottom: 0.8em
+ h5
+ font-size: 1.125em
+ margin-bottom: 0.8888em
+ h6
+ font-size: 1em
+ margin-bottom: 1em
+ blockquote
+ background-color: $content-blockquote-background-color
+ border-left: $content-blockquote-border-left
+ padding: $content-blockquote-padding
+ ol
+ list-style-position: outside
+ margin-left: 2em
+ margin-top: 1em
+ &:not([type])
+ list-style-type: decimal
+ &.is-lower-alpha
+ list-style-type: lower-alpha
+ &.is-lower-roman
+ list-style-type: lower-roman
+ &.is-upper-alpha
+ list-style-type: upper-alpha
+ &.is-upper-roman
+ list-style-type: upper-roman
+ ul
+ list-style: disc outside
+ margin-left: 2em
+ margin-top: 1em
+ ul
+ list-style-type: circle
+ margin-top: 0.5em
+ ul
+ list-style-type: square
+ dd
+ margin-left: 2em
+ figure
+ margin-left: 2em
+ margin-right: 2em
+ text-align: center
+ &:not(:first-child)
+ margin-top: 2em
+ &:not(:last-child)
+ margin-bottom: 2em
+ img
+ display: inline-block
+ figcaption
+ font-style: italic
+ pre
+ +overflow-touch
+ overflow-x: auto
+ padding: $content-pre-padding
+ white-space: pre
+ word-wrap: normal
+ sup,
+ sub
+ font-size: 75%
+ table
+ width: 100%
+ td,
+ th
+ border: $content-table-cell-border
+ border-width: $content-table-cell-border-width
+ padding: $content-table-cell-padding
+ vertical-align: top
+ th
+ color: $content-table-cell-heading-color
+ &:not([align])
+ text-align: left
+ thead
+ td,
+ th
+ border-width: $content-table-head-cell-border-width
+ color: $content-table-head-cell-color
+ tfoot
+ td,
+ th
+ border-width: $content-table-foot-cell-border-width
+ color: $content-table-foot-cell-color
+ tbody
+ tr
+ &:last-child
+ td,
+ th
+ border-bottom-width: 0
+ .tabs
+ li + li
+ margin-top: 0
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
diff --git a/docs/src/assets/bulma/elements/form.sass b/docs/src/assets/bulma/elements/form.sass
new file mode 100644
index 00000000..3122dc4c
--- /dev/null
+++ b/docs/src/assets/bulma/elements/form.sass
@@ -0,0 +1 @@
+@warn "The form.sass file is DEPRECATED. It has moved into its own /form folder. Please import sass/form/_all instead."
diff --git a/docs/src/assets/bulma/elements/icon.sass b/docs/src/assets/bulma/elements/icon.sass
new file mode 100644
index 00000000..988546c7
--- /dev/null
+++ b/docs/src/assets/bulma/elements/icon.sass
@@ -0,0 +1,21 @@
+$icon-dimensions: 1.5rem !default
+$icon-dimensions-small: 1rem !default
+$icon-dimensions-medium: 2rem !default
+$icon-dimensions-large: 3rem !default
+
+.icon
+ align-items: center
+ display: inline-flex
+ justify-content: center
+ height: $icon-dimensions
+ width: $icon-dimensions
+ // Sizes
+ &.is-small
+ height: $icon-dimensions-small
+ width: $icon-dimensions-small
+ &.is-medium
+ height: $icon-dimensions-medium
+ width: $icon-dimensions-medium
+ &.is-large
+ height: $icon-dimensions-large
+ width: $icon-dimensions-large
diff --git a/docs/src/assets/bulma/elements/image.sass b/docs/src/assets/bulma/elements/image.sass
new file mode 100644
index 00000000..7547abcf
--- /dev/null
+++ b/docs/src/assets/bulma/elements/image.sass
@@ -0,0 +1,71 @@
+$dimensions: 16 24 32 48 64 96 128 !default
+
+.image
+ display: block
+ position: relative
+ img
+ display: block
+ height: auto
+ width: 100%
+ &.is-rounded
+ border-radius: $radius-rounded
+ &.is-fullwidth
+ width: 100%
+ // Ratio
+ &.is-square,
+ &.is-1by1,
+ &.is-5by4,
+ &.is-4by3,
+ &.is-3by2,
+ &.is-5by3,
+ &.is-16by9,
+ &.is-2by1,
+ &.is-3by1,
+ &.is-4by5,
+ &.is-3by4,
+ &.is-2by3,
+ &.is-3by5,
+ &.is-9by16,
+ &.is-1by2,
+ &.is-1by3
+ img,
+ .has-ratio
+ @extend %overlay
+ height: 100%
+ width: 100%
+ &.is-square,
+ &.is-1by1
+ padding-top: 100%
+ &.is-5by4
+ padding-top: 80%
+ &.is-4by3
+ padding-top: 75%
+ &.is-3by2
+ padding-top: 66.6666%
+ &.is-5by3
+ padding-top: 60%
+ &.is-16by9
+ padding-top: 56.25%
+ &.is-2by1
+ padding-top: 50%
+ &.is-3by1
+ padding-top: 33.3333%
+ &.is-4by5
+ padding-top: 125%
+ &.is-3by4
+ padding-top: 133.3333%
+ &.is-2by3
+ padding-top: 150%
+ &.is-3by5
+ padding-top: 166.6666%
+ &.is-9by16
+ padding-top: 177.7777%
+ &.is-1by2
+ padding-top: 200%
+ &.is-1by3
+ padding-top: 300%
+ // Sizes
+ @each $dimension in $dimensions
+ &.is-#{$dimension}x#{$dimension}
+ height: $dimension * 1px
+ width: $dimension * 1px
diff --git a/docs/src/assets/bulma/elements/notification.sass b/docs/src/assets/bulma/elements/notification.sass
new file mode 100644
index 00000000..32a0ee13
--- /dev/null
+++ b/docs/src/assets/bulma/elements/notification.sass
@@ -0,0 +1,43 @@
+$notification-background-color: $background !default
+$notification-code-background-color: $scheme-main !default
+$notification-radius: $radius !default
+$notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default
+
+.notification
+ @extend %block
+ background-color: $notification-background-color
+ border-radius: $notification-radius
+ padding: $notification-padding
+ position: relative
+ a:not(.button):not(.dropdown-item)
+ color: currentColor
+ text-decoration: underline
+ strong
+ color: currentColor
+ code,
+ pre
+ background: $notification-code-background-color
+ pre code
+ background: transparent
+ & > .delete
+ position: absolute
+ right: 0.5rem
+ top: 0.5rem
+ .title,
+ .subtitle,
+ .content
+ color: currentColor
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ color: $color-invert
+ // If light and dark colors are provided
+ @if length($pair) >= 4
+ $color-light: nth($pair, 3)
+ $color-dark: nth($pair, 4)
+ &.is-light
+ background-color: $color-light
+ color: $color-dark
diff --git a/docs/src/assets/bulma/elements/other.sass b/docs/src/assets/bulma/elements/other.sass
new file mode 100644
index 00000000..5725617c
--- /dev/null
+++ b/docs/src/assets/bulma/elements/other.sass
@@ -0,0 +1,39 @@
+.block
+ @extend %block
+
+.delete
+ @extend %delete
+
+.heading
+ display: block
+ font-size: 11px
+ letter-spacing: 1px
+ margin-bottom: 5px
+ text-transform: uppercase
+
+.highlight
+ @extend %block
+ font-weight: $weight-normal
+ max-width: 100%
+ overflow: hidden
+ padding: 0
+ pre
+ overflow: auto
+ max-width: 100%
+
+.loader
+ @extend %loader
+
+.number
+ align-items: center
+ background-color: $background
+ border-radius: $radius-rounded
+ display: inline-flex
+ font-size: $size-medium
+ height: 2em
+ justify-content: center
+ margin-right: 1.5rem
+ min-width: 2.5em
+ padding: 0.25rem 0.5rem
+ text-align: center
+ vertical-align: top
diff --git a/docs/src/assets/bulma/elements/progress.sass b/docs/src/assets/bulma/elements/progress.sass
new file mode 100644
index 00000000..bb43bb60
--- /dev/null
+++ b/docs/src/assets/bulma/elements/progress.sass
@@ -0,0 +1,67 @@
+$progress-bar-background-color: $border-light !default
+$progress-value-background-color: $text !default
+$progress-border-radius: $radius-rounded !default
+
+$progress-indeterminate-duration: 1.5s !default
+
+.progress
+ @extend %block
+ -moz-appearance: none
+ -webkit-appearance: none
+ border: none
+ border-radius: $progress-border-radius
+ display: block
+ height: $size-normal
+ overflow: hidden
+ padding: 0
+ width: 100%
+ &::-webkit-progress-bar
+ background-color: $progress-bar-background-color
+ &::-webkit-progress-value
+ background-color: $progress-value-background-color
+ &::-moz-progress-bar
+ background-color: $progress-value-background-color
+ &::-ms-fill
+ background-color: $progress-value-background-color
+ border: none
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ &.is-#{$name}
+ &::-webkit-progress-value
+ background-color: $color
+ &::-moz-progress-bar
+ background-color: $color
+ &::-ms-fill
+ background-color: $color
+ &:indeterminate
+ background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
+
+ &:indeterminate
+ animation-duration: $progress-indeterminate-duration
+ animation-iteration-count: infinite
+ animation-name: moveIndeterminate
+ animation-timing-function: linear
+ background-color: $progress-bar-background-color
+ background-image: linear-gradient(to right, $text 30%, $progress-bar-background-color 30%)
+ background-position: top left
+ background-repeat: no-repeat
+ background-size: 150% 150%
+ &::-webkit-progress-bar
+ background-color: transparent
+ &::-moz-progress-bar
+ background-color: transparent
+
+ // Sizes
+ &.is-small
+ height: $size-small
+ &.is-medium
+ height: $size-medium
+ &.is-large
+ height: $size-large
+
+@keyframes moveIndeterminate
+ from
+ background-position: 200% 0
+ to
+ background-position: -200% 0
diff --git a/docs/src/assets/bulma/elements/table.sass b/docs/src/assets/bulma/elements/table.sass
new file mode 100644
index 00000000..2e6036ad
--- /dev/null
+++ b/docs/src/assets/bulma/elements/table.sass
@@ -0,0 +1,127 @@
+$table-color: $text-strong !default
+$table-background-color: $scheme-main !default
+
+$table-cell-border: 1px solid $border !default
+$table-cell-border-width: 0 0 1px !default
+$table-cell-padding: 0.5em 0.75em !default
+$table-cell-heading-color: $text-strong !default
+
+$table-head-cell-border-width: 0 0 2px !default
+$table-head-cell-color: $text-strong !default
+$table-foot-cell-border-width: 2px 0 0 !default
+$table-foot-cell-color: $text-strong !default
+
+$table-head-background-color: transparent !default
+$table-body-background-color: transparent !default
+$table-foot-background-color: transparent !default
+
+$table-row-hover-background-color: $scheme-main-bis !default
+
+$table-row-active-background-color: $primary !default
+$table-row-active-color: $primary-invert !default
+
+$table-striped-row-even-background-color: $scheme-main-bis !default
+$table-striped-row-even-hover-background-color: $scheme-main-ter !default
+
+.table
+ @extend %block
+ background-color: $table-background-color
+ color: $table-color
+ td,
+ th
+ border: $table-cell-border
+ border-width: $table-cell-border-width
+ padding: $table-cell-padding
+ vertical-align: top
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ border-color: $color
+ color: $color-invert
+ // Modifiers
+ &.is-narrow
+ white-space: nowrap
+ width: 1%
+ &.is-selected
+ background-color: $table-row-active-background-color
+ color: $table-row-active-color
+ a,
+ strong
+ color: currentColor
+ th
+ color: $table-cell-heading-color
+ &:not([align])
+ text-align: left
+ tr
+ &.is-selected
+ background-color: $table-row-active-background-color
+ color: $table-row-active-color
+ a,
+ strong
+ color: currentColor
+ td,
+ th
+ border-color: $table-row-active-color
+ color: currentColor
+ thead
+ background-color: $table-head-background-color
+ td,
+ th
+ border-width: $table-head-cell-border-width
+ color: $table-head-cell-color
+ tfoot
+ background-color: $table-foot-background-color
+ td,
+ th
+ border-width: $table-foot-cell-border-width
+ color: $table-foot-cell-color
+ tbody
+ background-color: $table-body-background-color
+ tr
+ &:last-child
+ td,
+ th
+ border-bottom-width: 0
+ // Modifiers
+ &.is-bordered
+ td,
+ th
+ border-width: 1px
+ tr
+ &:last-child
+ td,
+ th
+ border-bottom-width: 1px
+ &.is-fullwidth
+ width: 100%
+ &.is-hoverable
+ tbody
+ tr:not(.is-selected)
+ &:hover
+ background-color: $table-row-hover-background-color
+ &.is-striped
+ tbody
+ tr:not(.is-selected)
+ &:hover
+ background-color: $table-row-hover-background-color
+ &:nth-child(even)
+ background-color: $table-striped-row-even-hover-background-color
+ &.is-narrow
+ td,
+ th
+ padding: 0.25em 0.5em
+ &.is-striped
+ tbody
+ tr:not(.is-selected)
+ &:nth-child(even)
+ background-color: $table-striped-row-even-background-color
+
+.table-container
+ @extend %block
+ +overflow-touch
+ overflow: auto
+ overflow-y: hidden
+ max-width: 100%
diff --git a/docs/src/assets/bulma/elements/tag.sass b/docs/src/assets/bulma/elements/tag.sass
new file mode 100644
index 00000000..e0fb89ef
--- /dev/null
+++ b/docs/src/assets/bulma/elements/tag.sass
@@ -0,0 +1,128 @@
+$tag-background-color: $background !default
+$tag-color: $text !default
+$tag-radius: $radius !default
+$tag-delete-margin: 1px !default
+
+.tags
+ align-items: center
+ display: flex
+ flex-wrap: wrap
+ justify-content: flex-start
+ .tag
+ margin-bottom: 0.5rem
+ &:not(:last-child)
+ margin-right: 0.5rem
+ &:last-child
+ margin-bottom: -0.5rem
+ &:not(:last-child)
+ margin-bottom: 1rem
+ // Sizes
+ &.are-medium
+ .tag:not(.is-normal):not(.is-large)
+ font-size: $size-normal
+ &.are-large
+ .tag:not(.is-normal):not(.is-medium)
+ font-size: $size-medium
+ &.is-centered
+ justify-content: center
+ .tag
+ margin-right: 0.25rem
+ margin-left: 0.25rem
+ &.is-right
+ justify-content: flex-end
+ .tag
+ &:not(:first-child)
+ margin-left: 0.5rem
+ &:not(:last-child)
+ margin-right: 0
+ &.has-addons
+ .tag
+ margin-right: 0
+ &:not(:first-child)
+ margin-left: 0
+ border-bottom-left-radius: 0
+ border-top-left-radius: 0
+ &:not(:last-child)
+ border-bottom-right-radius: 0
+ border-top-right-radius: 0
+
+.tag:not(body)
+ align-items: center
+ background-color: $tag-background-color
+ border-radius: $tag-radius
+ color: $tag-color
+ display: inline-flex
+ font-size: $size-small
+ height: 2em
+ justify-content: center
+ line-height: 1.5
+ padding-left: 0.75em
+ padding-right: 0.75em
+ white-space: nowrap
+ .delete
+ margin-left: 0.25rem
+ margin-right: -0.375rem
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ color: $color-invert
+ // If a light and dark colors are provided
+ @if length($pair) > 3
+ $color-light: nth($pair, 3)
+ $color-dark: nth($pair, 4)
+ &.is-light
+ background-color: $color-light
+ color: $color-dark
+ // Sizes
+ &.is-normal
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-normal
+ &.is-large
+ font-size: $size-medium
+ .icon
+ &:first-child:not(:last-child)
+ margin-left: -0.375em
+ margin-right: 0.1875em
+ &:last-child:not(:first-child)
+ margin-left: 0.1875em
+ margin-right: -0.375em
+ &:first-child:last-child
+ margin-left: -0.375em
+ margin-right: -0.375em
+ // Modifiers
+ &.is-delete
+ margin-left: $tag-delete-margin
+ padding: 0
+ position: relative
+ width: 2em
+ &::before,
+ &::after
+ background-color: currentColor
+ content: ""
+ display: block
+ left: 50%
+ position: absolute
+ top: 50%
+ transform: translateX(-50%) translateY(-50%) rotate(45deg)
+ transform-origin: center center
+ &::before
+ height: 1px
+ width: 50%
+ &::after
+ height: 50%
+ width: 1px
+ &:hover,
+ &:focus
+ background-color: darken($tag-background-color, 5%)
+ &:active
+ background-color: darken($tag-background-color, 10%)
+ &.is-rounded
+ border-radius: $radius-rounded
+
+a.tag
+ &:hover
+ text-decoration: underline
diff --git a/docs/src/assets/bulma/elements/title.sass b/docs/src/assets/bulma/elements/title.sass
new file mode 100644
index 00000000..fa9947dd
--- /dev/null
+++ b/docs/src/assets/bulma/elements/title.sass
@@ -0,0 +1,70 @@
+$title-color: $text-strong !default
+$title-family: false !default
+$title-size: $size-3 !default
+$title-weight: $weight-semibold !default
+$title-line-height: 1.125 !default
+$title-strong-color: inherit !default
+$title-strong-weight: inherit !default
+$title-sub-size: 0.75em !default
+$title-sup-size: 0.75em !default
+
+$subtitle-color: $text !default
+$subtitle-family: false !default
+$subtitle-size: $size-5 !default
+$subtitle-weight: $weight-normal !default
+$subtitle-line-height: 1.25 !default
+$subtitle-strong-color: $text-strong !default
+$subtitle-strong-weight: $weight-semibold !default
+$subtitle-negative-margin: -1.25rem !default
+
+.title,
+.subtitle
+ @extend %block
+ word-break: break-word
+ em,
+ span
+ font-weight: inherit
+ sub
+ font-size: $title-sub-size
+ sup
+ font-size: $title-sup-size
+ .tag
+ vertical-align: middle
+
+.title
+ color: $title-color
+ @if $title-family
+ font-family: $title-family
+ font-size: $title-size
+ font-weight: $title-weight
+ line-height: $title-line-height
+ strong
+ color: $title-strong-color
+ font-weight: $title-strong-weight
+ & + .highlight
+ margin-top: -0.75rem
+ &:not(.is-spaced) + .subtitle
+ margin-top: $subtitle-negative-margin
+ // Sizes
+ @each $size in $sizes
+ $i: index($sizes, $size)
+ &.is-#{$i}
+ font-size: $size
+
+.subtitle
+ color: $subtitle-color
+ @if $subtitle-family
+ font-family: $subtitle-family
+ font-size: $subtitle-size
+ font-weight: $subtitle-weight
+ line-height: $subtitle-line-height
+ strong
+ color: $subtitle-strong-color
+ font-weight: $subtitle-strong-weight
+ &:not(.is-spaced) + .title
+ margin-top: $subtitle-negative-margin
+ // Sizes
+ @each $size in $sizes
+ $i: index($sizes, $size)
+ &.is-#{$i}
+ font-size: $size
diff --git a/docs/src/assets/bulma/form/_all.sass b/docs/src/assets/bulma/form/_all.sass
new file mode 100644
index 00000000..d9a2b955
--- /dev/null
+++ b/docs/src/assets/bulma/form/_all.sass
@@ -0,0 +1,8 @@
+@charset "utf-8"
+
+@import "shared.sass"
+@import "input-textarea.sass"
+@import "checkbox-radio.sass"
+@import "select.sass"
+@import "file.sass"
+@import "tools.sass"
diff --git a/docs/src/assets/bulma/form/checkbox-radio.sass b/docs/src/assets/bulma/form/checkbox-radio.sass
new file mode 100644
index 00000000..d9f3ff0c
--- /dev/null
+++ b/docs/src/assets/bulma/form/checkbox-radio.sass
@@ -0,0 +1,21 @@
+%checkbox-radio
+ cursor: pointer
+ display: inline-block
+ line-height: 1.25
+ position: relative
+ input
+ cursor: pointer
+ &:hover
+ color: $input-hover-color
+ &[disabled],
+ fieldset[disabled] &
+ color: $input-disabled-color
+ cursor: not-allowed
+
+.checkbox
+ @extend %checkbox-radio
+
+.radio
+ @extend %checkbox-radio
+ & + .radio
+ margin-left: 0.5em
diff --git a/docs/src/assets/bulma/form/file.sass b/docs/src/assets/bulma/form/file.sass
new file mode 100644
index 00000000..41cc0215
--- /dev/null
+++ b/docs/src/assets/bulma/form/file.sass
@@ -0,0 +1,180 @@
+$file-border-color: $border !default
+$file-radius: $radius !default
+
+$file-cta-background-color: $scheme-main-ter !default
+$file-cta-color: $text !default
+$file-cta-hover-color: $text-strong !default
+$file-cta-active-color: $text-strong !default
+
+$file-name-border-color: $border !default
+$file-name-border-style: solid !default
+$file-name-border-width: 1px 1px 1px 0 !default
+$file-name-max-width: 16em !default
+
+.file
+ @extend %unselectable
+ align-items: stretch
+ display: flex
+ justify-content: flex-start
+ position: relative
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ .file-cta
+ background-color: $color
+ border-color: transparent
+ color: $color-invert
+ &:hover,
+ &.is-hovered
+ .file-cta
+ background-color: darken($color, 2.5%)
+ border-color: transparent
+ color: $color-invert
+ &:focus,
+ &.is-focused
+ .file-cta
+ border-color: transparent
+ box-shadow: 0 0 0.5em rgba($color, 0.25)
+ color: $color-invert
+ &:active,
+ &.is-active
+ .file-cta
+ background-color: darken($color, 5%)
+ border-color: transparent
+ color: $color-invert
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ .file-icon
+ .fa
+ font-size: 21px
+ &.is-large
+ font-size: $size-large
+ .file-icon
+ .fa
+ font-size: 28px
+ // Modifiers
+ &.has-name
+ .file-cta
+ border-bottom-right-radius: 0
+ border-top-right-radius: 0
+ .file-name
+ border-bottom-left-radius: 0
+ border-top-left-radius: 0
+ &.is-empty
+ .file-cta
+ border-radius: $file-radius
+ .file-name
+ display: none
+ &.is-boxed
+ .file-label
+ flex-direction: column
+ .file-cta
+ flex-direction: column
+ height: auto
+ padding: 1em 3em
+ .file-name
+ border-width: 0 1px 1px
+ .file-icon
+ height: 1.5em
+ width: 1.5em
+ .fa
+ font-size: 21px
+ &.is-small
+ .file-icon .fa
+ font-size: 14px
+ &.is-medium
+ .file-icon .fa
+ font-size: 28px
+ &.is-large
+ .file-icon .fa
+ font-size: 35px
+ &.has-name
+ .file-cta
+ border-radius: $file-radius $file-radius 0 0
+ .file-name
+ border-radius: 0 0 $file-radius $file-radius
+ border-width: 0 1px 1px
+ &.is-centered
+ justify-content: center
+ &.is-fullwidth
+ .file-label
+ width: 100%
+ .file-name
+ flex-grow: 1
+ max-width: none
+ &.is-right
+ justify-content: flex-end
+ .file-cta
+ border-radius: 0 $file-radius $file-radius 0
+ .file-name
+ border-radius: $file-radius 0 0 $file-radius
+ border-width: 1px 0 1px 1px
+ order: -1
+
+.file-label
+ align-items: stretch
+ display: flex
+ cursor: pointer
+ justify-content: flex-start
+ overflow: hidden
+ position: relative
+ &:hover
+ .file-cta
+ background-color: darken($file-cta-background-color, 2.5%)
+ color: $file-cta-hover-color
+ .file-name
+ border-color: darken($file-name-border-color, 2.5%)
+ &:active
+ .file-cta
+ background-color: darken($file-cta-background-color, 5%)
+ color: $file-cta-active-color
+ .file-name
+ border-color: darken($file-name-border-color, 5%)
+
+.file-input
+ height: 100%
+ left: 0
+ opacity: 0
+ outline: none
+ position: absolute
+ top: 0
+ width: 100%
+
+.file-cta,
+.file-name
+ @extend %control
+ border-color: $file-border-color
+ border-radius: $file-radius
+ font-size: 1em
+ padding-left: 1em
+ padding-right: 1em
+ white-space: nowrap
+
+.file-cta
+ background-color: $file-cta-background-color
+ color: $file-cta-color
+
+.file-name
+ border-color: $file-name-border-color
+ border-style: $file-name-border-style
+ border-width: $file-name-border-width
+ display: block
+ max-width: $file-name-max-width
+ overflow: hidden
+ text-align: left
+ text-overflow: ellipsis
+
+.file-icon
+ align-items: center
+ display: flex
+ height: 1em
+ justify-content: center
+ margin-right: 0.5em
+ width: 1em
+ .fa
+ font-size: 14px
diff --git a/docs/src/assets/bulma/form/input-textarea.sass b/docs/src/assets/bulma/form/input-textarea.sass
new file mode 100644
index 00000000..7636cdae
--- /dev/null
+++ b/docs/src/assets/bulma/form/input-textarea.sass
@@ -0,0 +1,64 @@
+$textarea-padding: $control-padding-horizontal !default
+$textarea-max-height: 40em !default
+$textarea-min-height: 8em !default
+
+%input-textarea
+ @extend %input
+ box-shadow: $input-shadow
+ max-width: 100%
+ width: 100%
+ &[readonly]
+ box-shadow: none
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ &.is-#{$name}
+ border-color: $color
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active
+ box-shadow: $input-focus-box-shadow-size rgba($color, 0.25)
+ // Sizes
+ &.is-small
+ +control-small
+ &.is-medium
+ +control-medium
+ &.is-large
+ +control-large
+ // Modifiers
+ &.is-fullwidth
+ display: block
+ width: 100%
+ &.is-inline
+ display: inline
+ width: auto
+
+.input
+ @extend %input-textarea
+ &.is-rounded
+ border-radius: $radius-rounded
+ padding-left: calc(#{$control-padding-horizontal} + 0.375em)
+ padding-right: calc(#{$control-padding-horizontal} + 0.375em)
+ &.is-static
+ background-color: transparent
+ border-color: transparent
+ box-shadow: none
+ padding-left: 0
+ padding-right: 0
+
+.textarea
+ @extend %input-textarea
+ display: block
+ max-width: 100%
+ min-width: 100%
+ padding: $textarea-padding
+ resize: vertical
+ &:not([rows])
+ max-height: $textarea-max-height
+ min-height: $textarea-min-height
+ &[rows]
+ height: initial
+ // Modifiers
+ &.has-fixed-size
+ resize: none
diff --git a/docs/src/assets/bulma/form/select.sass b/docs/src/assets/bulma/form/select.sass
new file mode 100644
index 00000000..909b9d52
--- /dev/null
+++ b/docs/src/assets/bulma/form/select.sass
@@ -0,0 +1,85 @@
+.select
+ display: inline-block
+ max-width: 100%
+ position: relative
+ vertical-align: top
+ &:not(.is-multiple)
+ height: $input-height
+ &:not(.is-multiple):not(.is-loading)
+ &::after
+ @extend %arrow
+ border-color: $input-arrow
+ right: 1.125em
+ z-index: 4
+ &.is-rounded
+ select
+ border-radius: $radius-rounded
+ padding-left: 1em
+ select
+ @extend %input
+ cursor: pointer
+ display: block
+ font-size: 1em
+ max-width: 100%
+ outline: none
+ &::-ms-expand
+ display: none
+ &[disabled]:hover,
+ fieldset[disabled] &:hover
+ border-color: $input-disabled-border-color
+ &:not([multiple])
+ padding-right: 2.5em
+ &[multiple]
+ height: auto
+ padding: 0
+ option
+ padding: 0.5em 1em
+ // States
+ &:not(.is-multiple):not(.is-loading):hover
+ &::after
+ border-color: $input-hover-color
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ &.is-#{$name}
+ &:not(:hover)::after
+ border-color: $color
+ select
+ border-color: $color
+ &:hover,
+ &.is-hovered
+ border-color: darken($color, 5%)
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active
+ box-shadow: $input-focus-box-shadow-size rgba($color, 0.25)
+ // Sizes
+ &.is-small
+ +control-small
+ &.is-medium
+ +control-medium
+ &.is-large
+ +control-large
+ // Modifiers
+ &.is-disabled
+ &::after
+ border-color: $input-disabled-color
+ &.is-fullwidth
+ width: 100%
+ select
+ width: 100%
+ &.is-loading
+ &::after
+ @extend %loader
+ margin-top: 0
+ position: absolute
+ right: 0.625em
+ top: 0.625em
+ transform: none
+ &.is-small:after
+ font-size: $size-small
+ &.is-medium:after
+ font-size: $size-medium
+ &.is-large:after
+ font-size: $size-large
diff --git a/docs/src/assets/bulma/form/shared.sass b/docs/src/assets/bulma/form/shared.sass
new file mode 100644
index 00000000..3005587e
--- /dev/null
+++ b/docs/src/assets/bulma/form/shared.sass
@@ -0,0 +1,55 @@
+$input-color: inherit !default
+$input-background-color: $scheme-main !default
+$input-border-color: $border !default
+$input-height: $control-height !default
+$input-shadow: inset 0 0.0625em 0.125em rgba($scheme-invert, 0.05) !default
+$input-placeholder-color: bulmaRgba($input-color, 0.3) !default
+
+$input-hover-color: $text-strong !default
+$input-hover-border-color: $border-hover !default
+
+$input-focus-color: $text-strong !default
+$input-focus-border-color: $link !default
+$input-focus-box-shadow-size: 0 0 0 0.125em !default
+$input-focus-box-shadow-color: bulmaRgba($link, 0.25) !default
+
+$input-disabled-color: $text-light !default
+$input-disabled-background-color: $background !default
+$input-disabled-border-color: $background !default
+$input-disabled-placeholder-color: bulmaRgba($input-disabled-color, 0.3) !default
+
+$input-arrow: $link !default
+
+$input-icon-color: $border !default
+$input-icon-active-color: $text !default
+
+$input-radius: $radius !default
+
+=input
+ @extend %control
+ background-color: $input-background-color
+ border-color: $input-border-color
+ border-radius: $input-radius
+ color: $input-color
+ +placeholder
+ color: $input-placeholder-color
+ &:hover,
+ &.is-hovered
+ border-color: $input-hover-border-color
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active
+ border-color: $input-focus-border-color
+ box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color
+ &[disabled],
+ fieldset[disabled] &
+ background-color: $input-disabled-background-color
+ border-color: $input-disabled-border-color
+ box-shadow: none
+ color: $input-disabled-color
+ +placeholder
+ color: $input-disabled-placeholder-color
+
+%input
+ +input
diff --git a/docs/src/assets/bulma/form/tools.sass b/docs/src/assets/bulma/form/tools.sass
new file mode 100644
index 00000000..ff2f8e20
--- /dev/null
+++ b/docs/src/assets/bulma/form/tools.sass
@@ -0,0 +1,205 @@
+$label-color: $text-strong !default
+$label-weight: $weight-bold !default
+
+$help-size: $size-small !default
+
+.label
+ color: $label-color
+ display: block
+ font-size: $size-normal
+ font-weight: $label-weight
+ &:not(:last-child)
+ margin-bottom: 0.5em
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large
+
+.help
+ display: block
+ font-size: $help-size
+ margin-top: 0.25rem
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ &.is-#{$name}
+ color: $color
+
+// Containers
+
+.field
+ &:not(:last-child)
+ margin-bottom: 0.75rem
+ // Modifiers
+ &.has-addons
+ display: flex
+ justify-content: flex-start
+ .control
+ &:not(:last-child)
+ margin-right: -1px
+ &:not(:first-child):not(:last-child)
+ .button,
+ .input,
+ .select select
+ border-radius: 0
+ &:first-child:not(:only-child)
+ .button,
+ .input,
+ .select select
+ border-bottom-right-radius: 0
+ border-top-right-radius: 0
+ &:last-child:not(:only-child)
+ .button,
+ .input,
+ .select select
+ border-bottom-left-radius: 0
+ border-top-left-radius: 0
+ .button,
+ .input,
+ .select select
+ &:not([disabled])
+ &:hover,
+ &.is-hovered
+ z-index: 2
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active
+ z-index: 3
+ &:hover
+ z-index: 4
+ &.is-expanded
+ flex-grow: 1
+ flex-shrink: 1
+ &.has-addons-centered
+ justify-content: center
+ &.has-addons-right
+ justify-content: flex-end
+ &.has-addons-fullwidth
+ .control
+ flex-grow: 1
+ flex-shrink: 0
+ &.is-grouped
+ display: flex
+ justify-content: flex-start
+ & > .control
+ flex-shrink: 0
+ &:not(:last-child)
+ margin-bottom: 0
+ margin-right: 0.75rem
+ &.is-expanded
+ flex-grow: 1
+ flex-shrink: 1
+ &.is-grouped-centered
+ justify-content: center
+ &.is-grouped-right
+ justify-content: flex-end
+ &.is-grouped-multiline
+ flex-wrap: wrap
+ & > .control
+ &:last-child,
+ &:not(:last-child)
+ margin-bottom: 0.75rem
+ &:last-child
+ margin-bottom: -0.75rem
+ &:not(:last-child)
+ margin-bottom: 0
+ &.is-horizontal
+ +tablet
+ display: flex
+
+.field-label
+ .label
+ font-size: inherit
+ +mobile
+ margin-bottom: 0.5rem
+ +tablet
+ flex-basis: 0
+ flex-grow: 1
+ flex-shrink: 0
+ margin-right: 1.5rem
+ text-align: right
+ &.is-small
+ font-size: $size-small
+ padding-top: 0.375em
+ &.is-normal
+ padding-top: 0.375em
+ &.is-medium
+ font-size: $size-medium
+ padding-top: 0.375em
+ &.is-large
+ font-size: $size-large
+ padding-top: 0.375em
+
+.field-body
+ .field .field
+ margin-bottom: 0
+ +tablet
+ display: flex
+ flex-basis: 0
+ flex-grow: 5
+ flex-shrink: 1
+ .field
+ margin-bottom: 0
+ & > .field
+ flex-shrink: 1
+ &:not(.is-narrow)
+ flex-grow: 1
+ &:not(:last-child)
+ margin-right: 0.75rem
+
+.control
+ box-sizing: border-box
+ clear: both
+ font-size: $size-normal
+ position: relative
+ text-align: left
+ // Modifiers
+ &.has-icons-left,
+ &.has-icons-right
+ .input,
+ .select
+ &:focus
+ & ~ .icon
+ color: $input-icon-active-color
+ &.is-small ~ .icon
+ font-size: $size-small
+ &.is-medium ~ .icon
+ font-size: $size-medium
+ &.is-large ~ .icon
+ font-size: $size-large
+ .icon
+ color: $input-icon-color
+ height: $input-height
+ pointer-events: none
+ position: absolute
+ top: 0
+ width: $input-height
+ z-index: 4
+ &.has-icons-left
+ .input,
+ .select select
+ padding-left: $input-height
+ .icon.is-left
+ left: 0
+ &.has-icons-right
+ .input,
+ .select select
+ padding-right: $input-height
+ .icon.is-right
+ right: 0
+ &.is-loading
+ &::after
+ @extend %loader
+ position: absolute !important
+ right: 0.625em
+ top: 0.625em
+ z-index: 4
+ &.is-small:after
+ font-size: $size-small
+ &.is-medium:after
+ font-size: $size-medium
+ &.is-large:after
+ font-size: $size-large
diff --git a/docs/src/assets/bulma/grid/_all.sass b/docs/src/assets/bulma/grid/_all.sass
new file mode 100644
index 00000000..e53070f6
--- /dev/null
+++ b/docs/src/assets/bulma/grid/_all.sass
@@ -0,0 +1,4 @@
+@charset "utf-8"
+
+@import "columns.sass"
+@import "tiles.sass"
diff --git a/docs/src/assets/bulma/grid/columns.sass b/docs/src/assets/bulma/grid/columns.sass
new file mode 100644
index 00000000..34a83533
--- /dev/null
+++ b/docs/src/assets/bulma/grid/columns.sass
@@ -0,0 +1,504 @@
+$column-gap: 0.75rem !default
+
+.column
+ display: block
+ flex-basis: 0
+ flex-grow: 1
+ flex-shrink: 1
+ padding: $column-gap
+ .columns.is-mobile > &.is-narrow
+ flex: none
+ .columns.is-mobile > &.is-full
+ flex: none
+ width: 100%
+ .columns.is-mobile > &.is-three-quarters
+ flex: none
+ width: 75%
+ .columns.is-mobile > &.is-two-thirds
+ flex: none
+ width: 66.6666%
+ .columns.is-mobile > &.is-half
+ flex: none
+ width: 50%
+ .columns.is-mobile > &.is-one-third
+ flex: none
+ width: 33.3333%
+ .columns.is-mobile > &.is-one-quarter
+ flex: none
+ width: 25%
+ .columns.is-mobile > &.is-one-fifth
+ flex: none
+ width: 20%
+ .columns.is-mobile > &.is-two-fifths
+ flex: none
+ width: 40%
+ .columns.is-mobile > &.is-three-fifths
+ flex: none
+ width: 60%
+ .columns.is-mobile > &.is-four-fifths
+ flex: none
+ width: 80%
+ .columns.is-mobile > &.is-offset-three-quarters
+ margin-left: 75%
+ .columns.is-mobile > &.is-offset-two-thirds
+ margin-left: 66.6666%
+ .columns.is-mobile > &.is-offset-half
+ margin-left: 50%
+ .columns.is-mobile > &.is-offset-one-third
+ margin-left: 33.3333%
+ .columns.is-mobile > &.is-offset-one-quarter
+ margin-left: 25%
+ .columns.is-mobile > &.is-offset-one-fifth
+ margin-left: 20%
+ .columns.is-mobile > &.is-offset-two-fifths
+ margin-left: 40%
+ .columns.is-mobile > &.is-offset-three-fifths
+ margin-left: 60%
+ .columns.is-mobile > &.is-offset-four-fifths
+ margin-left: 80%
+ @for $i from 0 through 12
+ .columns.is-mobile > &.is-#{$i}
+ flex: none
+ width: percentage($i / 12)
+ .columns.is-mobile > &.is-offset-#{$i}
+ margin-left: percentage($i / 12)
+ +mobile
+ &.is-narrow-mobile
+ flex: none
+ &.is-full-mobile
+ flex: none
+ width: 100%
+ &.is-three-quarters-mobile
+ flex: none
+ width: 75%
+ &.is-two-thirds-mobile
+ flex: none
+ width: 66.6666%
+ &.is-half-mobile
+ flex: none
+ width: 50%
+ &.is-one-third-mobile
+ flex: none
+ width: 33.3333%
+ &.is-one-quarter-mobile
+ flex: none
+ width: 25%
+ &.is-one-fifth-mobile
+ flex: none
+ width: 20%
+ &.is-two-fifths-mobile
+ flex: none
+ width: 40%
+ &.is-three-fifths-mobile
+ flex: none
+ width: 60%
+ &.is-four-fifths-mobile
+ flex: none
+ width: 80%
+ &.is-offset-three-quarters-mobile
+ margin-left: 75%
+ &.is-offset-two-thirds-mobile
+ margin-left: 66.6666%
+ &.is-offset-half-mobile
+ margin-left: 50%
+ &.is-offset-one-third-mobile
+ margin-left: 33.3333%
+ &.is-offset-one-quarter-mobile
+ margin-left: 25%
+ &.is-offset-one-fifth-mobile
+ margin-left: 20%
+ &.is-offset-two-fifths-mobile
+ margin-left: 40%
+ &.is-offset-three-fifths-mobile
+ margin-left: 60%
+ &.is-offset-four-fifths-mobile
+ margin-left: 80%
+ @for $i from 0 through 12
+ &.is-#{$i}-mobile
+ flex: none
+ width: percentage($i / 12)
+ &.is-offset-#{$i}-mobile
+ margin-left: percentage($i / 12)
+ +tablet
+ &.is-narrow,
+ &.is-narrow-tablet
+ flex: none
+ &.is-full,
+ &.is-full-tablet
+ flex: none
+ width: 100%
+ &.is-three-quarters,
+ &.is-three-quarters-tablet
+ flex: none
+ width: 75%
+ &.is-two-thirds,
+ &.is-two-thirds-tablet
+ flex: none
+ width: 66.6666%
+ &.is-half,
+ &.is-half-tablet
+ flex: none
+ width: 50%
+ &.is-one-third,
+ &.is-one-third-tablet
+ flex: none
+ width: 33.3333%
+ &.is-one-quarter,
+ &.is-one-quarter-tablet
+ flex: none
+ width: 25%
+ &.is-one-fifth,
+ &.is-one-fifth-tablet
+ flex: none
+ width: 20%
+ &.is-two-fifths,
+ &.is-two-fifths-tablet
+ flex: none
+ width: 40%
+ &.is-three-fifths,
+ &.is-three-fifths-tablet
+ flex: none
+ width: 60%
+ &.is-four-fifths,
+ &.is-four-fifths-tablet
+ flex: none
+ width: 80%
+ &.is-offset-three-quarters,
+ &.is-offset-three-quarters-tablet
+ margin-left: 75%
+ &.is-offset-two-thirds,
+ &.is-offset-two-thirds-tablet
+ margin-left: 66.6666%
+ &.is-offset-half,
+ &.is-offset-half-tablet
+ margin-left: 50%
+ &.is-offset-one-third,
+ &.is-offset-one-third-tablet
+ margin-left: 33.3333%
+ &.is-offset-one-quarter,
+ &.is-offset-one-quarter-tablet
+ margin-left: 25%
+ &.is-offset-one-fifth,
+ &.is-offset-one-fifth-tablet
+ margin-left: 20%
+ &.is-offset-two-fifths,
+ &.is-offset-two-fifths-tablet
+ margin-left: 40%
+ &.is-offset-three-fifths,
+ &.is-offset-three-fifths-tablet
+ margin-left: 60%
+ &.is-offset-four-fifths,
+ &.is-offset-four-fifths-tablet
+ margin-left: 80%
+ @for $i from 0 through 12
+ &.is-#{$i},
+ &.is-#{$i}-tablet
+ flex: none
+ width: percentage($i / 12)
+ &.is-offset-#{$i},
+ &.is-offset-#{$i}-tablet
+ margin-left: percentage($i / 12)
+ +touch
+ &.is-narrow-touch
+ flex: none
+ &.is-full-touch
+ flex: none
+ width: 100%
+ &.is-three-quarters-touch
+ flex: none
+ width: 75%
+ &.is-two-thirds-touch
+ flex: none
+ width: 66.6666%
+ &.is-half-touch
+ flex: none
+ width: 50%
+ &.is-one-third-touch
+ flex: none
+ width: 33.3333%
+ &.is-one-quarter-touch
+ flex: none
+ width: 25%
+ &.is-one-fifth-touch
+ flex: none
+ width: 20%
+ &.is-two-fifths-touch
+ flex: none
+ width: 40%
+ &.is-three-fifths-touch
+ flex: none
+ width: 60%
+ &.is-four-fifths-touch
+ flex: none
+ width: 80%
+ &.is-offset-three-quarters-touch
+ margin-left: 75%
+ &.is-offset-two-thirds-touch
+ margin-left: 66.6666%
+ &.is-offset-half-touch
+ margin-left: 50%
+ &.is-offset-one-third-touch
+ margin-left: 33.3333%
+ &.is-offset-one-quarter-touch
+ margin-left: 25%
+ &.is-offset-one-fifth-touch
+ margin-left: 20%
+ &.is-offset-two-fifths-touch
+ margin-left: 40%
+ &.is-offset-three-fifths-touch
+ margin-left: 60%
+ &.is-offset-four-fifths-touch
+ margin-left: 80%
+ @for $i from 0 through 12
+ &.is-#{$i}-touch
+ flex: none
+ width: percentage($i / 12)
+ &.is-offset-#{$i}-touch
+ margin-left: percentage($i / 12)
+ +desktop
+ &.is-narrow-desktop
+ flex: none
+ &.is-full-desktop
+ flex: none
+ width: 100%
+ &.is-three-quarters-desktop
+ flex: none
+ width: 75%
+ &.is-two-thirds-desktop
+ flex: none
+ width: 66.6666%
+ &.is-half-desktop
+ flex: none
+ width: 50%
+ &.is-one-third-desktop
+ flex: none
+ width: 33.3333%
+ &.is-one-quarter-desktop
+ flex: none
+ width: 25%
+ &.is-one-fifth-desktop
+ flex: none
+ width: 20%
+ &.is-two-fifths-desktop
+ flex: none
+ width: 40%
+ &.is-three-fifths-desktop
+ flex: none
+ width: 60%
+ &.is-four-fifths-desktop
+ flex: none
+ width: 80%
+ &.is-offset-three-quarters-desktop
+ margin-left: 75%
+ &.is-offset-two-thirds-desktop
+ margin-left: 66.6666%
+ &.is-offset-half-desktop
+ margin-left: 50%
+ &.is-offset-one-third-desktop
+ margin-left: 33.3333%
+ &.is-offset-one-quarter-desktop
+ margin-left: 25%
+ &.is-offset-one-fifth-desktop
+ margin-left: 20%
+ &.is-offset-two-fifths-desktop
+ margin-left: 40%
+ &.is-offset-three-fifths-desktop
+ margin-left: 60%
+ &.is-offset-four-fifths-desktop
+ margin-left: 80%
+ @for $i from 0 through 12
+ &.is-#{$i}-desktop
+ flex: none
+ width: percentage($i / 12)
+ &.is-offset-#{$i}-desktop
+ margin-left: percentage($i / 12)
+ +widescreen
+ &.is-narrow-widescreen
+ flex: none
+ &.is-full-widescreen
+ flex: none
+ width: 100%
+ &.is-three-quarters-widescreen
+ flex: none
+ width: 75%
+ &.is-two-thirds-widescreen
+ flex: none
+ width: 66.6666%
+ &.is-half-widescreen
+ flex: none
+ width: 50%
+ &.is-one-third-widescreen
+ flex: none
+ width: 33.3333%
+ &.is-one-quarter-widescreen
+ flex: none
+ width: 25%
+ &.is-one-fifth-widescreen
+ flex: none
+ width: 20%
+ &.is-two-fifths-widescreen
+ flex: none
+ width: 40%
+ &.is-three-fifths-widescreen
+ flex: none
+ width: 60%
+ &.is-four-fifths-widescreen
+ flex: none
+ width: 80%
+ &.is-offset-three-quarters-widescreen
+ margin-left: 75%
+ &.is-offset-two-thirds-widescreen
+ margin-left: 66.6666%
+ &.is-offset-half-widescreen
+ margin-left: 50%
+ &.is-offset-one-third-widescreen
+ margin-left: 33.3333%
+ &.is-offset-one-quarter-widescreen
+ margin-left: 25%
+ &.is-offset-one-fifth-widescreen
+ margin-left: 20%
+ &.is-offset-two-fifths-widescreen
+ margin-left: 40%
+ &.is-offset-three-fifths-widescreen
+ margin-left: 60%
+ &.is-offset-four-fifths-widescreen
+ margin-left: 80%
+ @for $i from 0 through 12
+ &.is-#{$i}-widescreen
+ flex: none
+ width: percentage($i / 12)
+ &.is-offset-#{$i}-widescreen
+ margin-left: percentage($i / 12)
+ +fullhd
+ &.is-narrow-fullhd
+ flex: none
+ &.is-full-fullhd
+ flex: none
+ width: 100%
+ &.is-three-quarters-fullhd
+ flex: none
+ width: 75%
+ &.is-two-thirds-fullhd
+ flex: none
+ width: 66.6666%
+ &.is-half-fullhd
+ flex: none
+ width: 50%
+ &.is-one-third-fullhd
+ flex: none
+ width: 33.3333%
+ &.is-one-quarter-fullhd
+ flex: none
+ width: 25%
+ &.is-one-fifth-fullhd
+ flex: none
+ width: 20%
+ &.is-two-fifths-fullhd
+ flex: none
+ width: 40%
+ &.is-three-fifths-fullhd
+ flex: none
+ width: 60%
+ &.is-four-fifths-fullhd
+ flex: none
+ width: 80%
+ &.is-offset-three-quarters-fullhd
+ margin-left: 75%
+ &.is-offset-two-thirds-fullhd
+ margin-left: 66.6666%
+ &.is-offset-half-fullhd
+ margin-left: 50%
+ &.is-offset-one-third-fullhd
+ margin-left: 33.3333%
+ &.is-offset-one-quarter-fullhd
+ margin-left: 25%
+ &.is-offset-one-fifth-fullhd
+ margin-left: 20%
+ &.is-offset-two-fifths-fullhd
+ margin-left: 40%
+ &.is-offset-three-fifths-fullhd
+ margin-left: 60%
+ &.is-offset-four-fifths-fullhd
+ margin-left: 80%
+ @for $i from 0 through 12
+ &.is-#{$i}-fullhd
+ flex: none
+ width: percentage($i / 12)
+ &.is-offset-#{$i}-fullhd
+ margin-left: percentage($i / 12)
+
+.columns
+ margin-left: (-$column-gap)
+ margin-right: (-$column-gap)
+ margin-top: (-$column-gap)
+ &:last-child
+ margin-bottom: (-$column-gap)
+ &:not(:last-child)
+ margin-bottom: calc(1.5rem - #{$column-gap})
+ // Modifiers
+ &.is-centered
+ justify-content: center
+ &.is-gapless
+ margin-left: 0
+ margin-right: 0
+ margin-top: 0
+ & > .column
+ margin: 0
+ padding: 0 !important
+ &:not(:last-child)
+ margin-bottom: 1.5rem
+ &:last-child
+ margin-bottom: 0
+ &.is-mobile
+ display: flex
+ &.is-multiline
+ flex-wrap: wrap
+ &.is-vcentered
+ align-items: center
+ // Responsiveness
+ +tablet
+ &:not(.is-desktop)
+ display: flex
+ +desktop
+ // Modifiers
+ &.is-desktop
+ display: flex
+
+@if $variable-columns
+ .columns.is-variable
+ --columnGap: 0.75rem
+ margin-left: calc(-1 * var(--columnGap))
+ margin-right: calc(-1 * var(--columnGap))
+ .column
+ padding-left: var(--columnGap)
+ padding-right: var(--columnGap)
+ @for $i from 0 through 8
+ &.is-#{$i}
+ --columnGap: #{$i * 0.25rem}
+ +mobile
+ &.is-#{$i}-mobile
+ --columnGap: #{$i * 0.25rem}
+ +tablet
+ &.is-#{$i}-tablet
+ --columnGap: #{$i * 0.25rem}
+ +tablet-only
+ &.is-#{$i}-tablet-only
+ --columnGap: #{$i * 0.25rem}
+ +touch
+ &.is-#{$i}-touch
+ --columnGap: #{$i * 0.25rem}
+ +desktop
+ &.is-#{$i}-desktop
+ --columnGap: #{$i * 0.25rem}
+ +desktop-only
+ &.is-#{$i}-desktop-only
+ --columnGap: #{$i * 0.25rem}
+ +widescreen
+ &.is-#{$i}-widescreen
+ --columnGap: #{$i * 0.25rem}
+ +widescreen-only
+ &.is-#{$i}-widescreen-only
+ --columnGap: #{$i * 0.25rem}
+ +fullhd
+ &.is-#{$i}-fullhd
+ --columnGap: #{$i * 0.25rem}
diff --git a/docs/src/assets/bulma/grid/tiles.sass b/docs/src/assets/bulma/grid/tiles.sass
new file mode 100644
index 00000000..15648c29
--- /dev/null
+++ b/docs/src/assets/bulma/grid/tiles.sass
@@ -0,0 +1,34 @@
+$tile-spacing: 0.75rem !default
+
+.tile
+ align-items: stretch
+ display: block
+ flex-basis: 0
+ flex-grow: 1
+ flex-shrink: 1
+ min-height: min-content
+ // Modifiers
+ &.is-ancestor
+ margin-left: $tile-spacing * -1
+ margin-right: $tile-spacing * -1
+ margin-top: $tile-spacing * -1
+ &:last-child
+ margin-bottom: $tile-spacing * -1
+ &:not(:last-child)
+ margin-bottom: $tile-spacing
+ &.is-child
+ margin: 0 !important
+ &.is-parent
+ padding: $tile-spacing
+ &.is-vertical
+ flex-direction: column
+ & > .tile.is-child:not(:last-child)
+ margin-bottom: 1.5rem !important
+ // Responsiveness
+ +tablet
+ &:not(.is-child)
+ display: flex
+ @for $i from 1 through 12
+ &.is-#{$i}
+ flex: none
+ width: ($i / 12) * 100%
diff --git a/docs/src/assets/bulma/layout/_all.sass b/docs/src/assets/bulma/layout/_all.sass
new file mode 100644
index 00000000..143ada35
--- /dev/null
+++ b/docs/src/assets/bulma/layout/_all.sass
@@ -0,0 +1,5 @@
+@charset "utf-8"
+
+@import "hero.sass"
+@import "section.sass"
+@import "footer.sass"
diff --git a/docs/src/assets/bulma/layout/footer.sass b/docs/src/assets/bulma/layout/footer.sass
new file mode 100644
index 00000000..8faa11ed
--- /dev/null
+++ b/docs/src/assets/bulma/layout/footer.sass
@@ -0,0 +1,9 @@
+$footer-background-color: $scheme-main-bis !default
+$footer-color: false !default
+$footer-padding: 3rem 1.5rem 6rem !default
+
+.footer
+ background-color: $footer-background-color
+ padding: $footer-padding
+ @if $footer-color
+ color: $footer-color
diff --git a/docs/src/assets/bulma/layout/hero.sass b/docs/src/assets/bulma/layout/hero.sass
new file mode 100644
index 00000000..ae8ed086
--- /dev/null
+++ b/docs/src/assets/bulma/layout/hero.sass
@@ -0,0 +1,144 @@
+$hero-body-padding: 3rem 1.5rem !default
+$hero-body-padding-small: 1.5rem !default
+$hero-body-padding-medium: 9rem 1.5rem !default
+$hero-body-padding-large: 18rem 1.5rem !default
+
+// Main container
+.hero
+ align-items: stretch
+ display: flex
+ flex-direction: column
+ justify-content: space-between
+ .navbar
+ background: none
+ .tabs
+ ul
+ border-bottom: none
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ color: $color-invert
+ a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+ strong
+ color: inherit
+ .title
+ color: $color-invert
+ .subtitle
+ color: bulmaRgba($color-invert, 0.9)
+ a:not(.button),
+ strong
+ color: $color-invert
+ .navbar-menu
+ +touch
+ background-color: $color
+ .navbar-item,
+ .navbar-link
+ color: bulmaRgba($color-invert, 0.7)
+ a.navbar-item,
+ .navbar-link
+ &:hover,
+ &.is-active
+ background-color: darken($color, 5%)
+ color: $color-invert
+ .tabs
+ a
+ color: $color-invert
+ opacity: 0.9
+ &:hover
+ opacity: 1
+ li
+ &.is-active a
+ opacity: 1
+ &.is-boxed,
+ &.is-toggle
+ a
+ color: $color-invert
+ &:hover
+ background-color: bulmaRgba($scheme-invert, 0.1)
+ li.is-active a
+ &,
+ &:hover
+ background-color: $color-invert
+ border-color: $color-invert
+ color: $color
+ // Modifiers
+ &.is-bold
+ $gradient-top-left: darken(saturate(adjust-hue($color, -10deg), 10%), 10%)
+ $gradient-bottom-right: lighten(saturate(adjust-hue($color, 10deg), 5%), 5%)
+ background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
+ +mobile
+ .navbar-menu
+ background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
+ // Sizes
+ &.is-small
+ .hero-body
+ padding: $hero-body-padding-small
+ &.is-medium
+ +tablet
+ .hero-body
+ padding: $hero-body-padding-medium
+ &.is-large
+ +tablet
+ .hero-body
+ padding: $hero-body-padding-large
+ &.is-halfheight,
+ &.is-fullheight,
+ &.is-fullheight-with-navbar
+ .hero-body
+ align-items: center
+ display: flex
+ & > .container
+ flex-grow: 1
+ flex-shrink: 1
+ &.is-halfheight
+ min-height: 50vh
+ &.is-fullheight
+ min-height: 100vh
+
+// Components
+
+.hero-video
+ @extend %overlay
+ overflow: hidden
+ video
+ left: 50%
+ min-height: 100%
+ min-width: 100%
+ position: absolute
+ top: 50%
+ transform: translate3d(-50%, -50%, 0)
+ // Modifiers
+ &.is-transparent
+ opacity: 0.3
+ // Responsiveness
+ +mobile
+ display: none
+
+.hero-buttons
+ margin-top: 1.5rem
+ // Responsiveness
+ +mobile
+ .button
+ display: flex
+ &:not(:last-child)
+ margin-bottom: 0.75rem
+ +tablet
+ display: flex
+ justify-content: center
+ .button:not(:last-child)
+ margin-right: 1.5rem
+
+// Containers
+
+.hero-head,
+.hero-foot
+ flex-grow: 0
+ flex-shrink: 0
+
+.hero-body
+ flex-grow: 1
+ flex-shrink: 0
+ padding: $hero-body-padding
diff --git a/docs/src/assets/bulma/layout/section.sass b/docs/src/assets/bulma/layout/section.sass
new file mode 100644
index 00000000..6f2d3523
--- /dev/null
+++ b/docs/src/assets/bulma/layout/section.sass
@@ -0,0 +1,13 @@
+$section-padding: 3rem 1.5rem !default
+$section-padding-medium: 9rem 1.5rem !default
+$section-padding-large: 18rem 1.5rem !default
+
+.section
+ padding: $section-padding
+ // Responsiveness
+ +desktop
+ // Sizes
+ &.is-medium
+ padding: $section-padding-medium
+ &.is-large
+ padding: $section-padding-large
diff --git a/docs/src/assets/bulma/utilities/_all.sass b/docs/src/assets/bulma/utilities/_all.sass
new file mode 100644
index 00000000..bf4ecfe3
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/_all.sass
@@ -0,0 +1,8 @@
+@charset "utf-8"
+
+@import "initial-variables.sass"
+@import "functions.sass"
+@import "derived-variables.sass"
+@import "animations.sass"
+@import "mixins.sass"
+@import "controls.sass"
diff --git a/docs/src/assets/bulma/utilities/animations.sass b/docs/src/assets/bulma/utilities/animations.sass
new file mode 100644
index 00000000..a14525d7
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/animations.sass
@@ -0,0 +1,5 @@
+@keyframes spinAround
+ from
+ transform: rotate(0deg)
+ to
+ transform: rotate(359deg)
diff --git a/docs/src/assets/bulma/utilities/controls.sass b/docs/src/assets/bulma/utilities/controls.sass
new file mode 100644
index 00000000..cc7672a1
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/controls.sass
@@ -0,0 +1,50 @@
+$control-radius: $radius !default
+$control-radius-small: $radius-small !default
+
+$control-border-width: 1px !default
+
+$control-height: 2.5em !default
+$control-line-height: 1.5 !default
+
+$control-padding-vertical: calc(0.5em - #{$control-border-width}) !default
+$control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default
+
+=control
+ -moz-appearance: none
+ -webkit-appearance: none
+ align-items: center
+ border: $control-border-width solid transparent
+ border-radius: $control-radius
+ box-shadow: none
+ display: inline-flex
+ font-size: $size-normal
+ height: $control-height
+ justify-content: flex-start
+ line-height: $control-line-height
+ padding-bottom: $control-padding-vertical
+ padding-left: $control-padding-horizontal
+ padding-right: $control-padding-horizontal
+ padding-top: $control-padding-vertical
+ position: relative
+ vertical-align: top
+ // States
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active
+ outline: none
+ &[disabled],
+ fieldset[disabled] &
+ cursor: not-allowed
+
+%control
+ +control
+
+// The controls sizes use mixins so they can be used at different breakpoints
+=control-small
+ border-radius: $control-radius-small
+ font-size: $size-small
+=control-medium
+ font-size: $size-medium
+=control-large
+ font-size: $size-large
diff --git a/docs/src/assets/bulma/utilities/derived-variables.sass b/docs/src/assets/bulma/utilities/derived-variables.sass
new file mode 100644
index 00000000..18a7f461
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/derived-variables.sass
@@ -0,0 +1,106 @@
+$primary: $turquoise !default
+
+$info: $cyan !default
+$success: $green !default
+$warning: $yellow !default
+$danger: $red !default
+
+$light: $white-ter !default
+$dark: $grey-darker !default
+
+// Invert colors
+
+$orange-invert: findColorInvert($orange) !default
+$yellow-invert: findColorInvert($yellow) !default
+$green-invert: findColorInvert($green) !default
+$turquoise-invert: findColorInvert($turquoise) !default
+$cyan-invert: findColorInvert($cyan) !default
+$blue-invert: findColorInvert($blue) !default
+$purple-invert: findColorInvert($purple) !default
+$red-invert: findColorInvert($red) !default
+
+$primary-invert: findColorInvert($primary) !default
+$primary-light: findLightColor($primary) !default
+$primary-dark: findDarkColor($primary) !default
+$info-invert: findColorInvert($info) !default
+$info-light: findLightColor($info) !default
+$info-dark: findDarkColor($info) !default
+$success-invert: findColorInvert($success) !default
+$success-light: findLightColor($success) !default
+$success-dark: findDarkColor($success) !default
+$warning-invert: findColorInvert($warning) !default
+$warning-light: findLightColor($warning) !default
+$warning-dark: findDarkColor($warning) !default
+$danger-invert: findColorInvert($danger) !default
+$danger-light: findLightColor($danger) !default
+$danger-dark: findDarkColor($danger) !default
+$light-invert: findColorInvert($light) !default
+$dark-invert: findColorInvert($dark) !default
+
+// General colors
+
+$scheme-main: $white !default
+$scheme-main-bis: $white-bis !default
+$scheme-main-ter: $white-ter !default
+$scheme-invert: $black !default
+$scheme-invert-bis: $black-bis !default
+$scheme-invert-ter: $black-ter !default
+
+$background: $white-ter !default
+
+$border: $grey-lighter !default
+$border-hover: $grey-light !default
+$border-light: $grey-lightest !default
+$border-light-hover: $grey-light !default
+
+// Text colors
+
+$text: $grey-dark !default
+$text-invert: findColorInvert($text) !default
+$text-light: $grey !default
+$text-strong: $grey-darker !default
+
+// Code colors
+
+$code: $red !default
+$code-background: $background !default
+
+$pre: $text !default
+$pre-background: $background !default
+
+// Link colors
+
+$link: $blue !default
+$link-invert: findColorInvert($link) !default
+$link-light: findLightColor($link) !default
+$link-dark: findDarkColor($link) !default
+$link-visited: $purple !default
+
+$link-hover: $grey-darker !default
+$link-hover-border: $grey-light !default
+
+$link-focus: $grey-darker !default
+$link-focus-border: $blue !default
+
+$link-active: $grey-darker !default
+$link-active-border: $grey-dark !default
+
+// Typography
+
+$family-primary: $family-sans-serif !default
+$family-secondary: $family-sans-serif !default
+$family-code: $family-monospace !default
+
+$size-small: $size-7 !default
+$size-normal: $size-6 !default
+$size-medium: $size-5 !default
+$size-large: $size-4 !default
+
+// Lists and maps
+$custom-colors: null !default
+$custom-shades: null !default
+
+$colors: mergeColorMaps(("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert, $primary-light, $primary-dark), "link": ($link, $link-invert, $link-light, $link-dark), "info": ($info, $info-invert, $info-light, $info-dark), "success": ($success, $success-invert, $success-light, $success-dark), "warning": ($warning, $warning-invert, $warning-light, $warning-dark), "danger": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors) !default
+$shades: mergeColorMaps(("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis), $custom-shades) !default
+
+$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
diff --git a/docs/src/assets/bulma/utilities/functions.sass b/docs/src/assets/bulma/utilities/functions.sass
new file mode 100644
index 00000000..54225e21
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/functions.sass
@@ -0,0 +1,103 @@
+@function mergeColorMaps($bulma-colors, $custom-colors)
+ // We return at least Bulma's hard-coded colors
+ $merged-colors: $bulma-colors
+
+ // We want a map as input
+ @if type-of($custom-colors) == 'map'
+ @each $name, $components in $custom-colors
+ // The color name should be a string
+ // and the components either a single color
+ // or a colors list with at least one element
+ @if type-of($name) == 'string' and (type-of($components) == 'list' or type-of($components) == 'color') and length($components) >= 1
+ $color-base: null
+ $color-invert: null
+ $color-light: null
+ $color-dark: null
+ $value: null
+
+ // The param can either be a single color
+ // or a list of 2 colors
+ @if type-of($components) == 'color'
+ $color-base: $components
+ $color-invert: findColorInvert($color-base)
+ $color-light: findLightColor($color-base)
+ $color-dark: findDarkColor($color-base)
+ @else if type-of($components) == 'list'
+ $color-base: nth($components, 1)
+ // If Invert, Light and Dark are provided
+ @if length($components) > 3
+ $color-invert: nth($components, 2)
+ $color-light: nth($components, 3)
+ $color-dark: nth($components, 4)
+ // If only Invert and Light are provided
+ @else if length($components) > 2
+ $color-invert: nth($components, 2)
+ $color-light: nth($components, 3)
+ $color-dark: findDarkColor($color-base)
+ // If only Invert is provided
+ @else
+ $color-invert: nth($components, 2)
+ $color-light: findLightColor($color-base)
+ $color-dark: findDarkColor($color-base)
+
+ $value: ($color-base, $color-invert, $color-light, $color-dark)
+
+ // We only want to merge the map if the color base is an actual color
+ @if type-of($color-base) == 'color'
+ // We merge this colors elements as map with Bulma's colors map
+ // (we can override them this way, no multiple definition for the same name)
+ // $merged-colors: map_merge($merged-colors, ($name: ($color-base, $color-invert, $color-light, $color-dark)))
+ $merged-colors: map_merge($merged-colors, ($name: $value))
+
+ @return $merged-colors
+
+@function powerNumber($number, $exp)
+ $value: 1
+ @if $exp > 0
+ @for $i from 1 through $exp
+ $value: $value * $number
+ @else if $exp < 0
+ @for $i from 1 through -$exp
+ $value: $value / $number
+ @return $value
+
+@function colorLuminance($color)
+ $color-rgb: ('red': red($color),'green': green($color),'blue': blue($color))
+ @each $name, $value in $color-rgb
+ $adjusted: 0
+ $value: $value / 255
+ @if $value < 0.03928
+ $value: $value / 12.92
+ @else
+ $value: ($value + .055) / 1.055
+ $value: powerNumber($value, 2)
+ $color-rgb: map-merge($color-rgb, ($name: $value))
+ @return (map-get($color-rgb, 'red') * .2126) + (map-get($color-rgb, 'green') * .7152) + (map-get($color-rgb, 'blue') * .0722)
+
+@function findColorInvert($color)
+ @if (colorLuminance($color) > 0.55)
+ @return rgba(#000, 0.7)
+ @else
+ @return #fff
+
+@function findLightColor($color)
+ @if type-of($color) == 'color'
+ $l: 96%
+ @if lightness($color) > 96%
+ $l: lightness($color)
+ @return change-color($color, $lightness: $l)
+ @return $background
+
+@function findDarkColor($color)
+ @if type-of($color) == 'color'
+ $base-l: 29%
+ $luminance: colorLuminance($color)
+ $luminance-delta: (0.53 - $luminance)
+ $target-l: round($base-l + ($luminance-delta * 53))
+ @return change-color($color, $lightness: max($base-l, $target-l))
+ @return $text-strong
+
+@function bulmaRgba($color, $alpha)
+ @if type-of($color) == 'color'
+ @return rgba($color, $alpha)
+ @return $color
diff --git a/docs/src/assets/bulma/utilities/initial-variables.sass b/docs/src/assets/bulma/utilities/initial-variables.sass
new file mode 100644
index 00000000..03bbc128
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/initial-variables.sass
@@ -0,0 +1,77 @@
+// Colors
+
+$black: hsl(0, 0%, 4%) !default
+$black-bis: hsl(0, 0%, 7%) !default
+$black-ter: hsl(0, 0%, 14%) !default
+
+$grey-darker: hsl(0, 0%, 21%) !default
+$grey-dark: hsl(0, 0%, 29%) !default
+$grey: hsl(0, 0%, 48%) !default
+$grey-light: hsl(0, 0%, 71%) !default
+$grey-lighter: hsl(0, 0%, 86%) !default
+$grey-lightest: hsl(0, 0%, 93%) !default
+
+$white-ter: hsl(0, 0%, 96%) !default
+$white-bis: hsl(0, 0%, 98%) !default
+$white: hsl(0, 0%, 100%) !default
+
+$orange: hsl(14, 100%, 53%) !default
+$yellow: hsl(48, 100%, 67%) !default
+$green: hsl(141, 53%, 53%) !default
+$turquoise: hsl(171, 100%, 41%) !default
+$cyan: hsl(204, 71%, 53%) !default
+$blue: hsl(217, 71%, 53%) !default
+$purple: hsl(271, 100%, 71%) !default
+$red: hsl(348, 86%, 61%) !default
+
+// Typography
+
+$family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !default
+$family-monospace: monospace !default
+$render-mode: optimizeLegibility !default
+
+$size-1: 3rem !default
+$size-2: 2.5rem !default
+$size-3: 2rem !default
+$size-4: 1.5rem !default
+$size-5: 1.25rem !default
+$size-6: 1rem !default
+$size-7: 0.75rem !default
+
+$weight-light: 300 !default
+$weight-normal: 400 !default
+$weight-medium: 500 !default
+$weight-semibold: 600 !default
+$weight-bold: 700 !default
+
+// Spacing
+
+$block-spacing: 1.5rem !default
+
+// Responsiveness
+
+// The container horizontal gap, which acts as the offset for breakpoints
+$gap: 32px !default
+// 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
+$tablet: 769px !default
+// 960px container + 4rem
+$desktop: 960px + (2 * $gap) !default
+// 1152px container + 4rem
+$widescreen: 1152px + (2 * $gap) !default
+$widescreen-enabled: true !default
+// 1344px container + 4rem
+$fullhd: 1344px + (2 * $gap) !default
+$fullhd-enabled: true !default
+
+// Miscellaneous
+
+$easing: ease-out !default
+$radius-small: 2px !default
+$radius: 4px !default
+$radius-large: 6px !default
+$radius-rounded: 290486px !default
+$speed: 86ms !default
+
+// Flags
+
+$variable-columns: true !default
diff --git a/docs/src/assets/bulma/utilities/mixins.sass b/docs/src/assets/bulma/utilities/mixins.sass
new file mode 100644
index 00000000..27d74673
--- /dev/null
+++ b/docs/src/assets/bulma/utilities/mixins.sass
@@ -0,0 +1,261 @@
+@import "initial-variables"
+
+=clearfix
+ &::after
+ clear: both
+ content: " "
+ display: table
+
+=center($width, $height: 0)
+ position: absolute
+ @if $height != 0
+ left: calc(50% - (#{$width} / 2))
+ top: calc(50% - (#{$height} / 2))
+ @else
+ left: calc(50% - (#{$width} / 2))
+ top: calc(50% - (#{$width} / 2))
+
+=fa($size, $dimensions)
+ display: inline-block
+ font-size: $size
+ height: $dimensions
+ line-height: $dimensions
+ text-align: center
+ vertical-align: top
+ width: $dimensions
+
+=hamburger($dimensions)
+ cursor: pointer
+ display: block
+ height: $dimensions
+ position: relative
+ width: $dimensions
+ span
+ background-color: currentColor
+ display: block
+ height: 1px
+ left: calc(50% - 8px)
+ position: absolute
+ transform-origin: center
+ transition-duration: $speed
+ transition-property: background-color, opacity, transform
+ transition-timing-function: $easing
+ width: 16px
+ &:nth-child(1)
+ top: calc(50% - 6px)
+ &:nth-child(2)
+ top: calc(50% - 1px)
+ &:nth-child(3)
+ top: calc(50% + 4px)
+ &:hover
+ background-color: bulmaRgba(black, 0.05)
+ // Modifers
+ &.is-active
+ span
+ &:nth-child(1)
+ transform: translateY(5px) rotate(45deg)
+ &:nth-child(2)
+ opacity: 0
+ &:nth-child(3)
+ transform: translateY(-5px) rotate(-45deg)
+
+=overflow-touch
+ -webkit-overflow-scrolling: touch
+
+=placeholder
+ $placeholders: ':-moz' ':-webkit-input' '-moz' '-ms-input'
+ @each $placeholder in $placeholders
+ &:#{$placeholder}-placeholder
+ @content
+
+// Responsiveness
+
+=from($device)
+ @media screen and (min-width: $device)
+ @content
+
+=until($device)
+ @media screen and (max-width: $device - 1px)
+ @content
+
+=mobile
+ @media screen and (max-width: $tablet - 1px)
+ @content
+
+=tablet
+ @media screen and (min-width: $tablet), print
+ @content
+
+=tablet-only
+ @media screen and (min-width: $tablet) and (max-width: $desktop - 1px)
+ @content
+
+=touch
+ @media screen and (max-width: $desktop - 1px)
+ @content
+
+=desktop
+ @media screen and (min-width: $desktop)
+ @content
+
+=desktop-only
+ @if $widescreen-enabled
+ @media screen and (min-width: $desktop) and (max-width: $widescreen - 1px)
+ @content
+
+=until-widescreen
+ @if $widescreen-enabled
+ @media screen and (max-width: $widescreen - 1px)
+ @content
+
+=widescreen
+ @if $widescreen-enabled
+ @media screen and (min-width: $widescreen)
+ @content
+
+=widescreen-only
+ @if $widescreen-enabled and $fullhd-enabled
+ @media screen and (min-width: $widescreen) and (max-width: $fullhd - 1px)
+ @content
+
+=until-fullhd
+ @if $fullhd-enabled
+ @media screen and (max-width: $fullhd - 1px)
+ @content
+
+=fullhd
+ @if $fullhd-enabled
+ @media screen and (min-width: $fullhd)
+ @content
+
+// Placeholders
+
+=unselectable
+ -webkit-touch-callout: none
+ -webkit-user-select: none
+ -moz-user-select: none
+ -ms-user-select: none
+ user-select: none
+
+%unselectable
+ +unselectable
+
+=arrow($color: transparent)
+ border: 3px solid $color
+ border-radius: 2px
+ border-right: 0
+ border-top: 0
+ content: " "
+ display: block
+ height: 0.625em
+ margin-top: -0.4375em
+ pointer-events: none
+ position: absolute
+ top: 50%
+ transform: rotate(-45deg)
+ transform-origin: center
+ width: 0.625em
+
+%arrow
+ +arrow
+
+=block($spacing: $block-spacing)
+ &:not(:last-child)
+ margin-bottom: $spacing
+
+%block
+ +block
+
+=delete
+ @extend %unselectable
+ -moz-appearance: none
+ -webkit-appearance: none
+ background-color: bulmaRgba($scheme-invert, 0.2)
+ border: none
+ border-radius: $radius-rounded
+ cursor: pointer
+ pointer-events: auto
+ display: inline-block
+ flex-grow: 0
+ flex-shrink: 0
+ font-size: 0
+ height: 20px
+ max-height: 20px
+ max-width: 20px
+ min-height: 20px
+ min-width: 20px
+ outline: none
+ position: relative
+ vertical-align: top
+ width: 20px
+ &::before,
+ &::after
+ background-color: $scheme-main
+ content: ""
+ display: block
+ left: 50%
+ position: absolute
+ top: 50%
+ transform: translateX(-50%) translateY(-50%) rotate(45deg)
+ transform-origin: center center
+ &::before
+ height: 2px
+ width: 50%
+ &::after
+ height: 50%
+ width: 2px
+ &:hover,
+ &:focus
+ background-color: bulmaRgba($scheme-invert, 0.3)
+ &:active
+ background-color: bulmaRgba($scheme-invert, 0.4)
+ // Sizes
+ &.is-small
+ height: 16px
+ max-height: 16px
+ max-width: 16px
+ min-height: 16px
+ min-width: 16px
+ width: 16px
+ &.is-medium
+ height: 24px
+ max-height: 24px
+ max-width: 24px
+ min-height: 24px
+ min-width: 24px
+ width: 24px
+ &.is-large
+ height: 32px
+ max-height: 32px
+ max-width: 32px
+ min-height: 32px
+ min-width: 32px
+ width: 32px
+
+%delete
+ +delete
+
+=loader
+ animation: spinAround 500ms infinite linear
+ border: 2px solid $grey-lighter
+ border-radius: $radius-rounded
+ border-right-color: transparent
+ border-top-color: transparent
+ content: ""
+ display: block
+ height: 1em
+ position: relative
+ width: 1em
+
+%loader
+ +loader
+
+=overlay($offset: 0)
+ bottom: $offset
+ left: $offset
+ position: absolute
+ right: $offset
+ top: $offset
+
+%overlay
+ +overlay
diff --git a/docs/src/assets/fa/_animated.scss b/docs/src/assets/fa/_animated.scss
new file mode 100644
index 00000000..7c7c0e17
--- /dev/null
+++ b/docs/src/assets/fa/_animated.scss
@@ -0,0 +1,20 @@
+// Animated Icons
+// --------------------------
+
+.#{$fa-css-prefix}-spin {
+ animation: fa-spin 2s infinite linear;
+}
+
+.#{$fa-css-prefix}-pulse {
+ animation: fa-spin 1s infinite steps(8);
+}
+
+@keyframes fa-spin {
+ 0% {
+ transform: rotate(0deg);
+ }
+
+ 100% {
+ transform: rotate(360deg);
+ }
+}
diff --git a/docs/src/assets/fa/_bordered-pulled.scss b/docs/src/assets/fa/_bordered-pulled.scss
new file mode 100644
index 00000000..c8c4274c
--- /dev/null
+++ b/docs/src/assets/fa/_bordered-pulled.scss
@@ -0,0 +1,20 @@
+// Bordered & Pulled
+// -------------------------
+
+.#{$fa-css-prefix}-border {
+ border: solid .08em $fa-border-color;
+ border-radius: .1em;
+ padding: .2em .25em .15em;
+}
+
+.#{$fa-css-prefix}-pull-left { float: left; }
+.#{$fa-css-prefix}-pull-right { float: right; }
+
+.#{$fa-css-prefix},
+.fas,
+.far,
+.fal,
+.fab {
+ &.#{$fa-css-prefix}-pull-left { margin-right: .3em; }
+ &.#{$fa-css-prefix}-pull-right { margin-left: .3em; }
+}
diff --git a/docs/src/assets/fa/_core.scss b/docs/src/assets/fa/_core.scss
new file mode 100644
index 00000000..7fd37f85
--- /dev/null
+++ b/docs/src/assets/fa/_core.scss
@@ -0,0 +1,16 @@
+// Base Class Definition
+// -------------------------
+
+.#{$fa-css-prefix},
+.fas,
+.far,
+.fal,
+.fab {
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ display: inline-block;
+ font-style: normal;
+ font-variant: normal;
+ text-rendering: auto;
+ line-height: 1;
+}
diff --git a/docs/src/assets/fa/_fixed-width.scss b/docs/src/assets/fa/_fixed-width.scss
new file mode 100644
index 00000000..5b33eb49
--- /dev/null
+++ b/docs/src/assets/fa/_fixed-width.scss
@@ -0,0 +1,6 @@
+// Fixed Width Icons
+// -------------------------
+.#{$fa-css-prefix}-fw {
+ text-align: center;
+ width: (20em / 16);
+}
diff --git a/docs/src/assets/fa/_icons.scss b/docs/src/assets/fa/_icons.scss
new file mode 100644
index 00000000..bfd2b469
--- /dev/null
+++ b/docs/src/assets/fa/_icons.scss
@@ -0,0 +1,792 @@
+/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
+readers do not read off random characters that represent icons */
+
+.#{$fa-css-prefix}-500px:before { content: fa-content($fa-var-500px); }
+.#{$fa-css-prefix}-accessible-icon:before { content: fa-content($fa-var-accessible-icon); }
+.#{$fa-css-prefix}-accusoft:before { content: fa-content($fa-var-accusoft); }
+.#{$fa-css-prefix}-address-book:before { content: fa-content($fa-var-address-book); }
+.#{$fa-css-prefix}-address-card:before { content: fa-content($fa-var-address-card); }
+.#{$fa-css-prefix}-adjust:before { content: fa-content($fa-var-adjust); }
+.#{$fa-css-prefix}-adn:before { content: fa-content($fa-var-adn); }
+.#{$fa-css-prefix}-adversal:before { content: fa-content($fa-var-adversal); }
+.#{$fa-css-prefix}-affiliatetheme:before { content: fa-content($fa-var-affiliatetheme); }
+.#{$fa-css-prefix}-algolia:before { content: fa-content($fa-var-algolia); }
+.#{$fa-css-prefix}-align-center:before { content: fa-content($fa-var-align-center); }
+.#{$fa-css-prefix}-align-justify:before { content: fa-content($fa-var-align-justify); }
+.#{$fa-css-prefix}-align-left:before { content: fa-content($fa-var-align-left); }
+.#{$fa-css-prefix}-align-right:before { content: fa-content($fa-var-align-right); }
+.#{$fa-css-prefix}-amazon:before { content: fa-content($fa-var-amazon); }
+.#{$fa-css-prefix}-amazon-pay:before { content: fa-content($fa-var-amazon-pay); }
+.#{$fa-css-prefix}-ambulance:before { content: fa-content($fa-var-ambulance); }
+.#{$fa-css-prefix}-american-sign-language-interpreting:before { content: fa-content($fa-var-american-sign-language-interpreting); }
+.#{$fa-css-prefix}-amilia:before { content: fa-content($fa-var-amilia); }
+.#{$fa-css-prefix}-anchor:before { content: fa-content($fa-var-anchor); }
+.#{$fa-css-prefix}-android:before { content: fa-content($fa-var-android); }
+.#{$fa-css-prefix}-angellist:before { content: fa-content($fa-var-angellist); }
+.#{$fa-css-prefix}-angle-double-down:before { content: fa-content($fa-var-angle-double-down); }
+.#{$fa-css-prefix}-angle-double-left:before { content: fa-content($fa-var-angle-double-left); }
+.#{$fa-css-prefix}-angle-double-right:before { content: fa-content($fa-var-angle-double-right); }
+.#{$fa-css-prefix}-angle-double-up:before { content: fa-content($fa-var-angle-double-up); }
+.#{$fa-css-prefix}-angle-down:before { content: fa-content($fa-var-angle-down); }
+.#{$fa-css-prefix}-angle-left:before { content: fa-content($fa-var-angle-left); }
+.#{$fa-css-prefix}-angle-right:before { content: fa-content($fa-var-angle-right); }
+.#{$fa-css-prefix}-angle-up:before { content: fa-content($fa-var-angle-up); }
+.#{$fa-css-prefix}-angrycreative:before { content: fa-content($fa-var-angrycreative); }
+.#{$fa-css-prefix}-angular:before { content: fa-content($fa-var-angular); }
+.#{$fa-css-prefix}-app-store:before { content: fa-content($fa-var-app-store); }
+.#{$fa-css-prefix}-app-store-ios:before { content: fa-content($fa-var-app-store-ios); }
+.#{$fa-css-prefix}-apper:before { content: fa-content($fa-var-apper); }
+.#{$fa-css-prefix}-apple:before { content: fa-content($fa-var-apple); }
+.#{$fa-css-prefix}-apple-pay:before { content: fa-content($fa-var-apple-pay); }
+.#{$fa-css-prefix}-archive:before { content: fa-content($fa-var-archive); }
+.#{$fa-css-prefix}-arrow-alt-circle-down:before { content: fa-content($fa-var-arrow-alt-circle-down); }
+.#{$fa-css-prefix}-arrow-alt-circle-left:before { content: fa-content($fa-var-arrow-alt-circle-left); }
+.#{$fa-css-prefix}-arrow-alt-circle-right:before { content: fa-content($fa-var-arrow-alt-circle-right); }
+.#{$fa-css-prefix}-arrow-alt-circle-up:before { content: fa-content($fa-var-arrow-alt-circle-up); }
+.#{$fa-css-prefix}-arrow-circle-down:before { content: fa-content($fa-var-arrow-circle-down); }
+.#{$fa-css-prefix}-arrow-circle-left:before { content: fa-content($fa-var-arrow-circle-left); }
+.#{$fa-css-prefix}-arrow-circle-right:before { content: fa-content($fa-var-arrow-circle-right); }
+.#{$fa-css-prefix}-arrow-circle-up:before { content: fa-content($fa-var-arrow-circle-up); }
+.#{$fa-css-prefix}-arrow-down:before { content: fa-content($fa-var-arrow-down); }
+.#{$fa-css-prefix}-arrow-left:before { content: fa-content($fa-var-arrow-left); }
+.#{$fa-css-prefix}-arrow-right:before { content: fa-content($fa-var-arrow-right); }
+.#{$fa-css-prefix}-arrow-up:before { content: fa-content($fa-var-arrow-up); }
+.#{$fa-css-prefix}-arrows-alt:before { content: fa-content($fa-var-arrows-alt); }
+.#{$fa-css-prefix}-arrows-alt-h:before { content: fa-content($fa-var-arrows-alt-h); }
+.#{$fa-css-prefix}-arrows-alt-v:before { content: fa-content($fa-var-arrows-alt-v); }
+.#{$fa-css-prefix}-assistive-listening-systems:before { content: fa-content($fa-var-assistive-listening-systems); }
+.#{$fa-css-prefix}-asterisk:before { content: fa-content($fa-var-asterisk); }
+.#{$fa-css-prefix}-asymmetrik:before { content: fa-content($fa-var-asymmetrik); }
+.#{$fa-css-prefix}-at:before { content: fa-content($fa-var-at); }
+.#{$fa-css-prefix}-audible:before { content: fa-content($fa-var-audible); }
+.#{$fa-css-prefix}-audio-description:before { content: fa-content($fa-var-audio-description); }
+.#{$fa-css-prefix}-autoprefixer:before { content: fa-content($fa-var-autoprefixer); }
+.#{$fa-css-prefix}-avianex:before { content: fa-content($fa-var-avianex); }
+.#{$fa-css-prefix}-aviato:before { content: fa-content($fa-var-aviato); }
+.#{$fa-css-prefix}-aws:before { content: fa-content($fa-var-aws); }
+.#{$fa-css-prefix}-backward:before { content: fa-content($fa-var-backward); }
+.#{$fa-css-prefix}-balance-scale:before { content: fa-content($fa-var-balance-scale); }
+.#{$fa-css-prefix}-ban:before { content: fa-content($fa-var-ban); }
+.#{$fa-css-prefix}-bandcamp:before { content: fa-content($fa-var-bandcamp); }
+.#{$fa-css-prefix}-barcode:before { content: fa-content($fa-var-barcode); }
+.#{$fa-css-prefix}-bars:before { content: fa-content($fa-var-bars); }
+.#{$fa-css-prefix}-bath:before { content: fa-content($fa-var-bath); }
+.#{$fa-css-prefix}-battery-empty:before { content: fa-content($fa-var-battery-empty); }
+.#{$fa-css-prefix}-battery-full:before { content: fa-content($fa-var-battery-full); }
+.#{$fa-css-prefix}-battery-half:before { content: fa-content($fa-var-battery-half); }
+.#{$fa-css-prefix}-battery-quarter:before { content: fa-content($fa-var-battery-quarter); }
+.#{$fa-css-prefix}-battery-three-quarters:before { content: fa-content($fa-var-battery-three-quarters); }
+.#{$fa-css-prefix}-bed:before { content: fa-content($fa-var-bed); }
+.#{$fa-css-prefix}-beer:before { content: fa-content($fa-var-beer); }
+.#{$fa-css-prefix}-behance:before { content: fa-content($fa-var-behance); }
+.#{$fa-css-prefix}-behance-square:before { content: fa-content($fa-var-behance-square); }
+.#{$fa-css-prefix}-bell:before { content: fa-content($fa-var-bell); }
+.#{$fa-css-prefix}-bell-slash:before { content: fa-content($fa-var-bell-slash); }
+.#{$fa-css-prefix}-bicycle:before { content: fa-content($fa-var-bicycle); }
+.#{$fa-css-prefix}-bimobject:before { content: fa-content($fa-var-bimobject); }
+.#{$fa-css-prefix}-binoculars:before { content: fa-content($fa-var-binoculars); }
+.#{$fa-css-prefix}-birthday-cake:before { content: fa-content($fa-var-birthday-cake); }
+.#{$fa-css-prefix}-bitbucket:before { content: fa-content($fa-var-bitbucket); }
+.#{$fa-css-prefix}-bitcoin:before { content: fa-content($fa-var-bitcoin); }
+.#{$fa-css-prefix}-bity:before { content: fa-content($fa-var-bity); }
+.#{$fa-css-prefix}-black-tie:before { content: fa-content($fa-var-black-tie); }
+.#{$fa-css-prefix}-blackberry:before { content: fa-content($fa-var-blackberry); }
+.#{$fa-css-prefix}-blind:before { content: fa-content($fa-var-blind); }
+.#{$fa-css-prefix}-blogger:before { content: fa-content($fa-var-blogger); }
+.#{$fa-css-prefix}-blogger-b:before { content: fa-content($fa-var-blogger-b); }
+.#{$fa-css-prefix}-bluetooth:before { content: fa-content($fa-var-bluetooth); }
+.#{$fa-css-prefix}-bluetooth-b:before { content: fa-content($fa-var-bluetooth-b); }
+.#{$fa-css-prefix}-bold:before { content: fa-content($fa-var-bold); }
+.#{$fa-css-prefix}-bolt:before { content: fa-content($fa-var-bolt); }
+.#{$fa-css-prefix}-bomb:before { content: fa-content($fa-var-bomb); }
+.#{$fa-css-prefix}-book:before { content: fa-content($fa-var-book); }
+.#{$fa-css-prefix}-bookmark:before { content: fa-content($fa-var-bookmark); }
+.#{$fa-css-prefix}-braille:before { content: fa-content($fa-var-braille); }
+.#{$fa-css-prefix}-briefcase:before { content: fa-content($fa-var-briefcase); }
+.#{$fa-css-prefix}-btc:before { content: fa-content($fa-var-btc); }
+.#{$fa-css-prefix}-bug:before { content: fa-content($fa-var-bug); }
+.#{$fa-css-prefix}-building:before { content: fa-content($fa-var-building); }
+.#{$fa-css-prefix}-bullhorn:before { content: fa-content($fa-var-bullhorn); }
+.#{$fa-css-prefix}-bullseye:before { content: fa-content($fa-var-bullseye); }
+.#{$fa-css-prefix}-buromobelexperte:before { content: fa-content($fa-var-buromobelexperte); }
+.#{$fa-css-prefix}-bus:before { content: fa-content($fa-var-bus); }
+.#{$fa-css-prefix}-buysellads:before { content: fa-content($fa-var-buysellads); }
+.#{$fa-css-prefix}-calculator:before { content: fa-content($fa-var-calculator); }
+.#{$fa-css-prefix}-calendar:before { content: fa-content($fa-var-calendar); }
+.#{$fa-css-prefix}-calendar-alt:before { content: fa-content($fa-var-calendar-alt); }
+.#{$fa-css-prefix}-calendar-check:before { content: fa-content($fa-var-calendar-check); }
+.#{$fa-css-prefix}-calendar-minus:before { content: fa-content($fa-var-calendar-minus); }
+.#{$fa-css-prefix}-calendar-plus:before { content: fa-content($fa-var-calendar-plus); }
+.#{$fa-css-prefix}-calendar-times:before { content: fa-content($fa-var-calendar-times); }
+.#{$fa-css-prefix}-camera:before { content: fa-content($fa-var-camera); }
+.#{$fa-css-prefix}-camera-retro:before { content: fa-content($fa-var-camera-retro); }
+.#{$fa-css-prefix}-car:before { content: fa-content($fa-var-car); }
+.#{$fa-css-prefix}-caret-down:before { content: fa-content($fa-var-caret-down); }
+.#{$fa-css-prefix}-caret-left:before { content: fa-content($fa-var-caret-left); }
+.#{$fa-css-prefix}-caret-right:before { content: fa-content($fa-var-caret-right); }
+.#{$fa-css-prefix}-caret-square-down:before { content: fa-content($fa-var-caret-square-down); }
+.#{$fa-css-prefix}-caret-square-left:before { content: fa-content($fa-var-caret-square-left); }
+.#{$fa-css-prefix}-caret-square-right:before { content: fa-content($fa-var-caret-square-right); }
+.#{$fa-css-prefix}-caret-square-up:before { content: fa-content($fa-var-caret-square-up); }
+.#{$fa-css-prefix}-caret-up:before { content: fa-content($fa-var-caret-up); }
+.#{$fa-css-prefix}-cart-arrow-down:before { content: fa-content($fa-var-cart-arrow-down); }
+.#{$fa-css-prefix}-cart-plus:before { content: fa-content($fa-var-cart-plus); }
+.#{$fa-css-prefix}-cc-amazon-pay:before { content: fa-content($fa-var-cc-amazon-pay); }
+.#{$fa-css-prefix}-cc-amex:before { content: fa-content($fa-var-cc-amex); }
+.#{$fa-css-prefix}-cc-apple-pay:before { content: fa-content($fa-var-cc-apple-pay); }
+.#{$fa-css-prefix}-cc-diners-club:before { content: fa-content($fa-var-cc-diners-club); }
+.#{$fa-css-prefix}-cc-discover:before { content: fa-content($fa-var-cc-discover); }
+.#{$fa-css-prefix}-cc-jcb:before { content: fa-content($fa-var-cc-jcb); }
+.#{$fa-css-prefix}-cc-mastercard:before { content: fa-content($fa-var-cc-mastercard); }
+.#{$fa-css-prefix}-cc-paypal:before { content: fa-content($fa-var-cc-paypal); }
+.#{$fa-css-prefix}-cc-stripe:before { content: fa-content($fa-var-cc-stripe); }
+.#{$fa-css-prefix}-cc-visa:before { content: fa-content($fa-var-cc-visa); }
+.#{$fa-css-prefix}-centercode:before { content: fa-content($fa-var-centercode); }
+.#{$fa-css-prefix}-certificate:before { content: fa-content($fa-var-certificate); }
+.#{$fa-css-prefix}-chart-area:before { content: fa-content($fa-var-chart-area); }
+.#{$fa-css-prefix}-chart-bar:before { content: fa-content($fa-var-chart-bar); }
+.#{$fa-css-prefix}-chart-line:before { content: fa-content($fa-var-chart-line); }
+.#{$fa-css-prefix}-chart-pie:before { content: fa-content($fa-var-chart-pie); }
+.#{$fa-css-prefix}-check:before { content: fa-content($fa-var-check); }
+.#{$fa-css-prefix}-check-circle:before { content: fa-content($fa-var-check-circle); }
+.#{$fa-css-prefix}-check-square:before { content: fa-content($fa-var-check-square); }
+.#{$fa-css-prefix}-chevron-circle-down:before { content: fa-content($fa-var-chevron-circle-down); }
+.#{$fa-css-prefix}-chevron-circle-left:before { content: fa-content($fa-var-chevron-circle-left); }
+.#{$fa-css-prefix}-chevron-circle-right:before { content: fa-content($fa-var-chevron-circle-right); }
+.#{$fa-css-prefix}-chevron-circle-up:before { content: fa-content($fa-var-chevron-circle-up); }
+.#{$fa-css-prefix}-chevron-down:before { content: fa-content($fa-var-chevron-down); }
+.#{$fa-css-prefix}-chevron-left:before { content: fa-content($fa-var-chevron-left); }
+.#{$fa-css-prefix}-chevron-right:before { content: fa-content($fa-var-chevron-right); }
+.#{$fa-css-prefix}-chevron-up:before { content: fa-content($fa-var-chevron-up); }
+.#{$fa-css-prefix}-child:before { content: fa-content($fa-var-child); }
+.#{$fa-css-prefix}-chrome:before { content: fa-content($fa-var-chrome); }
+.#{$fa-css-prefix}-circle:before { content: fa-content($fa-var-circle); }
+.#{$fa-css-prefix}-circle-notch:before { content: fa-content($fa-var-circle-notch); }
+.#{$fa-css-prefix}-clipboard:before { content: fa-content($fa-var-clipboard); }
+.#{$fa-css-prefix}-clock:before { content: fa-content($fa-var-clock); }
+.#{$fa-css-prefix}-clone:before { content: fa-content($fa-var-clone); }
+.#{$fa-css-prefix}-closed-captioning:before { content: fa-content($fa-var-closed-captioning); }
+.#{$fa-css-prefix}-cloud:before { content: fa-content($fa-var-cloud); }
+.#{$fa-css-prefix}-cloud-download-alt:before { content: fa-content($fa-var-cloud-download-alt); }
+.#{$fa-css-prefix}-cloud-upload-alt:before { content: fa-content($fa-var-cloud-upload-alt); }
+.#{$fa-css-prefix}-cloudscale:before { content: fa-content($fa-var-cloudscale); }
+.#{$fa-css-prefix}-cloudsmith:before { content: fa-content($fa-var-cloudsmith); }
+.#{$fa-css-prefix}-cloudversify:before { content: fa-content($fa-var-cloudversify); }
+.#{$fa-css-prefix}-code:before { content: fa-content($fa-var-code); }
+.#{$fa-css-prefix}-code-branch:before { content: fa-content($fa-var-code-branch); }
+.#{$fa-css-prefix}-codepen:before { content: fa-content($fa-var-codepen); }
+.#{$fa-css-prefix}-codiepie:before { content: fa-content($fa-var-codiepie); }
+.#{$fa-css-prefix}-coffee:before { content: fa-content($fa-var-coffee); }
+.#{$fa-css-prefix}-cog:before { content: fa-content($fa-var-cog); }
+.#{$fa-css-prefix}-cogs:before { content: fa-content($fa-var-cogs); }
+.#{$fa-css-prefix}-columns:before { content: fa-content($fa-var-columns); }
+.#{$fa-css-prefix}-comment:before { content: fa-content($fa-var-comment); }
+.#{$fa-css-prefix}-comment-alt:before { content: fa-content($fa-var-comment-alt); }
+.#{$fa-css-prefix}-comments:before { content: fa-content($fa-var-comments); }
+.#{$fa-css-prefix}-compass:before { content: fa-content($fa-var-compass); }
+.#{$fa-css-prefix}-compress:before { content: fa-content($fa-var-compress); }
+.#{$fa-css-prefix}-connectdevelop:before { content: fa-content($fa-var-connectdevelop); }
+.#{$fa-css-prefix}-contao:before { content: fa-content($fa-var-contao); }
+.#{$fa-css-prefix}-copy:before { content: fa-content($fa-var-copy); }
+.#{$fa-css-prefix}-copyright:before { content: fa-content($fa-var-copyright); }
+.#{$fa-css-prefix}-cpanel:before { content: fa-content($fa-var-cpanel); }
+.#{$fa-css-prefix}-creative-commons:before { content: fa-content($fa-var-creative-commons); }
+.#{$fa-css-prefix}-credit-card:before { content: fa-content($fa-var-credit-card); }
+.#{$fa-css-prefix}-crop:before { content: fa-content($fa-var-crop); }
+.#{$fa-css-prefix}-crosshairs:before { content: fa-content($fa-var-crosshairs); }
+.#{$fa-css-prefix}-css3:before { content: fa-content($fa-var-css3); }
+.#{$fa-css-prefix}-css3-alt:before { content: fa-content($fa-var-css3-alt); }
+.#{$fa-css-prefix}-cube:before { content: fa-content($fa-var-cube); }
+.#{$fa-css-prefix}-cubes:before { content: fa-content($fa-var-cubes); }
+.#{$fa-css-prefix}-cut:before { content: fa-content($fa-var-cut); }
+.#{$fa-css-prefix}-cuttlefish:before { content: fa-content($fa-var-cuttlefish); }
+.#{$fa-css-prefix}-d-and-d:before { content: fa-content($fa-var-d-and-d); }
+.#{$fa-css-prefix}-dashcube:before { content: fa-content($fa-var-dashcube); }
+.#{$fa-css-prefix}-database:before { content: fa-content($fa-var-database); }
+.#{$fa-css-prefix}-deaf:before { content: fa-content($fa-var-deaf); }
+.#{$fa-css-prefix}-delicious:before { content: fa-content($fa-var-delicious); }
+.#{$fa-css-prefix}-deploydog:before { content: fa-content($fa-var-deploydog); }
+.#{$fa-css-prefix}-deskpro:before { content: fa-content($fa-var-deskpro); }
+.#{$fa-css-prefix}-desktop:before { content: fa-content($fa-var-desktop); }
+.#{$fa-css-prefix}-deviantart:before { content: fa-content($fa-var-deviantart); }
+.#{$fa-css-prefix}-digg:before { content: fa-content($fa-var-digg); }
+.#{$fa-css-prefix}-digital-ocean:before { content: fa-content($fa-var-digital-ocean); }
+.#{$fa-css-prefix}-discord:before { content: fa-content($fa-var-discord); }
+.#{$fa-css-prefix}-discourse:before { content: fa-content($fa-var-discourse); }
+.#{$fa-css-prefix}-dochub:before { content: fa-content($fa-var-dochub); }
+.#{$fa-css-prefix}-docker:before { content: fa-content($fa-var-docker); }
+.#{$fa-css-prefix}-dollar-sign:before { content: fa-content($fa-var-dollar-sign); }
+.#{$fa-css-prefix}-dot-circle:before { content: fa-content($fa-var-dot-circle); }
+.#{$fa-css-prefix}-download:before { content: fa-content($fa-var-download); }
+.#{$fa-css-prefix}-draft2digital:before { content: fa-content($fa-var-draft2digital); }
+.#{$fa-css-prefix}-dribbble:before { content: fa-content($fa-var-dribbble); }
+.#{$fa-css-prefix}-dribbble-square:before { content: fa-content($fa-var-dribbble-square); }
+.#{$fa-css-prefix}-dropbox:before { content: fa-content($fa-var-dropbox); }
+.#{$fa-css-prefix}-drupal:before { content: fa-content($fa-var-drupal); }
+.#{$fa-css-prefix}-dyalog:before { content: fa-content($fa-var-dyalog); }
+.#{$fa-css-prefix}-earlybirds:before { content: fa-content($fa-var-earlybirds); }
+.#{$fa-css-prefix}-edge:before { content: fa-content($fa-var-edge); }
+.#{$fa-css-prefix}-edit:before { content: fa-content($fa-var-edit); }
+.#{$fa-css-prefix}-eject:before { content: fa-content($fa-var-eject); }
+.#{$fa-css-prefix}-ellipsis-h:before { content: fa-content($fa-var-ellipsis-h); }
+.#{$fa-css-prefix}-ellipsis-v:before { content: fa-content($fa-var-ellipsis-v); }
+.#{$fa-css-prefix}-ember:before { content: fa-content($fa-var-ember); }
+.#{$fa-css-prefix}-empire:before { content: fa-content($fa-var-empire); }
+.#{$fa-css-prefix}-envelope:before { content: fa-content($fa-var-envelope); }
+.#{$fa-css-prefix}-envelope-open:before { content: fa-content($fa-var-envelope-open); }
+.#{$fa-css-prefix}-envelope-square:before { content: fa-content($fa-var-envelope-square); }
+.#{$fa-css-prefix}-envira:before { content: fa-content($fa-var-envira); }
+.#{$fa-css-prefix}-eraser:before { content: fa-content($fa-var-eraser); }
+.#{$fa-css-prefix}-erlang:before { content: fa-content($fa-var-erlang); }
+.#{$fa-css-prefix}-ethereum:before { content: fa-content($fa-var-ethereum); }
+.#{$fa-css-prefix}-etsy:before { content: fa-content($fa-var-etsy); }
+.#{$fa-css-prefix}-euro-sign:before { content: fa-content($fa-var-euro-sign); }
+.#{$fa-css-prefix}-exchange-alt:before { content: fa-content($fa-var-exchange-alt); }
+.#{$fa-css-prefix}-exclamation:before { content: fa-content($fa-var-exclamation); }
+.#{$fa-css-prefix}-exclamation-circle:before { content: fa-content($fa-var-exclamation-circle); }
+.#{$fa-css-prefix}-exclamation-triangle:before { content: fa-content($fa-var-exclamation-triangle); }
+.#{$fa-css-prefix}-expand:before { content: fa-content($fa-var-expand); }
+.#{$fa-css-prefix}-expand-arrows-alt:before { content: fa-content($fa-var-expand-arrows-alt); }
+.#{$fa-css-prefix}-expeditedssl:before { content: fa-content($fa-var-expeditedssl); }
+.#{$fa-css-prefix}-external-link-alt:before { content: fa-content($fa-var-external-link-alt); }
+.#{$fa-css-prefix}-external-link-square-alt:before { content: fa-content($fa-var-external-link-square-alt); }
+.#{$fa-css-prefix}-eye:before { content: fa-content($fa-var-eye); }
+.#{$fa-css-prefix}-eye-dropper:before { content: fa-content($fa-var-eye-dropper); }
+.#{$fa-css-prefix}-eye-slash:before { content: fa-content($fa-var-eye-slash); }
+.#{$fa-css-prefix}-facebook:before { content: fa-content($fa-var-facebook); }
+.#{$fa-css-prefix}-facebook-f:before { content: fa-content($fa-var-facebook-f); }
+.#{$fa-css-prefix}-facebook-messenger:before { content: fa-content($fa-var-facebook-messenger); }
+.#{$fa-css-prefix}-facebook-square:before { content: fa-content($fa-var-facebook-square); }
+.#{$fa-css-prefix}-fast-backward:before { content: fa-content($fa-var-fast-backward); }
+.#{$fa-css-prefix}-fast-forward:before { content: fa-content($fa-var-fast-forward); }
+.#{$fa-css-prefix}-fax:before { content: fa-content($fa-var-fax); }
+.#{$fa-css-prefix}-female:before { content: fa-content($fa-var-female); }
+.#{$fa-css-prefix}-fighter-jet:before { content: fa-content($fa-var-fighter-jet); }
+.#{$fa-css-prefix}-file:before { content: fa-content($fa-var-file); }
+.#{$fa-css-prefix}-file-alt:before { content: fa-content($fa-var-file-alt); }
+.#{$fa-css-prefix}-file-archive:before { content: fa-content($fa-var-file-archive); }
+.#{$fa-css-prefix}-file-audio:before { content: fa-content($fa-var-file-audio); }
+.#{$fa-css-prefix}-file-code:before { content: fa-content($fa-var-file-code); }
+.#{$fa-css-prefix}-file-excel:before { content: fa-content($fa-var-file-excel); }
+.#{$fa-css-prefix}-file-image:before { content: fa-content($fa-var-file-image); }
+.#{$fa-css-prefix}-file-pdf:before { content: fa-content($fa-var-file-pdf); }
+.#{$fa-css-prefix}-file-powerpoint:before { content: fa-content($fa-var-file-powerpoint); }
+.#{$fa-css-prefix}-file-video:before { content: fa-content($fa-var-file-video); }
+.#{$fa-css-prefix}-file-word:before { content: fa-content($fa-var-file-word); }
+.#{$fa-css-prefix}-film:before { content: fa-content($fa-var-film); }
+.#{$fa-css-prefix}-filter:before { content: fa-content($fa-var-filter); }
+.#{$fa-css-prefix}-fire:before { content: fa-content($fa-var-fire); }
+.#{$fa-css-prefix}-fire-extinguisher:before { content: fa-content($fa-var-fire-extinguisher); }
+.#{$fa-css-prefix}-firefox:before { content: fa-content($fa-var-firefox); }
+.#{$fa-css-prefix}-first-order:before { content: fa-content($fa-var-first-order); }
+.#{$fa-css-prefix}-firstdraft:before { content: fa-content($fa-var-firstdraft); }
+.#{$fa-css-prefix}-flag:before { content: fa-content($fa-var-flag); }
+.#{$fa-css-prefix}-flag-checkered:before { content: fa-content($fa-var-flag-checkered); }
+.#{$fa-css-prefix}-flask:before { content: fa-content($fa-var-flask); }
+.#{$fa-css-prefix}-flickr:before { content: fa-content($fa-var-flickr); }
+.#{$fa-css-prefix}-fly:before { content: fa-content($fa-var-fly); }
+.#{$fa-css-prefix}-folder:before { content: fa-content($fa-var-folder); }
+.#{$fa-css-prefix}-folder-open:before { content: fa-content($fa-var-folder-open); }
+.#{$fa-css-prefix}-font:before { content: fa-content($fa-var-font); }
+.#{$fa-css-prefix}-font-awesome:before { content: fa-content($fa-var-font-awesome); }
+.#{$fa-css-prefix}-font-awesome-alt:before { content: fa-content($fa-var-font-awesome-alt); }
+.#{$fa-css-prefix}-font-awesome-flag:before { content: fa-content($fa-var-font-awesome-flag); }
+.#{$fa-css-prefix}-fonticons:before { content: fa-content($fa-var-fonticons); }
+.#{$fa-css-prefix}-fonticons-fi:before { content: fa-content($fa-var-fonticons-fi); }
+.#{$fa-css-prefix}-fort-awesome:before { content: fa-content($fa-var-fort-awesome); }
+.#{$fa-css-prefix}-fort-awesome-alt:before { content: fa-content($fa-var-fort-awesome-alt); }
+.#{$fa-css-prefix}-forumbee:before { content: fa-content($fa-var-forumbee); }
+.#{$fa-css-prefix}-forward:before { content: fa-content($fa-var-forward); }
+.#{$fa-css-prefix}-foursquare:before { content: fa-content($fa-var-foursquare); }
+.#{$fa-css-prefix}-free-code-camp:before { content: fa-content($fa-var-free-code-camp); }
+.#{$fa-css-prefix}-freebsd:before { content: fa-content($fa-var-freebsd); }
+.#{$fa-css-prefix}-frown:before { content: fa-content($fa-var-frown); }
+.#{$fa-css-prefix}-futbol:before { content: fa-content($fa-var-futbol); }
+.#{$fa-css-prefix}-gamepad:before { content: fa-content($fa-var-gamepad); }
+.#{$fa-css-prefix}-gavel:before { content: fa-content($fa-var-gavel); }
+.#{$fa-css-prefix}-gem:before { content: fa-content($fa-var-gem); }
+.#{$fa-css-prefix}-genderless:before { content: fa-content($fa-var-genderless); }
+.#{$fa-css-prefix}-get-pocket:before { content: fa-content($fa-var-get-pocket); }
+.#{$fa-css-prefix}-gg:before { content: fa-content($fa-var-gg); }
+.#{$fa-css-prefix}-gg-circle:before { content: fa-content($fa-var-gg-circle); }
+.#{$fa-css-prefix}-gift:before { content: fa-content($fa-var-gift); }
+.#{$fa-css-prefix}-git:before { content: fa-content($fa-var-git); }
+.#{$fa-css-prefix}-git-square:before { content: fa-content($fa-var-git-square); }
+.#{$fa-css-prefix}-github:before { content: fa-content($fa-var-github); }
+.#{$fa-css-prefix}-github-alt:before { content: fa-content($fa-var-github-alt); }
+.#{$fa-css-prefix}-github-square:before { content: fa-content($fa-var-github-square); }
+.#{$fa-css-prefix}-gitkraken:before { content: fa-content($fa-var-gitkraken); }
+.#{$fa-css-prefix}-gitlab:before { content: fa-content($fa-var-gitlab); }
+.#{$fa-css-prefix}-gitter:before { content: fa-content($fa-var-gitter); }
+.#{$fa-css-prefix}-glass-martini:before { content: fa-content($fa-var-glass-martini); }
+.#{$fa-css-prefix}-glide:before { content: fa-content($fa-var-glide); }
+.#{$fa-css-prefix}-glide-g:before { content: fa-content($fa-var-glide-g); }
+.#{$fa-css-prefix}-globe:before { content: fa-content($fa-var-globe); }
+.#{$fa-css-prefix}-gofore:before { content: fa-content($fa-var-gofore); }
+.#{$fa-css-prefix}-goodreads:before { content: fa-content($fa-var-goodreads); }
+.#{$fa-css-prefix}-goodreads-g:before { content: fa-content($fa-var-goodreads-g); }
+.#{$fa-css-prefix}-google:before { content: fa-content($fa-var-google); }
+.#{$fa-css-prefix}-google-drive:before { content: fa-content($fa-var-google-drive); }
+.#{$fa-css-prefix}-google-play:before { content: fa-content($fa-var-google-play); }
+.#{$fa-css-prefix}-google-plus:before { content: fa-content($fa-var-google-plus); }
+.#{$fa-css-prefix}-google-plus-g:before { content: fa-content($fa-var-google-plus-g); }
+.#{$fa-css-prefix}-google-plus-square:before { content: fa-content($fa-var-google-plus-square); }
+.#{$fa-css-prefix}-google-wallet:before { content: fa-content($fa-var-google-wallet); }
+.#{$fa-css-prefix}-graduation-cap:before { content: fa-content($fa-var-graduation-cap); }
+.#{$fa-css-prefix}-gratipay:before { content: fa-content($fa-var-gratipay); }
+.#{$fa-css-prefix}-grav:before { content: fa-content($fa-var-grav); }
+.#{$fa-css-prefix}-gripfire:before { content: fa-content($fa-var-gripfire); }
+.#{$fa-css-prefix}-grunt:before { content: fa-content($fa-var-grunt); }
+.#{$fa-css-prefix}-gulp:before { content: fa-content($fa-var-gulp); }
+.#{$fa-css-prefix}-h-square:before { content: fa-content($fa-var-h-square); }
+.#{$fa-css-prefix}-hacker-news:before { content: fa-content($fa-var-hacker-news); }
+.#{$fa-css-prefix}-hacker-news-square:before { content: fa-content($fa-var-hacker-news-square); }
+.#{$fa-css-prefix}-hand-lizard:before { content: fa-content($fa-var-hand-lizard); }
+.#{$fa-css-prefix}-hand-paper:before { content: fa-content($fa-var-hand-paper); }
+.#{$fa-css-prefix}-hand-peace:before { content: fa-content($fa-var-hand-peace); }
+.#{$fa-css-prefix}-hand-point-down:before { content: fa-content($fa-var-hand-point-down); }
+.#{$fa-css-prefix}-hand-point-left:before { content: fa-content($fa-var-hand-point-left); }
+.#{$fa-css-prefix}-hand-point-right:before { content: fa-content($fa-var-hand-point-right); }
+.#{$fa-css-prefix}-hand-point-up:before { content: fa-content($fa-var-hand-point-up); }
+.#{$fa-css-prefix}-hand-pointer:before { content: fa-content($fa-var-hand-pointer); }
+.#{$fa-css-prefix}-hand-rock:before { content: fa-content($fa-var-hand-rock); }
+.#{$fa-css-prefix}-hand-scissors:before { content: fa-content($fa-var-hand-scissors); }
+.#{$fa-css-prefix}-hand-spock:before { content: fa-content($fa-var-hand-spock); }
+.#{$fa-css-prefix}-handshake:before { content: fa-content($fa-var-handshake); }
+.#{$fa-css-prefix}-hashtag:before { content: fa-content($fa-var-hashtag); }
+.#{$fa-css-prefix}-hdd:before { content: fa-content($fa-var-hdd); }
+.#{$fa-css-prefix}-heading:before { content: fa-content($fa-var-heading); }
+.#{$fa-css-prefix}-headphones:before { content: fa-content($fa-var-headphones); }
+.#{$fa-css-prefix}-heart:before { content: fa-content($fa-var-heart); }
+.#{$fa-css-prefix}-heartbeat:before { content: fa-content($fa-var-heartbeat); }
+.#{$fa-css-prefix}-hire-a-helper:before { content: fa-content($fa-var-hire-a-helper); }
+.#{$fa-css-prefix}-history:before { content: fa-content($fa-var-history); }
+.#{$fa-css-prefix}-home:before { content: fa-content($fa-var-home); }
+.#{$fa-css-prefix}-hooli:before { content: fa-content($fa-var-hooli); }
+.#{$fa-css-prefix}-hospital:before { content: fa-content($fa-var-hospital); }
+.#{$fa-css-prefix}-hotjar:before { content: fa-content($fa-var-hotjar); }
+.#{$fa-css-prefix}-hourglass:before { content: fa-content($fa-var-hourglass); }
+.#{$fa-css-prefix}-hourglass-end:before { content: fa-content($fa-var-hourglass-end); }
+.#{$fa-css-prefix}-hourglass-half:before { content: fa-content($fa-var-hourglass-half); }
+.#{$fa-css-prefix}-hourglass-start:before { content: fa-content($fa-var-hourglass-start); }
+.#{$fa-css-prefix}-houzz:before { content: fa-content($fa-var-houzz); }
+.#{$fa-css-prefix}-html5:before { content: fa-content($fa-var-html5); }
+.#{$fa-css-prefix}-hubspot:before { content: fa-content($fa-var-hubspot); }
+.#{$fa-css-prefix}-i-cursor:before { content: fa-content($fa-var-i-cursor); }
+.#{$fa-css-prefix}-id-badge:before { content: fa-content($fa-var-id-badge); }
+.#{$fa-css-prefix}-id-card:before { content: fa-content($fa-var-id-card); }
+.#{$fa-css-prefix}-image:before { content: fa-content($fa-var-image); }
+.#{$fa-css-prefix}-images:before { content: fa-content($fa-var-images); }
+.#{$fa-css-prefix}-imdb:before { content: fa-content($fa-var-imdb); }
+.#{$fa-css-prefix}-inbox:before { content: fa-content($fa-var-inbox); }
+.#{$fa-css-prefix}-indent:before { content: fa-content($fa-var-indent); }
+.#{$fa-css-prefix}-industry:before { content: fa-content($fa-var-industry); }
+.#{$fa-css-prefix}-info:before { content: fa-content($fa-var-info); }
+.#{$fa-css-prefix}-info-circle:before { content: fa-content($fa-var-info-circle); }
+.#{$fa-css-prefix}-instagram:before { content: fa-content($fa-var-instagram); }
+.#{$fa-css-prefix}-internet-explorer:before { content: fa-content($fa-var-internet-explorer); }
+.#{$fa-css-prefix}-ioxhost:before { content: fa-content($fa-var-ioxhost); }
+.#{$fa-css-prefix}-italic:before { content: fa-content($fa-var-italic); }
+.#{$fa-css-prefix}-itunes:before { content: fa-content($fa-var-itunes); }
+.#{$fa-css-prefix}-itunes-note:before { content: fa-content($fa-var-itunes-note); }
+.#{$fa-css-prefix}-jenkins:before { content: fa-content($fa-var-jenkins); }
+.#{$fa-css-prefix}-joget:before { content: fa-content($fa-var-joget); }
+.#{$fa-css-prefix}-joomla:before { content: fa-content($fa-var-joomla); }
+.#{$fa-css-prefix}-js:before { content: fa-content($fa-var-js); }
+.#{$fa-css-prefix}-js-square:before { content: fa-content($fa-var-js-square); }
+.#{$fa-css-prefix}-jsfiddle:before { content: fa-content($fa-var-jsfiddle); }
+.#{$fa-css-prefix}-key:before { content: fa-content($fa-var-key); }
+.#{$fa-css-prefix}-keyboard:before { content: fa-content($fa-var-keyboard); }
+.#{$fa-css-prefix}-keycdn:before { content: fa-content($fa-var-keycdn); }
+.#{$fa-css-prefix}-kickstarter:before { content: fa-content($fa-var-kickstarter); }
+.#{$fa-css-prefix}-kickstarter-k:before { content: fa-content($fa-var-kickstarter-k); }
+.#{$fa-css-prefix}-korvue:before { content: fa-content($fa-var-korvue); }
+.#{$fa-css-prefix}-language:before { content: fa-content($fa-var-language); }
+.#{$fa-css-prefix}-laptop:before { content: fa-content($fa-var-laptop); }
+.#{$fa-css-prefix}-laravel:before { content: fa-content($fa-var-laravel); }
+.#{$fa-css-prefix}-lastfm:before { content: fa-content($fa-var-lastfm); }
+.#{$fa-css-prefix}-lastfm-square:before { content: fa-content($fa-var-lastfm-square); }
+.#{$fa-css-prefix}-leaf:before { content: fa-content($fa-var-leaf); }
+.#{$fa-css-prefix}-leanpub:before { content: fa-content($fa-var-leanpub); }
+.#{$fa-css-prefix}-lemon:before { content: fa-content($fa-var-lemon); }
+.#{$fa-css-prefix}-less:before { content: fa-content($fa-var-less); }
+.#{$fa-css-prefix}-level-down-alt:before { content: fa-content($fa-var-level-down-alt); }
+.#{$fa-css-prefix}-level-up-alt:before { content: fa-content($fa-var-level-up-alt); }
+.#{$fa-css-prefix}-life-ring:before { content: fa-content($fa-var-life-ring); }
+.#{$fa-css-prefix}-lightbulb:before { content: fa-content($fa-var-lightbulb); }
+.#{$fa-css-prefix}-line:before { content: fa-content($fa-var-line); }
+.#{$fa-css-prefix}-link:before { content: fa-content($fa-var-link); }
+.#{$fa-css-prefix}-linkedin:before { content: fa-content($fa-var-linkedin); }
+.#{$fa-css-prefix}-linkedin-in:before { content: fa-content($fa-var-linkedin-in); }
+.#{$fa-css-prefix}-linode:before { content: fa-content($fa-var-linode); }
+.#{$fa-css-prefix}-linux:before { content: fa-content($fa-var-linux); }
+.#{$fa-css-prefix}-lira-sign:before { content: fa-content($fa-var-lira-sign); }
+.#{$fa-css-prefix}-list:before { content: fa-content($fa-var-list); }
+.#{$fa-css-prefix}-list-alt:before { content: fa-content($fa-var-list-alt); }
+.#{$fa-css-prefix}-list-ol:before { content: fa-content($fa-var-list-ol); }
+.#{$fa-css-prefix}-list-ul:before { content: fa-content($fa-var-list-ul); }
+.#{$fa-css-prefix}-location-arrow:before { content: fa-content($fa-var-location-arrow); }
+.#{$fa-css-prefix}-lock:before { content: fa-content($fa-var-lock); }
+.#{$fa-css-prefix}-lock-open:before { content: fa-content($fa-var-lock-open); }
+.#{$fa-css-prefix}-long-arrow-alt-down:before { content: fa-content($fa-var-long-arrow-alt-down); }
+.#{$fa-css-prefix}-long-arrow-alt-left:before { content: fa-content($fa-var-long-arrow-alt-left); }
+.#{$fa-css-prefix}-long-arrow-alt-right:before { content: fa-content($fa-var-long-arrow-alt-right); }
+.#{$fa-css-prefix}-long-arrow-alt-up:before { content: fa-content($fa-var-long-arrow-alt-up); }
+.#{$fa-css-prefix}-low-vision:before { content: fa-content($fa-var-low-vision); }
+.#{$fa-css-prefix}-lyft:before { content: fa-content($fa-var-lyft); }
+.#{$fa-css-prefix}-magento:before { content: fa-content($fa-var-magento); }
+.#{$fa-css-prefix}-magic:before { content: fa-content($fa-var-magic); }
+.#{$fa-css-prefix}-magnet:before { content: fa-content($fa-var-magnet); }
+.#{$fa-css-prefix}-male:before { content: fa-content($fa-var-male); }
+.#{$fa-css-prefix}-map:before { content: fa-content($fa-var-map); }
+.#{$fa-css-prefix}-map-marker:before { content: fa-content($fa-var-map-marker); }
+.#{$fa-css-prefix}-map-marker-alt:before { content: fa-content($fa-var-map-marker-alt); }
+.#{$fa-css-prefix}-map-pin:before { content: fa-content($fa-var-map-pin); }
+.#{$fa-css-prefix}-map-signs:before { content: fa-content($fa-var-map-signs); }
+.#{$fa-css-prefix}-mars:before { content: fa-content($fa-var-mars); }
+.#{$fa-css-prefix}-mars-double:before { content: fa-content($fa-var-mars-double); }
+.#{$fa-css-prefix}-mars-stroke:before { content: fa-content($fa-var-mars-stroke); }
+.#{$fa-css-prefix}-mars-stroke-h:before { content: fa-content($fa-var-mars-stroke-h); }
+.#{$fa-css-prefix}-mars-stroke-v:before { content: fa-content($fa-var-mars-stroke-v); }
+.#{$fa-css-prefix}-maxcdn:before { content: fa-content($fa-var-maxcdn); }
+.#{$fa-css-prefix}-medapps:before { content: fa-content($fa-var-medapps); }
+.#{$fa-css-prefix}-medium:before { content: fa-content($fa-var-medium); }
+.#{$fa-css-prefix}-medium-m:before { content: fa-content($fa-var-medium-m); }
+.#{$fa-css-prefix}-medkit:before { content: fa-content($fa-var-medkit); }
+.#{$fa-css-prefix}-medrt:before { content: fa-content($fa-var-medrt); }
+.#{$fa-css-prefix}-meetup:before { content: fa-content($fa-var-meetup); }
+.#{$fa-css-prefix}-meh:before { content: fa-content($fa-var-meh); }
+.#{$fa-css-prefix}-mercury:before { content: fa-content($fa-var-mercury); }
+.#{$fa-css-prefix}-microchip:before { content: fa-content($fa-var-microchip); }
+.#{$fa-css-prefix}-microphone:before { content: fa-content($fa-var-microphone); }
+.#{$fa-css-prefix}-microphone-slash:before { content: fa-content($fa-var-microphone-slash); }
+.#{$fa-css-prefix}-microsoft:before { content: fa-content($fa-var-microsoft); }
+.#{$fa-css-prefix}-minus:before { content: fa-content($fa-var-minus); }
+.#{$fa-css-prefix}-minus-circle:before { content: fa-content($fa-var-minus-circle); }
+.#{$fa-css-prefix}-minus-square:before { content: fa-content($fa-var-minus-square); }
+.#{$fa-css-prefix}-mix:before { content: fa-content($fa-var-mix); }
+.#{$fa-css-prefix}-mixcloud:before { content: fa-content($fa-var-mixcloud); }
+.#{$fa-css-prefix}-mizuni:before { content: fa-content($fa-var-mizuni); }
+.#{$fa-css-prefix}-mobile:before { content: fa-content($fa-var-mobile); }
+.#{$fa-css-prefix}-mobile-alt:before { content: fa-content($fa-var-mobile-alt); }
+.#{$fa-css-prefix}-modx:before { content: fa-content($fa-var-modx); }
+.#{$fa-css-prefix}-monero:before { content: fa-content($fa-var-monero); }
+.#{$fa-css-prefix}-money-bill-alt:before { content: fa-content($fa-var-money-bill-alt); }
+.#{$fa-css-prefix}-moon:before { content: fa-content($fa-var-moon); }
+.#{$fa-css-prefix}-motorcycle:before { content: fa-content($fa-var-motorcycle); }
+.#{$fa-css-prefix}-mouse-pointer:before { content: fa-content($fa-var-mouse-pointer); }
+.#{$fa-css-prefix}-music:before { content: fa-content($fa-var-music); }
+.#{$fa-css-prefix}-napster:before { content: fa-content($fa-var-napster); }
+.#{$fa-css-prefix}-neuter:before { content: fa-content($fa-var-neuter); }
+.#{$fa-css-prefix}-newspaper:before { content: fa-content($fa-var-newspaper); }
+.#{$fa-css-prefix}-nintendo-switch:before { content: fa-content($fa-var-nintendo-switch); }
+.#{$fa-css-prefix}-node:before { content: fa-content($fa-var-node); }
+.#{$fa-css-prefix}-node-js:before { content: fa-content($fa-var-node-js); }
+.#{$fa-css-prefix}-npm:before { content: fa-content($fa-var-npm); }
+.#{$fa-css-prefix}-ns8:before { content: fa-content($fa-var-ns8); }
+.#{$fa-css-prefix}-nutritionix:before { content: fa-content($fa-var-nutritionix); }
+.#{$fa-css-prefix}-object-group:before { content: fa-content($fa-var-object-group); }
+.#{$fa-css-prefix}-object-ungroup:before { content: fa-content($fa-var-object-ungroup); }
+.#{$fa-css-prefix}-odnoklassniki:before { content: fa-content($fa-var-odnoklassniki); }
+.#{$fa-css-prefix}-odnoklassniki-square:before { content: fa-content($fa-var-odnoklassniki-square); }
+.#{$fa-css-prefix}-opencart:before { content: fa-content($fa-var-opencart); }
+.#{$fa-css-prefix}-openid:before { content: fa-content($fa-var-openid); }
+.#{$fa-css-prefix}-opera:before { content: fa-content($fa-var-opera); }
+.#{$fa-css-prefix}-optin-monster:before { content: fa-content($fa-var-optin-monster); }
+.#{$fa-css-prefix}-osi:before { content: fa-content($fa-var-osi); }
+.#{$fa-css-prefix}-outdent:before { content: fa-content($fa-var-outdent); }
+.#{$fa-css-prefix}-page4:before { content: fa-content($fa-var-page4); }
+.#{$fa-css-prefix}-pagelines:before { content: fa-content($fa-var-pagelines); }
+.#{$fa-css-prefix}-paint-brush:before { content: fa-content($fa-var-paint-brush); }
+.#{$fa-css-prefix}-palfed:before { content: fa-content($fa-var-palfed); }
+.#{$fa-css-prefix}-paper-plane:before { content: fa-content($fa-var-paper-plane); }
+.#{$fa-css-prefix}-paperclip:before { content: fa-content($fa-var-paperclip); }
+.#{$fa-css-prefix}-paragraph:before { content: fa-content($fa-var-paragraph); }
+.#{$fa-css-prefix}-paste:before { content: fa-content($fa-var-paste); }
+.#{$fa-css-prefix}-patreon:before { content: fa-content($fa-var-patreon); }
+.#{$fa-css-prefix}-pause:before { content: fa-content($fa-var-pause); }
+.#{$fa-css-prefix}-pause-circle:before { content: fa-content($fa-var-pause-circle); }
+.#{$fa-css-prefix}-paw:before { content: fa-content($fa-var-paw); }
+.#{$fa-css-prefix}-paypal:before { content: fa-content($fa-var-paypal); }
+.#{$fa-css-prefix}-pen-square:before { content: fa-content($fa-var-pen-square); }
+.#{$fa-css-prefix}-pencil-alt:before { content: fa-content($fa-var-pencil-alt); }
+.#{$fa-css-prefix}-percent:before { content: fa-content($fa-var-percent); }
+.#{$fa-css-prefix}-periscope:before { content: fa-content($fa-var-periscope); }
+.#{$fa-css-prefix}-phabricator:before { content: fa-content($fa-var-phabricator); }
+.#{$fa-css-prefix}-phoenix-framework:before { content: fa-content($fa-var-phoenix-framework); }
+.#{$fa-css-prefix}-phone:before { content: fa-content($fa-var-phone); }
+.#{$fa-css-prefix}-phone-square:before { content: fa-content($fa-var-phone-square); }
+.#{$fa-css-prefix}-phone-volume:before { content: fa-content($fa-var-phone-volume); }
+.#{$fa-css-prefix}-pied-piper:before { content: fa-content($fa-var-pied-piper); }
+.#{$fa-css-prefix}-pied-piper-alt:before { content: fa-content($fa-var-pied-piper-alt); }
+.#{$fa-css-prefix}-pied-piper-pp:before { content: fa-content($fa-var-pied-piper-pp); }
+.#{$fa-css-prefix}-pinterest:before { content: fa-content($fa-var-pinterest); }
+.#{$fa-css-prefix}-pinterest-p:before { content: fa-content($fa-var-pinterest-p); }
+.#{$fa-css-prefix}-pinterest-square:before { content: fa-content($fa-var-pinterest-square); }
+.#{$fa-css-prefix}-plane:before { content: fa-content($fa-var-plane); }
+.#{$fa-css-prefix}-play:before { content: fa-content($fa-var-play); }
+.#{$fa-css-prefix}-play-circle:before { content: fa-content($fa-var-play-circle); }
+.#{$fa-css-prefix}-playstation:before { content: fa-content($fa-var-playstation); }
+.#{$fa-css-prefix}-plug:before { content: fa-content($fa-var-plug); }
+.#{$fa-css-prefix}-plus:before { content: fa-content($fa-var-plus); }
+.#{$fa-css-prefix}-plus-circle:before { content: fa-content($fa-var-plus-circle); }
+.#{$fa-css-prefix}-plus-square:before { content: fa-content($fa-var-plus-square); }
+.#{$fa-css-prefix}-podcast:before { content: fa-content($fa-var-podcast); }
+.#{$fa-css-prefix}-pound-sign:before { content: fa-content($fa-var-pound-sign); }
+.#{$fa-css-prefix}-power-off:before { content: fa-content($fa-var-power-off); }
+.#{$fa-css-prefix}-print:before { content: fa-content($fa-var-print); }
+.#{$fa-css-prefix}-product-hunt:before { content: fa-content($fa-var-product-hunt); }
+.#{$fa-css-prefix}-pushed:before { content: fa-content($fa-var-pushed); }
+.#{$fa-css-prefix}-puzzle-piece:before { content: fa-content($fa-var-puzzle-piece); }
+.#{$fa-css-prefix}-python:before { content: fa-content($fa-var-python); }
+.#{$fa-css-prefix}-qq:before { content: fa-content($fa-var-qq); }
+.#{$fa-css-prefix}-qrcode:before { content: fa-content($fa-var-qrcode); }
+.#{$fa-css-prefix}-question:before { content: fa-content($fa-var-question); }
+.#{$fa-css-prefix}-question-circle:before { content: fa-content($fa-var-question-circle); }
+.#{$fa-css-prefix}-quora:before { content: fa-content($fa-var-quora); }
+.#{$fa-css-prefix}-quote-left:before { content: fa-content($fa-var-quote-left); }
+.#{$fa-css-prefix}-quote-right:before { content: fa-content($fa-var-quote-right); }
+.#{$fa-css-prefix}-random:before { content: fa-content($fa-var-random); }
+.#{$fa-css-prefix}-ravelry:before { content: fa-content($fa-var-ravelry); }
+.#{$fa-css-prefix}-react:before { content: fa-content($fa-var-react); }
+.#{$fa-css-prefix}-rebel:before { content: fa-content($fa-var-rebel); }
+.#{$fa-css-prefix}-recycle:before { content: fa-content($fa-var-recycle); }
+.#{$fa-css-prefix}-red-river:before { content: fa-content($fa-var-red-river); }
+.#{$fa-css-prefix}-reddit:before { content: fa-content($fa-var-reddit); }
+.#{$fa-css-prefix}-reddit-alien:before { content: fa-content($fa-var-reddit-alien); }
+.#{$fa-css-prefix}-reddit-square:before { content: fa-content($fa-var-reddit-square); }
+.#{$fa-css-prefix}-redo:before { content: fa-content($fa-var-redo); }
+.#{$fa-css-prefix}-redo-alt:before { content: fa-content($fa-var-redo-alt); }
+.#{$fa-css-prefix}-registered:before { content: fa-content($fa-var-registered); }
+.#{$fa-css-prefix}-rendact:before { content: fa-content($fa-var-rendact); }
+.#{$fa-css-prefix}-renren:before { content: fa-content($fa-var-renren); }
+.#{$fa-css-prefix}-reply:before { content: fa-content($fa-var-reply); }
+.#{$fa-css-prefix}-reply-all:before { content: fa-content($fa-var-reply-all); }
+.#{$fa-css-prefix}-replyd:before { content: fa-content($fa-var-replyd); }
+.#{$fa-css-prefix}-resolving:before { content: fa-content($fa-var-resolving); }
+.#{$fa-css-prefix}-retweet:before { content: fa-content($fa-var-retweet); }
+.#{$fa-css-prefix}-road:before { content: fa-content($fa-var-road); }
+.#{$fa-css-prefix}-rocket:before { content: fa-content($fa-var-rocket); }
+.#{$fa-css-prefix}-rocketchat:before { content: fa-content($fa-var-rocketchat); }
+.#{$fa-css-prefix}-rockrms:before { content: fa-content($fa-var-rockrms); }
+.#{$fa-css-prefix}-rss:before { content: fa-content($fa-var-rss); }
+.#{$fa-css-prefix}-rss-square:before { content: fa-content($fa-var-rss-square); }
+.#{$fa-css-prefix}-ruble-sign:before { content: fa-content($fa-var-ruble-sign); }
+.#{$fa-css-prefix}-rupee-sign:before { content: fa-content($fa-var-rupee-sign); }
+.#{$fa-css-prefix}-safari:before { content: fa-content($fa-var-safari); }
+.#{$fa-css-prefix}-sass:before { content: fa-content($fa-var-sass); }
+.#{$fa-css-prefix}-save:before { content: fa-content($fa-var-save); }
+.#{$fa-css-prefix}-schlix:before { content: fa-content($fa-var-schlix); }
+.#{$fa-css-prefix}-scribd:before { content: fa-content($fa-var-scribd); }
+.#{$fa-css-prefix}-search:before { content: fa-content($fa-var-search); }
+.#{$fa-css-prefix}-search-minus:before { content: fa-content($fa-var-search-minus); }
+.#{$fa-css-prefix}-search-plus:before { content: fa-content($fa-var-search-plus); }
+.#{$fa-css-prefix}-searchengin:before { content: fa-content($fa-var-searchengin); }
+.#{$fa-css-prefix}-sellcast:before { content: fa-content($fa-var-sellcast); }
+.#{$fa-css-prefix}-sellsy:before { content: fa-content($fa-var-sellsy); }
+.#{$fa-css-prefix}-server:before { content: fa-content($fa-var-server); }
+.#{$fa-css-prefix}-servicestack:before { content: fa-content($fa-var-servicestack); }
+.#{$fa-css-prefix}-share:before { content: fa-content($fa-var-share); }
+.#{$fa-css-prefix}-share-alt:before { content: fa-content($fa-var-share-alt); }
+.#{$fa-css-prefix}-share-alt-square:before { content: fa-content($fa-var-share-alt-square); }
+.#{$fa-css-prefix}-share-square:before { content: fa-content($fa-var-share-square); }
+.#{$fa-css-prefix}-shekel-sign:before { content: fa-content($fa-var-shekel-sign); }
+.#{$fa-css-prefix}-shield-alt:before { content: fa-content($fa-var-shield-alt); }
+.#{$fa-css-prefix}-ship:before { content: fa-content($fa-var-ship); }
+.#{$fa-css-prefix}-shirtsinbulk:before { content: fa-content($fa-var-shirtsinbulk); }
+.#{$fa-css-prefix}-shopping-bag:before { content: fa-content($fa-var-shopping-bag); }
+.#{$fa-css-prefix}-shopping-basket:before { content: fa-content($fa-var-shopping-basket); }
+.#{$fa-css-prefix}-shopping-cart:before { content: fa-content($fa-var-shopping-cart); }
+.#{$fa-css-prefix}-shower:before { content: fa-content($fa-var-shower); }
+.#{$fa-css-prefix}-sign-in-alt:before { content: fa-content($fa-var-sign-in-alt); }
+.#{$fa-css-prefix}-sign-language:before { content: fa-content($fa-var-sign-language); }
+.#{$fa-css-prefix}-sign-out-alt:before { content: fa-content($fa-var-sign-out-alt); }
+.#{$fa-css-prefix}-signal:before { content: fa-content($fa-var-signal); }
+.#{$fa-css-prefix}-simplybuilt:before { content: fa-content($fa-var-simplybuilt); }
+.#{$fa-css-prefix}-sistrix:before { content: fa-content($fa-var-sistrix); }
+.#{$fa-css-prefix}-sitemap:before { content: fa-content($fa-var-sitemap); }
+.#{$fa-css-prefix}-skyatlas:before { content: fa-content($fa-var-skyatlas); }
+.#{$fa-css-prefix}-skype:before { content: fa-content($fa-var-skype); }
+.#{$fa-css-prefix}-slack:before { content: fa-content($fa-var-slack); }
+.#{$fa-css-prefix}-slack-hash:before { content: fa-content($fa-var-slack-hash); }
+.#{$fa-css-prefix}-sliders-h:before { content: fa-content($fa-var-sliders-h); }
+.#{$fa-css-prefix}-slideshare:before { content: fa-content($fa-var-slideshare); }
+.#{$fa-css-prefix}-smile:before { content: fa-content($fa-var-smile); }
+.#{$fa-css-prefix}-snapchat:before { content: fa-content($fa-var-snapchat); }
+.#{$fa-css-prefix}-snapchat-ghost:before { content: fa-content($fa-var-snapchat-ghost); }
+.#{$fa-css-prefix}-snapchat-square:before { content: fa-content($fa-var-snapchat-square); }
+.#{$fa-css-prefix}-snowflake:before { content: fa-content($fa-var-snowflake); }
+.#{$fa-css-prefix}-sort:before { content: fa-content($fa-var-sort); }
+.#{$fa-css-prefix}-sort-alpha-down:before { content: fa-content($fa-var-sort-alpha-down); }
+.#{$fa-css-prefix}-sort-alpha-up:before { content: fa-content($fa-var-sort-alpha-up); }
+.#{$fa-css-prefix}-sort-amount-down:before { content: fa-content($fa-var-sort-amount-down); }
+.#{$fa-css-prefix}-sort-amount-up:before { content: fa-content($fa-var-sort-amount-up); }
+.#{$fa-css-prefix}-sort-down:before { content: fa-content($fa-var-sort-down); }
+.#{$fa-css-prefix}-sort-numeric-down:before { content: fa-content($fa-var-sort-numeric-down); }
+.#{$fa-css-prefix}-sort-numeric-up:before { content: fa-content($fa-var-sort-numeric-up); }
+.#{$fa-css-prefix}-sort-up:before { content: fa-content($fa-var-sort-up); }
+.#{$fa-css-prefix}-soundcloud:before { content: fa-content($fa-var-soundcloud); }
+.#{$fa-css-prefix}-space-shuttle:before { content: fa-content($fa-var-space-shuttle); }
+.#{$fa-css-prefix}-speakap:before { content: fa-content($fa-var-speakap); }
+.#{$fa-css-prefix}-spinner:before { content: fa-content($fa-var-spinner); }
+.#{$fa-css-prefix}-spotify:before { content: fa-content($fa-var-spotify); }
+.#{$fa-css-prefix}-square:before { content: fa-content($fa-var-square); }
+.#{$fa-css-prefix}-stack-exchange:before { content: fa-content($fa-var-stack-exchange); }
+.#{$fa-css-prefix}-stack-overflow:before { content: fa-content($fa-var-stack-overflow); }
+.#{$fa-css-prefix}-star:before { content: fa-content($fa-var-star); }
+.#{$fa-css-prefix}-star-half:before { content: fa-content($fa-var-star-half); }
+.#{$fa-css-prefix}-staylinked:before { content: fa-content($fa-var-staylinked); }
+.#{$fa-css-prefix}-steam:before { content: fa-content($fa-var-steam); }
+.#{$fa-css-prefix}-steam-square:before { content: fa-content($fa-var-steam-square); }
+.#{$fa-css-prefix}-steam-symbol:before { content: fa-content($fa-var-steam-symbol); }
+.#{$fa-css-prefix}-step-backward:before { content: fa-content($fa-var-step-backward); }
+.#{$fa-css-prefix}-step-forward:before { content: fa-content($fa-var-step-forward); }
+.#{$fa-css-prefix}-stethoscope:before { content: fa-content($fa-var-stethoscope); }
+.#{$fa-css-prefix}-sticker-mule:before { content: fa-content($fa-var-sticker-mule); }
+.#{$fa-css-prefix}-sticky-note:before { content: fa-content($fa-var-sticky-note); }
+.#{$fa-css-prefix}-stop:before { content: fa-content($fa-var-stop); }
+.#{$fa-css-prefix}-stop-circle:before { content: fa-content($fa-var-stop-circle); }
+.#{$fa-css-prefix}-stopwatch:before { content: fa-content($fa-var-stopwatch); }
+.#{$fa-css-prefix}-strava:before { content: fa-content($fa-var-strava); }
+.#{$fa-css-prefix}-street-view:before { content: fa-content($fa-var-street-view); }
+.#{$fa-css-prefix}-strikethrough:before { content: fa-content($fa-var-strikethrough); }
+.#{$fa-css-prefix}-stripe:before { content: fa-content($fa-var-stripe); }
+.#{$fa-css-prefix}-stripe-s:before { content: fa-content($fa-var-stripe-s); }
+.#{$fa-css-prefix}-studiovinari:before { content: fa-content($fa-var-studiovinari); }
+.#{$fa-css-prefix}-stumbleupon:before { content: fa-content($fa-var-stumbleupon); }
+.#{$fa-css-prefix}-stumbleupon-circle:before { content: fa-content($fa-var-stumbleupon-circle); }
+.#{$fa-css-prefix}-subscript:before { content: fa-content($fa-var-subscript); }
+.#{$fa-css-prefix}-subway:before { content: fa-content($fa-var-subway); }
+.#{$fa-css-prefix}-suitcase:before { content: fa-content($fa-var-suitcase); }
+.#{$fa-css-prefix}-sun:before { content: fa-content($fa-var-sun); }
+.#{$fa-css-prefix}-superpowers:before { content: fa-content($fa-var-superpowers); }
+.#{$fa-css-prefix}-superscript:before { content: fa-content($fa-var-superscript); }
+.#{$fa-css-prefix}-supple:before { content: fa-content($fa-var-supple); }
+.#{$fa-css-prefix}-sync:before { content: fa-content($fa-var-sync); }
+.#{$fa-css-prefix}-sync-alt:before { content: fa-content($fa-var-sync-alt); }
+.#{$fa-css-prefix}-table:before { content: fa-content($fa-var-table); }
+.#{$fa-css-prefix}-tablet:before { content: fa-content($fa-var-tablet); }
+.#{$fa-css-prefix}-tablet-alt:before { content: fa-content($fa-var-tablet-alt); }
+.#{$fa-css-prefix}-tachometer-alt:before { content: fa-content($fa-var-tachometer-alt); }
+.#{$fa-css-prefix}-tag:before { content: fa-content($fa-var-tag); }
+.#{$fa-css-prefix}-tags:before { content: fa-content($fa-var-tags); }
+.#{$fa-css-prefix}-tasks:before { content: fa-content($fa-var-tasks); }
+.#{$fa-css-prefix}-taxi:before { content: fa-content($fa-var-taxi); }
+.#{$fa-css-prefix}-telegram:before { content: fa-content($fa-var-telegram); }
+.#{$fa-css-prefix}-telegram-plane:before { content: fa-content($fa-var-telegram-plane); }
+.#{$fa-css-prefix}-tencent-weibo:before { content: fa-content($fa-var-tencent-weibo); }
+.#{$fa-css-prefix}-terminal:before { content: fa-content($fa-var-terminal); }
+.#{$fa-css-prefix}-text-height:before { content: fa-content($fa-var-text-height); }
+.#{$fa-css-prefix}-text-width:before { content: fa-content($fa-var-text-width); }
+.#{$fa-css-prefix}-th:before { content: fa-content($fa-var-th); }
+.#{$fa-css-prefix}-th-large:before { content: fa-content($fa-var-th-large); }
+.#{$fa-css-prefix}-th-list:before { content: fa-content($fa-var-th-list); }
+.#{$fa-css-prefix}-themeisle:before { content: fa-content($fa-var-themeisle); }
+.#{$fa-css-prefix}-thermometer-empty:before { content: fa-content($fa-var-thermometer-empty); }
+.#{$fa-css-prefix}-thermometer-full:before { content: fa-content($fa-var-thermometer-full); }
+.#{$fa-css-prefix}-thermometer-half:before { content: fa-content($fa-var-thermometer-half); }
+.#{$fa-css-prefix}-thermometer-quarter:before { content: fa-content($fa-var-thermometer-quarter); }
+.#{$fa-css-prefix}-thermometer-three-quarters:before { content: fa-content($fa-var-thermometer-three-quarters); }
+.#{$fa-css-prefix}-thumbs-down:before { content: fa-content($fa-var-thumbs-down); }
+.#{$fa-css-prefix}-thumbs-up:before { content: fa-content($fa-var-thumbs-up); }
+.#{$fa-css-prefix}-thumbtack:before { content: fa-content($fa-var-thumbtack); }
+.#{$fa-css-prefix}-ticket-alt:before { content: fa-content($fa-var-ticket-alt); }
+.#{$fa-css-prefix}-times:before { content: fa-content($fa-var-times); }
+.#{$fa-css-prefix}-times-circle:before { content: fa-content($fa-var-times-circle); }
+.#{$fa-css-prefix}-tint:before { content: fa-content($fa-var-tint); }
+.#{$fa-css-prefix}-toggle-off:before { content: fa-content($fa-var-toggle-off); }
+.#{$fa-css-prefix}-toggle-on:before { content: fa-content($fa-var-toggle-on); }
+.#{$fa-css-prefix}-trademark:before { content: fa-content($fa-var-trademark); }
+.#{$fa-css-prefix}-train:before { content: fa-content($fa-var-train); }
+.#{$fa-css-prefix}-transgender:before { content: fa-content($fa-var-transgender); }
+.#{$fa-css-prefix}-transgender-alt:before { content: fa-content($fa-var-transgender-alt); }
+.#{$fa-css-prefix}-trash:before { content: fa-content($fa-var-trash); }
+.#{$fa-css-prefix}-trash-alt:before { content: fa-content($fa-var-trash-alt); }
+.#{$fa-css-prefix}-tree:before { content: fa-content($fa-var-tree); }
+.#{$fa-css-prefix}-trello:before { content: fa-content($fa-var-trello); }
+.#{$fa-css-prefix}-tripadvisor:before { content: fa-content($fa-var-tripadvisor); }
+.#{$fa-css-prefix}-trophy:before { content: fa-content($fa-var-trophy); }
+.#{$fa-css-prefix}-truck:before { content: fa-content($fa-var-truck); }
+.#{$fa-css-prefix}-tty:before { content: fa-content($fa-var-tty); }
+.#{$fa-css-prefix}-tumblr:before { content: fa-content($fa-var-tumblr); }
+.#{$fa-css-prefix}-tumblr-square:before { content: fa-content($fa-var-tumblr-square); }
+.#{$fa-css-prefix}-tv:before { content: fa-content($fa-var-tv); }
+.#{$fa-css-prefix}-twitch:before { content: fa-content($fa-var-twitch); }
+.#{$fa-css-prefix}-twitter:before { content: fa-content($fa-var-twitter); }
+.#{$fa-css-prefix}-twitter-square:before { content: fa-content($fa-var-twitter-square); }
+.#{$fa-css-prefix}-typo3:before { content: fa-content($fa-var-typo3); }
+.#{$fa-css-prefix}-uber:before { content: fa-content($fa-var-uber); }
+.#{$fa-css-prefix}-uikit:before { content: fa-content($fa-var-uikit); }
+.#{$fa-css-prefix}-umbrella:before { content: fa-content($fa-var-umbrella); }
+.#{$fa-css-prefix}-underline:before { content: fa-content($fa-var-underline); }
+.#{$fa-css-prefix}-undo:before { content: fa-content($fa-var-undo); }
+.#{$fa-css-prefix}-undo-alt:before { content: fa-content($fa-var-undo-alt); }
+.#{$fa-css-prefix}-uniregistry:before { content: fa-content($fa-var-uniregistry); }
+.#{$fa-css-prefix}-universal-access:before { content: fa-content($fa-var-universal-access); }
+.#{$fa-css-prefix}-university:before { content: fa-content($fa-var-university); }
+.#{$fa-css-prefix}-unlink:before { content: fa-content($fa-var-unlink); }
+.#{$fa-css-prefix}-unlock:before { content: fa-content($fa-var-unlock); }
+.#{$fa-css-prefix}-unlock-alt:before { content: fa-content($fa-var-unlock-alt); }
+.#{$fa-css-prefix}-untappd:before { content: fa-content($fa-var-untappd); }
+.#{$fa-css-prefix}-upload:before { content: fa-content($fa-var-upload); }
+.#{$fa-css-prefix}-usb:before { content: fa-content($fa-var-usb); }
+.#{$fa-css-prefix}-user:before { content: fa-content($fa-var-user); }
+.#{$fa-css-prefix}-user-circle:before { content: fa-content($fa-var-user-circle); }
+.#{$fa-css-prefix}-user-md:before { content: fa-content($fa-var-user-md); }
+.#{$fa-css-prefix}-user-plus:before { content: fa-content($fa-var-user-plus); }
+.#{$fa-css-prefix}-user-secret:before { content: fa-content($fa-var-user-secret); }
+.#{$fa-css-prefix}-user-times:before { content: fa-content($fa-var-user-times); }
+.#{$fa-css-prefix}-users:before { content: fa-content($fa-var-users); }
+.#{$fa-css-prefix}-ussunnah:before { content: fa-content($fa-var-ussunnah); }
+.#{$fa-css-prefix}-utensil-spoon:before { content: fa-content($fa-var-utensil-spoon); }
+.#{$fa-css-prefix}-utensils:before { content: fa-content($fa-var-utensils); }
+.#{$fa-css-prefix}-vaadin:before { content: fa-content($fa-var-vaadin); }
+.#{$fa-css-prefix}-venus:before { content: fa-content($fa-var-venus); }
+.#{$fa-css-prefix}-venus-double:before { content: fa-content($fa-var-venus-double); }
+.#{$fa-css-prefix}-venus-mars:before { content: fa-content($fa-var-venus-mars); }
+.#{$fa-css-prefix}-viacoin:before { content: fa-content($fa-var-viacoin); }
+.#{$fa-css-prefix}-viadeo:before { content: fa-content($fa-var-viadeo); }
+.#{$fa-css-prefix}-viadeo-square:before { content: fa-content($fa-var-viadeo-square); }
+.#{$fa-css-prefix}-viber:before { content: fa-content($fa-var-viber); }
+.#{$fa-css-prefix}-video:before { content: fa-content($fa-var-video); }
+.#{$fa-css-prefix}-vimeo:before { content: fa-content($fa-var-vimeo); }
+.#{$fa-css-prefix}-vimeo-square:before { content: fa-content($fa-var-vimeo-square); }
+.#{$fa-css-prefix}-vimeo-v:before { content: fa-content($fa-var-vimeo-v); }
+.#{$fa-css-prefix}-vine:before { content: fa-content($fa-var-vine); }
+.#{$fa-css-prefix}-vk:before { content: fa-content($fa-var-vk); }
+.#{$fa-css-prefix}-vnv:before { content: fa-content($fa-var-vnv); }
+.#{$fa-css-prefix}-volume-down:before { content: fa-content($fa-var-volume-down); }
+.#{$fa-css-prefix}-volume-off:before { content: fa-content($fa-var-volume-off); }
+.#{$fa-css-prefix}-volume-up:before { content: fa-content($fa-var-volume-up); }
+.#{$fa-css-prefix}-vuejs:before { content: fa-content($fa-var-vuejs); }
+.#{$fa-css-prefix}-weibo:before { content: fa-content($fa-var-weibo); }
+.#{$fa-css-prefix}-weixin:before { content: fa-content($fa-var-weixin); }
+.#{$fa-css-prefix}-whatsapp:before { content: fa-content($fa-var-whatsapp); }
+.#{$fa-css-prefix}-whatsapp-square:before { content: fa-content($fa-var-whatsapp-square); }
+.#{$fa-css-prefix}-wheelchair:before { content: fa-content($fa-var-wheelchair); }
+.#{$fa-css-prefix}-whmcs:before { content: fa-content($fa-var-whmcs); }
+.#{$fa-css-prefix}-wifi:before { content: fa-content($fa-var-wifi); }
+.#{$fa-css-prefix}-wikipedia-w:before { content: fa-content($fa-var-wikipedia-w); }
+.#{$fa-css-prefix}-window-close:before { content: fa-content($fa-var-window-close); }
+.#{$fa-css-prefix}-window-maximize:before { content: fa-content($fa-var-window-maximize); }
+.#{$fa-css-prefix}-window-minimize:before { content: fa-content($fa-var-window-minimize); }
+.#{$fa-css-prefix}-window-restore:before { content: fa-content($fa-var-window-restore); }
+.#{$fa-css-prefix}-windows:before { content: fa-content($fa-var-windows); }
+.#{$fa-css-prefix}-won-sign:before { content: fa-content($fa-var-won-sign); }
+.#{$fa-css-prefix}-wordpress:before { content: fa-content($fa-var-wordpress); }
+.#{$fa-css-prefix}-wordpress-simple:before { content: fa-content($fa-var-wordpress-simple); }
+.#{$fa-css-prefix}-wpbeginner:before { content: fa-content($fa-var-wpbeginner); }
+.#{$fa-css-prefix}-wpexplorer:before { content: fa-content($fa-var-wpexplorer); }
+.#{$fa-css-prefix}-wpforms:before { content: fa-content($fa-var-wpforms); }
+.#{$fa-css-prefix}-wrench:before { content: fa-content($fa-var-wrench); }
+.#{$fa-css-prefix}-xbox:before { content: fa-content($fa-var-xbox); }
+.#{$fa-css-prefix}-xing:before { content: fa-content($fa-var-xing); }
+.#{$fa-css-prefix}-xing-square:before { content: fa-content($fa-var-xing-square); }
+.#{$fa-css-prefix}-y-combinator:before { content: fa-content($fa-var-y-combinator); }
+.#{$fa-css-prefix}-yahoo:before { content: fa-content($fa-var-yahoo); }
+.#{$fa-css-prefix}-yandex:before { content: fa-content($fa-var-yandex); }
+.#{$fa-css-prefix}-yandex-international:before { content: fa-content($fa-var-yandex-international); }
+.#{$fa-css-prefix}-yelp:before { content: fa-content($fa-var-yelp); }
+.#{$fa-css-prefix}-yen-sign:before { content: fa-content($fa-var-yen-sign); }
+.#{$fa-css-prefix}-yoast:before { content: fa-content($fa-var-yoast); }
+.#{$fa-css-prefix}-youtube:before { content: fa-content($fa-var-youtube); }
diff --git a/docs/src/assets/fa/_larger.scss b/docs/src/assets/fa/_larger.scss
new file mode 100644
index 00000000..27c2ad5f
--- /dev/null
+++ b/docs/src/assets/fa/_larger.scss
@@ -0,0 +1,23 @@
+// Icon Sizes
+// -------------------------
+
+// makes the font 33% larger relative to the icon container
+.#{$fa-css-prefix}-lg {
+ font-size: (4em / 3);
+ line-height: (3em / 4);
+ vertical-align: -.0667em;
+}
+
+.#{$fa-css-prefix}-xs {
+ font-size: .75em;
+}
+
+.#{$fa-css-prefix}-sm {
+ font-size: .875em;
+}
+
+@for $i from 1 through 10 {
+ .#{$fa-css-prefix}-#{$i}x {
+ font-size: $i * 1em;
+ }
+}
diff --git a/docs/src/assets/fa/_list.scss b/docs/src/assets/fa/_list.scss
new file mode 100644
index 00000000..8ebf3333
--- /dev/null
+++ b/docs/src/assets/fa/_list.scss
@@ -0,0 +1,18 @@
+// List Icons
+// -------------------------
+
+.#{$fa-css-prefix}-ul {
+ list-style-type: none;
+ margin-left: $fa-li-width * 5/4;
+ padding-left: 0;
+
+ > li { position: relative; }
+}
+
+.#{$fa-css-prefix}-li {
+ left: -$fa-li-width;
+ position: absolute;
+ text-align: center;
+ width: $fa-li-width;
+ line-height: inherit;
+}
diff --git a/docs/src/assets/fa/_mixins.scss b/docs/src/assets/fa/_mixins.scss
new file mode 100644
index 00000000..06e549b6
--- /dev/null
+++ b/docs/src/assets/fa/_mixins.scss
@@ -0,0 +1,57 @@
+// Mixins
+// --------------------------
+
+@mixin fa-icon {
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ display: inline-block;
+ font-style: normal;
+ font-variant: normal;
+ font-weight: normal;
+ line-height: 1;
+ vertical-align: -15%;
+}
+
+@mixin fa-icon-rotate($degrees, $rotation) {
+ -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation})";
+ transform: rotate($degrees);
+}
+
+@mixin fa-icon-flip($horiz, $vert, $rotation) {
+ -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}, mirror=1)";
+ transform: scale($horiz, $vert);
+}
+
+
+// Only display content to screen readers. A la Bootstrap 4.
+//
+// See: http://a11yproject.com/posts/how-to-hide-content/
+
+@mixin sr-only {
+ border: 0;
+ clip: rect(0, 0, 0, 0);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ width: 1px;
+}
+
+// Use in conjunction with .sr-only to only display content when it's focused.
+//
+// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+//
+// Credit: HTML5 Boilerplate
+
+@mixin sr-only-focusable {
+ &:active,
+ &:focus {
+ clip: auto;
+ height: auto;
+ margin: 0;
+ overflow: visible;
+ position: static;
+ width: auto;
+ }
+}
diff --git a/docs/src/assets/fa/_rotated-flipped.scss b/docs/src/assets/fa/_rotated-flipped.scss
new file mode 100644
index 00000000..995bc4cc
--- /dev/null
+++ b/docs/src/assets/fa/_rotated-flipped.scss
@@ -0,0 +1,23 @@
+// Rotated & Flipped Icons
+// -------------------------
+
+.#{$fa-css-prefix}-rotate-90 { @include fa-icon-rotate(90deg, 1); }
+.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
+.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
+
+.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
+.#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(1, -1, 2); }
+.#{$fa-css-prefix}-flip-horizontal.#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(-1, -1, 2); }
+
+// Hook for IE8-9
+// -------------------------
+
+:root {
+ .#{$fa-css-prefix}-rotate-90,
+ .#{$fa-css-prefix}-rotate-180,
+ .#{$fa-css-prefix}-rotate-270,
+ .#{$fa-css-prefix}-flip-horizontal,
+ .#{$fa-css-prefix}-flip-vertical {
+ filter: none;
+ }
+}
diff --git a/docs/src/assets/fa/_screen-reader.scss b/docs/src/assets/fa/_screen-reader.scss
new file mode 100644
index 00000000..5d0ab262
--- /dev/null
+++ b/docs/src/assets/fa/_screen-reader.scss
@@ -0,0 +1,5 @@
+// Screen Readers
+// -------------------------
+
+.sr-only { @include sr-only; }
+.sr-only-focusable { @include sr-only-focusable; }
diff --git a/docs/src/assets/fa/_stacked.scss b/docs/src/assets/fa/_stacked.scss
new file mode 100644
index 00000000..6c09d84c
--- /dev/null
+++ b/docs/src/assets/fa/_stacked.scss
@@ -0,0 +1,31 @@
+// Stacked Icons
+// -------------------------
+
+.#{$fa-css-prefix}-stack {
+ display: inline-block;
+ height: 2em;
+ line-height: 2em;
+ position: relative;
+ vertical-align: middle;
+ width: 2em;
+}
+
+.#{$fa-css-prefix}-stack-1x,
+.#{$fa-css-prefix}-stack-2x {
+ left: 0;
+ position: absolute;
+ text-align: center;
+ width: 100%;
+}
+
+.#{$fa-css-prefix}-stack-1x {
+ line-height: inherit;
+}
+
+.#{$fa-css-prefix}-stack-2x {
+ font-size: 2em;
+}
+
+.#{$fa-css-prefix}-inverse {
+ color: $fa-inverse;
+}
diff --git a/docs/src/assets/fa/_variables.scss b/docs/src/assets/fa/_variables.scss
new file mode 100644
index 00000000..d2c4d474
--- /dev/null
+++ b/docs/src/assets/fa/_variables.scss
@@ -0,0 +1,805 @@
+// Variables
+// --------------------------
+
+$fa-font-path: "../webfonts" !default;
+$fa-font-size-base: 16px !default;
+$fa-css-prefix: fa !default;
+$fa-version: "5.0.2" !default;
+$fa-border-color: #eee !default;
+$fa-inverse: #fff !default;
+$fa-li-width: 2em !default;
+
+// Convenience function used to set content property
+@function fa-content($fa-var) {
+ @return unquote("\"#{ $fa-var }\"");
+}
+
+$fa-var-500px: \f26e;
+$fa-var-accessible-icon: \f368;
+$fa-var-accusoft: \f369;
+$fa-var-address-book: \f2b9;
+$fa-var-address-card: \f2bb;
+$fa-var-adjust: \f042;
+$fa-var-adn: \f170;
+$fa-var-adversal: \f36a;
+$fa-var-affiliatetheme: \f36b;
+$fa-var-algolia: \f36c;
+$fa-var-align-center: \f037;
+$fa-var-align-justify: \f039;
+$fa-var-align-left: \f036;
+$fa-var-align-right: \f038;
+$fa-var-amazon: \f270;
+$fa-var-amazon-pay: \f42c;
+$fa-var-ambulance: \f0f9;
+$fa-var-american-sign-language-interpreting: \f2a3;
+$fa-var-amilia: \f36d;
+$fa-var-anchor: \f13d;
+$fa-var-android: \f17b;
+$fa-var-angellist: \f209;
+$fa-var-angle-double-down: \f103;
+$fa-var-angle-double-left: \f100;
+$fa-var-angle-double-right: \f101;
+$fa-var-angle-double-up: \f102;
+$fa-var-angle-down: \f107;
+$fa-var-angle-left: \f104;
+$fa-var-angle-right: \f105;
+$fa-var-angle-up: \f106;
+$fa-var-angrycreative: \f36e;
+$fa-var-angular: \f420;
+$fa-var-app-store: \f36f;
+$fa-var-app-store-ios: \f370;
+$fa-var-apper: \f371;
+$fa-var-apple: \f179;
+$fa-var-apple-pay: \f415;
+$fa-var-archive: \f187;
+$fa-var-arrow-alt-circle-down: \f358;
+$fa-var-arrow-alt-circle-left: \f359;
+$fa-var-arrow-alt-circle-right: \f35a;
+$fa-var-arrow-alt-circle-up: \f35b;
+$fa-var-arrow-circle-down: \f0ab;
+$fa-var-arrow-circle-left: \f0a8;
+$fa-var-arrow-circle-right: \f0a9;
+$fa-var-arrow-circle-up: \f0aa;
+$fa-var-arrow-down: \f063;
+$fa-var-arrow-left: \f060;
+$fa-var-arrow-right: \f061;
+$fa-var-arrow-up: \f062;
+$fa-var-arrows-alt: \f0b2;
+$fa-var-arrows-alt-h: \f337;
+$fa-var-arrows-alt-v: \f338;
+$fa-var-assistive-listening-systems: \f2a2;
+$fa-var-asterisk: \f069;
+$fa-var-asymmetrik: \f372;
+$fa-var-at: \f1fa;
+$fa-var-audible: \f373;
+$fa-var-audio-description: \f29e;
+$fa-var-autoprefixer: \f41c;
+$fa-var-avianex: \f374;
+$fa-var-aviato: \f421;
+$fa-var-aws: \f375;
+$fa-var-backward: \f04a;
+$fa-var-balance-scale: \f24e;
+$fa-var-ban: \f05e;
+$fa-var-bandcamp: \f2d5;
+$fa-var-barcode: \f02a;
+$fa-var-bars: \f0c9;
+$fa-var-bath: \f2cd;
+$fa-var-battery-empty: \f244;
+$fa-var-battery-full: \f240;
+$fa-var-battery-half: \f242;
+$fa-var-battery-quarter: \f243;
+$fa-var-battery-three-quarters: \f241;
+$fa-var-bed: \f236;
+$fa-var-beer: \f0fc;
+$fa-var-behance: \f1b4;
+$fa-var-behance-square: \f1b5;
+$fa-var-bell: \f0f3;
+$fa-var-bell-slash: \f1f6;
+$fa-var-bicycle: \f206;
+$fa-var-bimobject: \f378;
+$fa-var-binoculars: \f1e5;
+$fa-var-birthday-cake: \f1fd;
+$fa-var-bitbucket: \f171;
+$fa-var-bitcoin: \f379;
+$fa-var-bity: \f37a;
+$fa-var-black-tie: \f27e;
+$fa-var-blackberry: \f37b;
+$fa-var-blind: \f29d;
+$fa-var-blogger: \f37c;
+$fa-var-blogger-b: \f37d;
+$fa-var-bluetooth: \f293;
+$fa-var-bluetooth-b: \f294;
+$fa-var-bold: \f032;
+$fa-var-bolt: \f0e7;
+$fa-var-bomb: \f1e2;
+$fa-var-book: \f02d;
+$fa-var-bookmark: \f02e;
+$fa-var-braille: \f2a1;
+$fa-var-briefcase: \f0b1;
+$fa-var-btc: \f15a;
+$fa-var-bug: \f188;
+$fa-var-building: \f1ad;
+$fa-var-bullhorn: \f0a1;
+$fa-var-bullseye: \f140;
+$fa-var-buromobelexperte: \f37f;
+$fa-var-bus: \f207;
+$fa-var-buysellads: \f20d;
+$fa-var-calculator: \f1ec;
+$fa-var-calendar: \f133;
+$fa-var-calendar-alt: \f073;
+$fa-var-calendar-check: \f274;
+$fa-var-calendar-minus: \f272;
+$fa-var-calendar-plus: \f271;
+$fa-var-calendar-times: \f273;
+$fa-var-camera: \f030;
+$fa-var-camera-retro: \f083;
+$fa-var-car: \f1b9;
+$fa-var-caret-down: \f0d7;
+$fa-var-caret-left: \f0d9;
+$fa-var-caret-right: \f0da;
+$fa-var-caret-square-down: \f150;
+$fa-var-caret-square-left: \f191;
+$fa-var-caret-square-right: \f152;
+$fa-var-caret-square-up: \f151;
+$fa-var-caret-up: \f0d8;
+$fa-var-cart-arrow-down: \f218;
+$fa-var-cart-plus: \f217;
+$fa-var-cc-amazon-pay: \f42d;
+$fa-var-cc-amex: \f1f3;
+$fa-var-cc-apple-pay: \f416;
+$fa-var-cc-diners-club: \f24c;
+$fa-var-cc-discover: \f1f2;
+$fa-var-cc-jcb: \f24b;
+$fa-var-cc-mastercard: \f1f1;
+$fa-var-cc-paypal: \f1f4;
+$fa-var-cc-stripe: \f1f5;
+$fa-var-cc-visa: \f1f0;
+$fa-var-centercode: \f380;
+$fa-var-certificate: \f0a3;
+$fa-var-chart-area: \f1fe;
+$fa-var-chart-bar: \f080;
+$fa-var-chart-line: \f201;
+$fa-var-chart-pie: \f200;
+$fa-var-check: \f00c;
+$fa-var-check-circle: \f058;
+$fa-var-check-square: \f14a;
+$fa-var-chevron-circle-down: \f13a;
+$fa-var-chevron-circle-left: \f137;
+$fa-var-chevron-circle-right: \f138;
+$fa-var-chevron-circle-up: \f139;
+$fa-var-chevron-down: \f078;
+$fa-var-chevron-left: \f053;
+$fa-var-chevron-right: \f054;
+$fa-var-chevron-up: \f077;
+$fa-var-child: \f1ae;
+$fa-var-chrome: \f268;
+$fa-var-circle: \f111;
+$fa-var-circle-notch: \f1ce;
+$fa-var-clipboard: \f328;
+$fa-var-clock: \f017;
+$fa-var-clone: \f24d;
+$fa-var-closed-captioning: \f20a;
+$fa-var-cloud: \f0c2;
+$fa-var-cloud-download-alt: \f381;
+$fa-var-cloud-upload-alt: \f382;
+$fa-var-cloudscale: \f383;
+$fa-var-cloudsmith: \f384;
+$fa-var-cloudversify: \f385;
+$fa-var-code: \f121;
+$fa-var-code-branch: \f126;
+$fa-var-codepen: \f1cb;
+$fa-var-codiepie: \f284;
+$fa-var-coffee: \f0f4;
+$fa-var-cog: \f013;
+$fa-var-cogs: \f085;
+$fa-var-columns: \f0db;
+$fa-var-comment: \f075;
+$fa-var-comment-alt: \f27a;
+$fa-var-comments: \f086;
+$fa-var-compass: \f14e;
+$fa-var-compress: \f066;
+$fa-var-connectdevelop: \f20e;
+$fa-var-contao: \f26d;
+$fa-var-copy: \f0c5;
+$fa-var-copyright: \f1f9;
+$fa-var-cpanel: \f388;
+$fa-var-creative-commons: \f25e;
+$fa-var-credit-card: \f09d;
+$fa-var-crop: \f125;
+$fa-var-crosshairs: \f05b;
+$fa-var-css3: \f13c;
+$fa-var-css3-alt: \f38b;
+$fa-var-cube: \f1b2;
+$fa-var-cubes: \f1b3;
+$fa-var-cut: \f0c4;
+$fa-var-cuttlefish: \f38c;
+$fa-var-d-and-d: \f38d;
+$fa-var-dashcube: \f210;
+$fa-var-database: \f1c0;
+$fa-var-deaf: \f2a4;
+$fa-var-delicious: \f1a5;
+$fa-var-deploydog: \f38e;
+$fa-var-deskpro: \f38f;
+$fa-var-desktop: \f108;
+$fa-var-deviantart: \f1bd;
+$fa-var-digg: \f1a6;
+$fa-var-digital-ocean: \f391;
+$fa-var-discord: \f392;
+$fa-var-discourse: \f393;
+$fa-var-dochub: \f394;
+$fa-var-docker: \f395;
+$fa-var-dollar-sign: \f155;
+$fa-var-dot-circle: \f192;
+$fa-var-download: \f019;
+$fa-var-draft2digital: \f396;
+$fa-var-dribbble: \f17d;
+$fa-var-dribbble-square: \f397;
+$fa-var-dropbox: \f16b;
+$fa-var-drupal: \f1a9;
+$fa-var-dyalog: \f399;
+$fa-var-earlybirds: \f39a;
+$fa-var-edge: \f282;
+$fa-var-edit: \f044;
+$fa-var-eject: \f052;
+$fa-var-ellipsis-h: \f141;
+$fa-var-ellipsis-v: \f142;
+$fa-var-ember: \f423;
+$fa-var-empire: \f1d1;
+$fa-var-envelope: \f0e0;
+$fa-var-envelope-open: \f2b6;
+$fa-var-envelope-square: \f199;
+$fa-var-envira: \f299;
+$fa-var-eraser: \f12d;
+$fa-var-erlang: \f39d;
+$fa-var-ethereum: \f42e;
+$fa-var-etsy: \f2d7;
+$fa-var-euro-sign: \f153;
+$fa-var-exchange-alt: \f362;
+$fa-var-exclamation: \f12a;
+$fa-var-exclamation-circle: \f06a;
+$fa-var-exclamation-triangle: \f071;
+$fa-var-expand: \f065;
+$fa-var-expand-arrows-alt: \f31e;
+$fa-var-expeditedssl: \f23e;
+$fa-var-external-link-alt: \f35d;
+$fa-var-external-link-square-alt: \f360;
+$fa-var-eye: \f06e;
+$fa-var-eye-dropper: \f1fb;
+$fa-var-eye-slash: \f070;
+$fa-var-facebook: \f09a;
+$fa-var-facebook-f: \f39e;
+$fa-var-facebook-messenger: \f39f;
+$fa-var-facebook-square: \f082;
+$fa-var-fast-backward: \f049;
+$fa-var-fast-forward: \f050;
+$fa-var-fax: \f1ac;
+$fa-var-female: \f182;
+$fa-var-fighter-jet: \f0fb;
+$fa-var-file: \f15b;
+$fa-var-file-alt: \f15c;
+$fa-var-file-archive: \f1c6;
+$fa-var-file-audio: \f1c7;
+$fa-var-file-code: \f1c9;
+$fa-var-file-excel: \f1c3;
+$fa-var-file-image: \f1c5;
+$fa-var-file-pdf: \f1c1;
+$fa-var-file-powerpoint: \f1c4;
+$fa-var-file-video: \f1c8;
+$fa-var-file-word: \f1c2;
+$fa-var-film: \f008;
+$fa-var-filter: \f0b0;
+$fa-var-fire: \f06d;
+$fa-var-fire-extinguisher: \f134;
+$fa-var-firefox: \f269;
+$fa-var-first-order: \f2b0;
+$fa-var-firstdraft: \f3a1;
+$fa-var-flag: \f024;
+$fa-var-flag-checkered: \f11e;
+$fa-var-flask: \f0c3;
+$fa-var-flickr: \f16e;
+$fa-var-fly: \f417;
+$fa-var-folder: \f07b;
+$fa-var-folder-open: \f07c;
+$fa-var-font: \f031;
+$fa-var-font-awesome: \f2b4;
+$fa-var-font-awesome-alt: \f35c;
+$fa-var-font-awesome-flag: \f425;
+$fa-var-fonticons: \f280;
+$fa-var-fonticons-fi: \f3a2;
+$fa-var-fort-awesome: \f286;
+$fa-var-fort-awesome-alt: \f3a3;
+$fa-var-forumbee: \f211;
+$fa-var-forward: \f04e;
+$fa-var-foursquare: \f180;
+$fa-var-free-code-camp: \f2c5;
+$fa-var-freebsd: \f3a4;
+$fa-var-frown: \f119;
+$fa-var-futbol: \f1e3;
+$fa-var-gamepad: \f11b;
+$fa-var-gavel: \f0e3;
+$fa-var-gem: \f3a5;
+$fa-var-genderless: \f22d;
+$fa-var-get-pocket: \f265;
+$fa-var-gg: \f260;
+$fa-var-gg-circle: \f261;
+$fa-var-gift: \f06b;
+$fa-var-git: \f1d3;
+$fa-var-git-square: \f1d2;
+$fa-var-github: \f09b;
+$fa-var-github-alt: \f113;
+$fa-var-github-square: \f092;
+$fa-var-gitkraken: \f3a6;
+$fa-var-gitlab: \f296;
+$fa-var-gitter: \f426;
+$fa-var-glass-martini: \f000;
+$fa-var-glide: \f2a5;
+$fa-var-glide-g: \f2a6;
+$fa-var-globe: \f0ac;
+$fa-var-gofore: \f3a7;
+$fa-var-goodreads: \f3a8;
+$fa-var-goodreads-g: \f3a9;
+$fa-var-google: \f1a0;
+$fa-var-google-drive: \f3aa;
+$fa-var-google-play: \f3ab;
+$fa-var-google-plus: \f2b3;
+$fa-var-google-plus-g: \f0d5;
+$fa-var-google-plus-square: \f0d4;
+$fa-var-google-wallet: \f1ee;
+$fa-var-graduation-cap: \f19d;
+$fa-var-gratipay: \f184;
+$fa-var-grav: \f2d6;
+$fa-var-gripfire: \f3ac;
+$fa-var-grunt: \f3ad;
+$fa-var-gulp: \f3ae;
+$fa-var-h-square: \f0fd;
+$fa-var-hacker-news: \f1d4;
+$fa-var-hacker-news-square: \f3af;
+$fa-var-hand-lizard: \f258;
+$fa-var-hand-paper: \f256;
+$fa-var-hand-peace: \f25b;
+$fa-var-hand-point-down: \f0a7;
+$fa-var-hand-point-left: \f0a5;
+$fa-var-hand-point-right: \f0a4;
+$fa-var-hand-point-up: \f0a6;
+$fa-var-hand-pointer: \f25a;
+$fa-var-hand-rock: \f255;
+$fa-var-hand-scissors: \f257;
+$fa-var-hand-spock: \f259;
+$fa-var-handshake: \f2b5;
+$fa-var-hashtag: \f292;
+$fa-var-hdd: \f0a0;
+$fa-var-heading: \f1dc;
+$fa-var-headphones: \f025;
+$fa-var-heart: \f004;
+$fa-var-heartbeat: \f21e;
+$fa-var-hire-a-helper: \f3b0;
+$fa-var-history: \f1da;
+$fa-var-home: \f015;
+$fa-var-hooli: \f427;
+$fa-var-hospital: \f0f8;
+$fa-var-hotjar: \f3b1;
+$fa-var-hourglass: \f254;
+$fa-var-hourglass-end: \f253;
+$fa-var-hourglass-half: \f252;
+$fa-var-hourglass-start: \f251;
+$fa-var-houzz: \f27c;
+$fa-var-html5: \f13b;
+$fa-var-hubspot: \f3b2;
+$fa-var-i-cursor: \f246;
+$fa-var-id-badge: \f2c1;
+$fa-var-id-card: \f2c2;
+$fa-var-image: \f03e;
+$fa-var-images: \f302;
+$fa-var-imdb: \f2d8;
+$fa-var-inbox: \f01c;
+$fa-var-indent: \f03c;
+$fa-var-industry: \f275;
+$fa-var-info: \f129;
+$fa-var-info-circle: \f05a;
+$fa-var-instagram: \f16d;
+$fa-var-internet-explorer: \f26b;
+$fa-var-ioxhost: \f208;
+$fa-var-italic: \f033;
+$fa-var-itunes: \f3b4;
+$fa-var-itunes-note: \f3b5;
+$fa-var-jenkins: \f3b6;
+$fa-var-joget: \f3b7;
+$fa-var-joomla: \f1aa;
+$fa-var-js: \f3b8;
+$fa-var-js-square: \f3b9;
+$fa-var-jsfiddle: \f1cc;
+$fa-var-key: \f084;
+$fa-var-keyboard: \f11c;
+$fa-var-keycdn: \f3ba;
+$fa-var-kickstarter: \f3bb;
+$fa-var-kickstarter-k: \f3bc;
+$fa-var-korvue: \f42f;
+$fa-var-language: \f1ab;
+$fa-var-laptop: \f109;
+$fa-var-laravel: \f3bd;
+$fa-var-lastfm: \f202;
+$fa-var-lastfm-square: \f203;
+$fa-var-leaf: \f06c;
+$fa-var-leanpub: \f212;
+$fa-var-lemon: \f094;
+$fa-var-less: \f41d;
+$fa-var-level-down-alt: \f3be;
+$fa-var-level-up-alt: \f3bf;
+$fa-var-life-ring: \f1cd;
+$fa-var-lightbulb: \f0eb;
+$fa-var-line: \f3c0;
+$fa-var-link: \f0c1;
+$fa-var-linkedin: \f08c;
+$fa-var-linkedin-in: \f0e1;
+$fa-var-linode: \f2b8;
+$fa-var-linux: \f17c;
+$fa-var-lira-sign: \f195;
+$fa-var-list: \f03a;
+$fa-var-list-alt: \f022;
+$fa-var-list-ol: \f0cb;
+$fa-var-list-ul: \f0ca;
+$fa-var-location-arrow: \f124;
+$fa-var-lock: \f023;
+$fa-var-lock-open: \f3c1;
+$fa-var-long-arrow-alt-down: \f309;
+$fa-var-long-arrow-alt-left: \f30a;
+$fa-var-long-arrow-alt-right: \f30b;
+$fa-var-long-arrow-alt-up: \f30c;
+$fa-var-low-vision: \f2a8;
+$fa-var-lyft: \f3c3;
+$fa-var-magento: \f3c4;
+$fa-var-magic: \f0d0;
+$fa-var-magnet: \f076;
+$fa-var-male: \f183;
+$fa-var-map: \f279;
+$fa-var-map-marker: \f041;
+$fa-var-map-marker-alt: \f3c5;
+$fa-var-map-pin: \f276;
+$fa-var-map-signs: \f277;
+$fa-var-mars: \f222;
+$fa-var-mars-double: \f227;
+$fa-var-mars-stroke: \f229;
+$fa-var-mars-stroke-h: \f22b;
+$fa-var-mars-stroke-v: \f22a;
+$fa-var-maxcdn: \f136;
+$fa-var-medapps: \f3c6;
+$fa-var-medium: \f23a;
+$fa-var-medium-m: \f3c7;
+$fa-var-medkit: \f0fa;
+$fa-var-medrt: \f3c8;
+$fa-var-meetup: \f2e0;
+$fa-var-meh: \f11a;
+$fa-var-mercury: \f223;
+$fa-var-microchip: \f2db;
+$fa-var-microphone: \f130;
+$fa-var-microphone-slash: \f131;
+$fa-var-microsoft: \f3ca;
+$fa-var-minus: \f068;
+$fa-var-minus-circle: \f056;
+$fa-var-minus-square: \f146;
+$fa-var-mix: \f3cb;
+$fa-var-mixcloud: \f289;
+$fa-var-mizuni: \f3cc;
+$fa-var-mobile: \f10b;
+$fa-var-mobile-alt: \f3cd;
+$fa-var-modx: \f285;
+$fa-var-monero: \f3d0;
+$fa-var-money-bill-alt: \f3d1;
+$fa-var-moon: \f186;
+$fa-var-motorcycle: \f21c;
+$fa-var-mouse-pointer: \f245;
+$fa-var-music: \f001;
+$fa-var-napster: \f3d2;
+$fa-var-neuter: \f22c;
+$fa-var-newspaper: \f1ea;
+$fa-var-nintendo-switch: \f418;
+$fa-var-node: \f419;
+$fa-var-node-js: \f3d3;
+$fa-var-npm: \f3d4;
+$fa-var-ns8: \f3d5;
+$fa-var-nutritionix: \f3d6;
+$fa-var-object-group: \f247;
+$fa-var-object-ungroup: \f248;
+$fa-var-odnoklassniki: \f263;
+$fa-var-odnoklassniki-square: \f264;
+$fa-var-opencart: \f23d;
+$fa-var-openid: \f19b;
+$fa-var-opera: \f26a;
+$fa-var-optin-monster: \f23c;
+$fa-var-osi: \f41a;
+$fa-var-outdent: \f03b;
+$fa-var-page4: \f3d7;
+$fa-var-pagelines: \f18c;
+$fa-var-paint-brush: \f1fc;
+$fa-var-palfed: \f3d8;
+$fa-var-paper-plane: \f1d8;
+$fa-var-paperclip: \f0c6;
+$fa-var-paragraph: \f1dd;
+$fa-var-paste: \f0ea;
+$fa-var-patreon: \f3d9;
+$fa-var-pause: \f04c;
+$fa-var-pause-circle: \f28b;
+$fa-var-paw: \f1b0;
+$fa-var-paypal: \f1ed;
+$fa-var-pen-square: \f14b;
+$fa-var-pencil-alt: \f303;
+$fa-var-percent: \f295;
+$fa-var-periscope: \f3da;
+$fa-var-phabricator: \f3db;
+$fa-var-phoenix-framework: \f3dc;
+$fa-var-phone: \f095;
+$fa-var-phone-square: \f098;
+$fa-var-phone-volume: \f2a0;
+$fa-var-pied-piper: \f2ae;
+$fa-var-pied-piper-alt: \f1a8;
+$fa-var-pied-piper-pp: \f1a7;
+$fa-var-pinterest: \f0d2;
+$fa-var-pinterest-p: \f231;
+$fa-var-pinterest-square: \f0d3;
+$fa-var-plane: \f072;
+$fa-var-play: \f04b;
+$fa-var-play-circle: \f144;
+$fa-var-playstation: \f3df;
+$fa-var-plug: \f1e6;
+$fa-var-plus: \f067;
+$fa-var-plus-circle: \f055;
+$fa-var-plus-square: \f0fe;
+$fa-var-podcast: \f2ce;
+$fa-var-pound-sign: \f154;
+$fa-var-power-off: \f011;
+$fa-var-print: \f02f;
+$fa-var-product-hunt: \f288;
+$fa-var-pushed: \f3e1;
+$fa-var-puzzle-piece: \f12e;
+$fa-var-python: \f3e2;
+$fa-var-qq: \f1d6;
+$fa-var-qrcode: \f029;
+$fa-var-question: \f128;
+$fa-var-question-circle: \f059;
+$fa-var-quora: \f2c4;
+$fa-var-quote-left: \f10d;
+$fa-var-quote-right: \f10e;
+$fa-var-random: \f074;
+$fa-var-ravelry: \f2d9;
+$fa-var-react: \f41b;
+$fa-var-rebel: \f1d0;
+$fa-var-recycle: \f1b8;
+$fa-var-red-river: \f3e3;
+$fa-var-reddit: \f1a1;
+$fa-var-reddit-alien: \f281;
+$fa-var-reddit-square: \f1a2;
+$fa-var-redo: \f01e;
+$fa-var-redo-alt: \f2f9;
+$fa-var-registered: \f25d;
+$fa-var-rendact: \f3e4;
+$fa-var-renren: \f18b;
+$fa-var-reply: \f3e5;
+$fa-var-reply-all: \f122;
+$fa-var-replyd: \f3e6;
+$fa-var-resolving: \f3e7;
+$fa-var-retweet: \f079;
+$fa-var-road: \f018;
+$fa-var-rocket: \f135;
+$fa-var-rocketchat: \f3e8;
+$fa-var-rockrms: \f3e9;
+$fa-var-rss: \f09e;
+$fa-var-rss-square: \f143;
+$fa-var-ruble-sign: \f158;
+$fa-var-rupee-sign: \f156;
+$fa-var-safari: \f267;
+$fa-var-sass: \f41e;
+$fa-var-save: \f0c7;
+$fa-var-schlix: \f3ea;
+$fa-var-scribd: \f28a;
+$fa-var-search: \f002;
+$fa-var-search-minus: \f010;
+$fa-var-search-plus: \f00e;
+$fa-var-searchengin: \f3eb;
+$fa-var-sellcast: \f2da;
+$fa-var-sellsy: \f213;
+$fa-var-server: \f233;
+$fa-var-servicestack: \f3ec;
+$fa-var-share: \f064;
+$fa-var-share-alt: \f1e0;
+$fa-var-share-alt-square: \f1e1;
+$fa-var-share-square: \f14d;
+$fa-var-shekel-sign: \f20b;
+$fa-var-shield-alt: \f3ed;
+$fa-var-ship: \f21a;
+$fa-var-shirtsinbulk: \f214;
+$fa-var-shopping-bag: \f290;
+$fa-var-shopping-basket: \f291;
+$fa-var-shopping-cart: \f07a;
+$fa-var-shower: \f2cc;
+$fa-var-sign-in-alt: \f2f6;
+$fa-var-sign-language: \f2a7;
+$fa-var-sign-out-alt: \f2f5;
+$fa-var-signal: \f012;
+$fa-var-simplybuilt: \f215;
+$fa-var-sistrix: \f3ee;
+$fa-var-sitemap: \f0e8;
+$fa-var-skyatlas: \f216;
+$fa-var-skype: \f17e;
+$fa-var-slack: \f198;
+$fa-var-slack-hash: \f3ef;
+$fa-var-sliders-h: \f1de;
+$fa-var-slideshare: \f1e7;
+$fa-var-smile: \f118;
+$fa-var-snapchat: \f2ab;
+$fa-var-snapchat-ghost: \f2ac;
+$fa-var-snapchat-square: \f2ad;
+$fa-var-snowflake: \f2dc;
+$fa-var-sort: \f0dc;
+$fa-var-sort-alpha-down: \f15d;
+$fa-var-sort-alpha-up: \f15e;
+$fa-var-sort-amount-down: \f160;
+$fa-var-sort-amount-up: \f161;
+$fa-var-sort-down: \f0dd;
+$fa-var-sort-numeric-down: \f162;
+$fa-var-sort-numeric-up: \f163;
+$fa-var-sort-up: \f0de;
+$fa-var-soundcloud: \f1be;
+$fa-var-space-shuttle: \f197;
+$fa-var-speakap: \f3f3;
+$fa-var-spinner: \f110;
+$fa-var-spotify: \f1bc;
+$fa-var-square: \f0c8;
+$fa-var-stack-exchange: \f18d;
+$fa-var-stack-overflow: \f16c;
+$fa-var-star: \f005;
+$fa-var-star-half: \f089;
+$fa-var-staylinked: \f3f5;
+$fa-var-steam: \f1b6;
+$fa-var-steam-square: \f1b7;
+$fa-var-steam-symbol: \f3f6;
+$fa-var-step-backward: \f048;
+$fa-var-step-forward: \f051;
+$fa-var-stethoscope: \f0f1;
+$fa-var-sticker-mule: \f3f7;
+$fa-var-sticky-note: \f249;
+$fa-var-stop: \f04d;
+$fa-var-stop-circle: \f28d;
+$fa-var-stopwatch: \f2f2;
+$fa-var-strava: \f428;
+$fa-var-street-view: \f21d;
+$fa-var-strikethrough: \f0cc;
+$fa-var-stripe: \f429;
+$fa-var-stripe-s: \f42a;
+$fa-var-studiovinari: \f3f8;
+$fa-var-stumbleupon: \f1a4;
+$fa-var-stumbleupon-circle: \f1a3;
+$fa-var-subscript: \f12c;
+$fa-var-subway: \f239;
+$fa-var-suitcase: \f0f2;
+$fa-var-sun: \f185;
+$fa-var-superpowers: \f2dd;
+$fa-var-superscript: \f12b;
+$fa-var-supple: \f3f9;
+$fa-var-sync: \f021;
+$fa-var-sync-alt: \f2f1;
+$fa-var-table: \f0ce;
+$fa-var-tablet: \f10a;
+$fa-var-tablet-alt: \f3fa;
+$fa-var-tachometer-alt: \f3fd;
+$fa-var-tag: \f02b;
+$fa-var-tags: \f02c;
+$fa-var-tasks: \f0ae;
+$fa-var-taxi: \f1ba;
+$fa-var-telegram: \f2c6;
+$fa-var-telegram-plane: \f3fe;
+$fa-var-tencent-weibo: \f1d5;
+$fa-var-terminal: \f120;
+$fa-var-text-height: \f034;
+$fa-var-text-width: \f035;
+$fa-var-th: \f00a;
+$fa-var-th-large: \f009;
+$fa-var-th-list: \f00b;
+$fa-var-themeisle: \f2b2;
+$fa-var-thermometer-empty: \f2cb;
+$fa-var-thermometer-full: \f2c7;
+$fa-var-thermometer-half: \f2c9;
+$fa-var-thermometer-quarter: \f2ca;
+$fa-var-thermometer-three-quarters: \f2c8;
+$fa-var-thumbs-down: \f165;
+$fa-var-thumbs-up: \f164;
+$fa-var-thumbtack: \f08d;
+$fa-var-ticket-alt: \f3ff;
+$fa-var-times: \f00d;
+$fa-var-times-circle: \f057;
+$fa-var-tint: \f043;
+$fa-var-toggle-off: \f204;
+$fa-var-toggle-on: \f205;
+$fa-var-trademark: \f25c;
+$fa-var-train: \f238;
+$fa-var-transgender: \f224;
+$fa-var-transgender-alt: \f225;
+$fa-var-trash: \f1f8;
+$fa-var-trash-alt: \f2ed;
+$fa-var-tree: \f1bb;
+$fa-var-trello: \f181;
+$fa-var-tripadvisor: \f262;
+$fa-var-trophy: \f091;
+$fa-var-truck: \f0d1;
+$fa-var-tty: \f1e4;
+$fa-var-tumblr: \f173;
+$fa-var-tumblr-square: \f174;
+$fa-var-tv: \f26c;
+$fa-var-twitch: \f1e8;
+$fa-var-twitter: \f099;
+$fa-var-twitter-square: \f081;
+$fa-var-typo3: \f42b;
+$fa-var-uber: \f402;
+$fa-var-uikit: \f403;
+$fa-var-umbrella: \f0e9;
+$fa-var-underline: \f0cd;
+$fa-var-undo: \f0e2;
+$fa-var-undo-alt: \f2ea;
+$fa-var-uniregistry: \f404;
+$fa-var-universal-access: \f29a;
+$fa-var-university: \f19c;
+$fa-var-unlink: \f127;
+$fa-var-unlock: \f09c;
+$fa-var-unlock-alt: \f13e;
+$fa-var-untappd: \f405;
+$fa-var-upload: \f093;
+$fa-var-usb: \f287;
+$fa-var-user: \f007;
+$fa-var-user-circle: \f2bd;
+$fa-var-user-md: \f0f0;
+$fa-var-user-plus: \f234;
+$fa-var-user-secret: \f21b;
+$fa-var-user-times: \f235;
+$fa-var-users: \f0c0;
+$fa-var-ussunnah: \f407;
+$fa-var-utensil-spoon: \f2e5;
+$fa-var-utensils: \f2e7;
+$fa-var-vaadin: \f408;
+$fa-var-venus: \f221;
+$fa-var-venus-double: \f226;
+$fa-var-venus-mars: \f228;
+$fa-var-viacoin: \f237;
+$fa-var-viadeo: \f2a9;
+$fa-var-viadeo-square: \f2aa;
+$fa-var-viber: \f409;
+$fa-var-video: \f03d;
+$fa-var-vimeo: \f40a;
+$fa-var-vimeo-square: \f194;
+$fa-var-vimeo-v: \f27d;
+$fa-var-vine: \f1ca;
+$fa-var-vk: \f189;
+$fa-var-vnv: \f40b;
+$fa-var-volume-down: \f027;
+$fa-var-volume-off: \f026;
+$fa-var-volume-up: \f028;
+$fa-var-vuejs: \f41f;
+$fa-var-weibo: \f18a;
+$fa-var-weixin: \f1d7;
+$fa-var-whatsapp: \f232;
+$fa-var-whatsapp-square: \f40c;
+$fa-var-wheelchair: \f193;
+$fa-var-whmcs: \f40d;
+$fa-var-wifi: \f1eb;
+$fa-var-wikipedia-w: \f266;
+$fa-var-window-close: \f410;
+$fa-var-window-maximize: \f2d0;
+$fa-var-window-minimize: \f2d1;
+$fa-var-window-restore: \f2d2;
+$fa-var-windows: \f17a;
+$fa-var-won-sign: \f159;
+$fa-var-wordpress: \f19a;
+$fa-var-wordpress-simple: \f411;
+$fa-var-wpbeginner: \f297;
+$fa-var-wpexplorer: \f2de;
+$fa-var-wpforms: \f298;
+$fa-var-wrench: \f0ad;
+$fa-var-xbox: \f412;
+$fa-var-xing: \f168;
+$fa-var-xing-square: \f169;
+$fa-var-y-combinator: \f23b;
+$fa-var-yahoo: \f19e;
+$fa-var-yandex: \f413;
+$fa-var-yandex-international: \f414;
+$fa-var-yelp: \f1e9;
+$fa-var-yen-sign: \f157;
+$fa-var-yoast: \f2b1;
+$fa-var-youtube: \f167;
diff --git a/docs/src/assets/fa/fa-brands.scss b/docs/src/assets/fa/fa-brands.scss
new file mode 100644
index 00000000..ab89c020
--- /dev/null
+++ b/docs/src/assets/fa/fa-brands.scss
@@ -0,0 +1,21 @@
+/*!
+ * Font Awesome Free 5.0.2 by @fontawesome - http://fontawesome.com
+ * License - http://fontawesome.com/license (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+
+@font-face {
+ font-family: 'Font Awesome 5 Brands';
+ font-style: normal;
+ font-weight: normal;
+ src: url('#{$fa-font-path}/fa-brands-400.eot');
+ src: url('#{$fa-font-path}/fa-brands-400.eot?#iefix') format('embedded-opentype'),
+ url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
+ url('#{$fa-font-path}/fa-brands-400.woff') format('woff'),
+ url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype'),
+ url('#{$fa-font-path}/fa-brands-400.svg#fontawesome') format('svg');
+}
+
+.fab {
+ font-family: 'Font Awesome 5 Brands';
+}
diff --git a/docs/src/assets/fa/fa-regular.scss b/docs/src/assets/fa/fa-regular.scss
new file mode 100644
index 00000000..4f288292
--- /dev/null
+++ b/docs/src/assets/fa/fa-regular.scss
@@ -0,0 +1,22 @@
+/*!
+ * Font Awesome Free 5.0.2 by @fontawesome - http://fontawesome.com
+ * License - http://fontawesome.com/license (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+
+@font-face {
+ font-family: 'Font Awesome 5 Free';
+ font-style: normal;
+ font-weight: 400;
+ src: url('#{$fa-font-path}/fa-regular-400.eot');
+ src: url('#{$fa-font-path}/fa-regular-400.eot?#iefix') format('embedded-opentype'),
+ url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
+ url('#{$fa-font-path}/fa-regular-400.woff') format('woff'),
+ url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype'),
+ url('#{$fa-font-path}/fa-regular-400.svg#fontawesome') format('svg');
+}
+
+.far {
+ font-family: 'Font Awesome 5 Free';
+ font-weight: 400;
+}
diff --git a/docs/src/assets/fa/fa-solid.scss b/docs/src/assets/fa/fa-solid.scss
new file mode 100644
index 00000000..bb0df52a
--- /dev/null
+++ b/docs/src/assets/fa/fa-solid.scss
@@ -0,0 +1,23 @@
+/*!
+ * Font Awesome Free 5.0.2 by @fontawesome - http://fontawesome.com
+ * License - http://fontawesome.com/license (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+
+@font-face {
+ font-family: 'Font Awesome 5 Free';
+ font-style: normal;
+ font-weight: 900;
+ src: url('#{$fa-font-path}/fa-solid-900.eot');
+ src: url('#{$fa-font-path}/fa-solid-900.eot?#iefix') format('embedded-opentype'),
+ url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
+ url('#{$fa-font-path}/fa-solid-900.woff') format('woff'),
+ url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype'),
+ url('#{$fa-font-path}/fa-solid-900.svg#fontawesome') format('svg');
+}
+
+.fa,
+.fas {
+ font-family: 'Font Awesome 5 Free';
+ font-weight: 900;
+}
diff --git a/docs/src/assets/fa/fontawesome.scss b/docs/src/assets/fa/fontawesome.scss
new file mode 100644
index 00000000..04eb879a
--- /dev/null
+++ b/docs/src/assets/fa/fontawesome.scss
@@ -0,0 +1,16 @@
+/*!
+ * Font Awesome Free 5.0.2 by @fontawesome - http://fontawesome.com
+ * License - http://fontawesome.com/license (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+@import 'mixins';
+@import 'core';
+@import 'larger';
+@import 'fixed-width';
+@import 'list';
+@import 'bordered-pulled';
+@import 'animated';
+@import 'rotated-flipped';
+@import 'stacked';
+@import 'icons';
+@import 'screen-reader';
diff --git a/docs/src/assets/style.scss b/docs/src/assets/style.scss
new file mode 100644
index 00000000..26c22071
--- /dev/null
+++ b/docs/src/assets/style.scss
@@ -0,0 +1,93 @@
+@import "./syntax";
+@import "./badge";
+
+$primary: #C93312;
+$warning-invert: #FFFFFF;
+$family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif, 'Font Awesome 5 Free', 'Font Awesome 5 Brands' !default;
+
+/*!*
+bulma.io v0.8.0 | MIT License | github.com/jgthms/bulma */
+@import "./bulma/utilities/_all";
+@import "./bulma/base/_all";
+@import "./bulma/grid/_all";
+@import "./bulma/elements/_all";
+@import "./bulma/components/_all";
+@import "./bulma/layout/_all";
+
+html, body {
+ height: 100%;
+}
+
+body > div {
+ min-height: 100%;
+}
+
+#sidebar {
+ background-color: #eee;
+ border-right: 1px solid #c1c1c1;
+ box-shadow: 0 0 20px rgba(50, 50, 50, .2) inset;
+ padding: $column-gap + 1rem;
+
+ .brand {
+ padding: 1rem 0;
+ text-align: center;
+ }
+}
+
+#main {
+ padding: 3rem;
+}
+
+.example {
+ .highlight {
+ margin: 0;
+ }
+ .path {
+ font-style: italic;
+ width: 100%;
+ text-align: right;
+ }
+ margin-bottom: 1em;
+}
+
+code {
+ color: #1a9f1a;
+ font-size: 0.875em;
+ font-weight: normal;
+}
+
+.content {
+ h2 {
+ padding-top: 1em;
+ border-top: 1px solid #c0c0c0;
+ }
+}
+
+h1, h2, h3, h4, h5, h6 {
+ .anchor {
+ display: inline-block;
+ width: 0;
+ margin-left: -1.5rem;
+ margin-right: 1.5rem;
+ transition: all 100ms ease-in-out;
+ opacity: 0;
+ }
+ &:hover .anchor {
+ opacity: 1;
+ }
+ &:target {
+ color: $primary;
+ .anchor {
+ opacity: 1;
+ color: $primary
+ }
+ }
+}
+
+.footnotes p {
+ display: inline;
+}
+
+figure.has-border img {
+ box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.25);
+}
diff --git a/docs/src/assets/syntax.css b/docs/src/assets/syntax.css
new file mode 100644
index 00000000..33ce367c
--- /dev/null
+++ b/docs/src/assets/syntax.css
@@ -0,0 +1,59 @@
+/* Background */ .chroma { color: #f8f8f2; background-color: #272822 }
+/* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
+/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
+/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: 100%; overflow: auto; display: block; }
+/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
+/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; display: block; }
+/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
+/* Keyword */ .chroma .k { color: #66d9ef }
+/* KeywordConstant */ .chroma .kc { color: #66d9ef }
+/* KeywordDeclaration */ .chroma .kd { color: #66d9ef }
+/* KeywordNamespace */ .chroma .kn { color: #f92672 }
+/* KeywordPseudo */ .chroma .kp { color: #66d9ef }
+/* KeywordReserved */ .chroma .kr { color: #66d9ef }
+/* KeywordType */ .chroma .kt { color: #66d9ef }
+/* NameAttribute */ .chroma .na { color: #a6e22e }
+/* NameClass */ .chroma .nc { color: #a6e22e }
+/* NameConstant */ .chroma .no { color: #66d9ef }
+/* NameDecorator */ .chroma .nd { color: #a6e22e }
+/* NameException */ .chroma .ne { color: #a6e22e }
+/* NameFunction */ .chroma .nf { color: #a6e22e }
+/* NameOther */ .chroma .nx { color: #a6e22e }
+/* NameTag */ .chroma .nt { color: #f92672 }
+/* Literal */ .chroma .l { color: #ae81ff }
+/* LiteralDate */ .chroma .ld { color: #e6db74 }
+/* LiteralString */ .chroma .s { color: #e6db74 }
+/* LiteralStringAffix */ .chroma .sa { color: #e6db74 }
+/* LiteralStringBacktick */ .chroma .sb { color: #e6db74 }
+/* LiteralStringChar */ .chroma .sc { color: #e6db74 }
+/* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 }
+/* LiteralStringDoc */ .chroma .sd { color: #e6db74 }
+/* LiteralStringDouble */ .chroma .s2 { color: #e6db74 }
+/* LiteralStringEscape */ .chroma .se { color: #ae81ff }
+/* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 }
+/* LiteralStringInterpol */ .chroma .si { color: #e6db74 }
+/* LiteralStringOther */ .chroma .sx { color: #e6db74 }
+/* LiteralStringRegex */ .chroma .sr { color: #e6db74 }
+/* LiteralStringSingle */ .chroma .s1 { color: #e6db74 }
+/* LiteralStringSymbol */ .chroma .ss { color: #e6db74 }
+/* LiteralNumber */ .chroma .m { color: #ae81ff }
+/* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
+/* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
+/* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
+/* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
+/* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
+/* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
+/* Operator */ .chroma .o { color: #f92672 }
+/* OperatorWord */ .chroma .ow { color: #f92672 }
+/* Comment */ .chroma .c { color: #75715e }
+/* CommentHashbang */ .chroma .ch { color: #75715e }
+/* CommentMultiline */ .chroma .cm { color: #75715e }
+/* CommentSingle */ .chroma .c1 { color: #75715e }
+/* CommentSpecial */ .chroma .cs { color: #75715e }
+/* CommentPreproc */ .chroma .cp { color: #75715e }
+/* CommentPreprocFile */ .chroma .cpf { color: #75715e }
+/* GenericDeleted */ .chroma .gd { color: #f92672 }
+/* GenericEmph */ .chroma .ge { font-style: italic }
+/* GenericInserted */ .chroma .gi { color: #a6e22e }
+/* GenericStrong */ .chroma .gs { font-weight: bold }
+/* GenericSubheading */ .chroma .gu { color: #75715e }