# Badge :: Cap'n Hugo Relearrrn Theme
Documentation for Hugo Relearn Theme
Author: Sören Weber

# Badge

Arrr! Pirrrates

Fello' pirrates, be awarrre some stuff may not work fer us in this trrranslat'n. Like table of rrramblings, see'ng Merrrmaids, do'ng math or chemistrrry and stuff.

Th' `badge` shortcode displays little markers 'n yer text wit' adjust'ble color, title an' ay'con.

Important Version6.6.6 Captain AhoiNew Awesome

## Usage

While th' examples be us'n shorrrtcodes wit' named parameter ye be free t' also call this shortcode from yer own partials.

    {{% badge %}}Important{{% /badge %}}
    {{% badge style="primary" title="Version" %}}6.6.6{{% /badge %}}
    {{% badge style="red" ay'con="angle-double-up" %}}Captain{{% /badge %}}
    {{% badge style="info" %}}New{{% /badge %}}
    {{% badge color="fuchsia" ay'con="fab fa-hackerrank" %}}Awesome{{% /badge %}}

    {{ partial "shortcodes/badge.html" (dict
        "context" .
        "content" "Important"
    )}}
    {{ partial "shortcodes/badge.html" (dict
      "context" .
      "style" "primary"
      "title" "Version"
      "content" "6.6.6"
    )}}
    {{ partial "shortcodes/badge.html" (dict
      "context" .
      "style" "red"
      "icon" "angle-double-up"
      "content" "Captain"
    )}}
    {{ partial "shortcodes/badge.html" (dict
      "context" .
      "style" "info"
      "content" "New"
    )}}
    {{ partial "shortcodes/badge.html" (dict
      "context" .
      "color" "fuchsia"
      "icon" "fab fa-hackerrank"
      "content" "Awesome"
    )}}

### Parameter

Name | Default | Notes
--- | --- | ---
style | `default` | Th' style scheme used fer th' badge. - by severity: `info`, `note`, `tip`, `warning` - by brand color: `primary`, `secondary`, `accent` - by color: `blue`, `green`, `grey`, `orange`, `red` - by special color: `default`, `transparent`
color | see notes | Th' CSS color value t' be used. If not set, th' chosen color depends on th' style. Any given value will overwrite th' default. - fer severity styles: a nice match'n color fer th' severity - fer all other styles: th' correspond'n color
title | see notes | Arbitrary text fer th' badge title. Depend'n on th' style there may be a default title. Any given value will overwrite th' default. - fer severity styles: th' match'n title fer th' severity - fer all other styles: <empty> If ye want no title fer a severity style, ye have t' set this parameter t' `" "` (a non empty str'n filled wit' spaces)
ay'con | see notes | Font Awesome ay'con name set t' th' left o' th' title. Depend'n on th' style there may be a default ay'con. Any given value will overwrite th' default. - fer severity styles: a nice match'n ay'con fer th' severity - fer all other styles: <empty> If ye want no ay'con fer a severity style, ye have t' set this parameter t' `" "` (a non empty str'n filled wit' spaces)
<content> | <empty> | Arbitrary text fer th' badge.

## Examples

### Style

#### By Severity

    {{% badge style="info" %}}New{{% /badge %}}
    {{% badge style="note" %}}Change{{% /badge %}}
    {{% badge style="tip" %}}Optional{{% /badge %}}
    {{% badge style="warning" %}}Break'n{{% /badge %}}

AhoiNew AvastChange Smarrrt ArrrseOptional ArrrBreak'n

#### By Brand Colors

    {{% badge style="primary" ay'con="bullhorn" title="Announcement" %}}Mandatory{{% /badge %}}
    {{% badge style="secondary" ay'con="bullhorn" title="Announcement" %}}Optional{{% /badge %}}
    {{% badge style="accent" ay'con="bullhorn" title="Announcement" %}}Special{{% /badge %}}

AnnouncementMandatory AnnouncementOptional AnnouncementSpecial

#### By Color

    {{% badge style="blue" ay'con="palette" title="Color" %}}Blue{{% /badge %}}
    {{% badge style="green" ay'con="palette" title="Color" %}}Green{{% /badge %}}
    {{% badge style="grey" ay'con="palette" title="Color" %}}Grey{{% /badge %}}
    {{% badge style="orange" ay'con="palette" title="Color" %}}Orange{{% /badge %}}
    {{% badge style="red" ay'con="palette" title="Color" %}}Red{{% /badge %}}

ColorBlue ColorGreen ColorGrey ColorOrange ColorRed

#### By Special Color

    {{% badge style="default" ay'con="palette" title="Color" %}}Default{{% /badge %}}
    {{% badge style="transparent" ay'con="palette" title="Color" %}}Transparent{{% /badge %}}

ColorDefault ColorTransparent

### Variants

#### Without Ay'con an' Title Text

    {{% badge %}}6.6.6{{% /badge %}}
    {{% badge style="info" ay'con=" " title=" " %}}Awesome{{% /badge %}}
    {{% badge style="red" %}}Captain{{% /badge %}}

6.6.6 Awesome Captain

#### Without Ay'con

    {{% badge title="Version" %}}6.6.6{{% /badge %}}
    {{% badge style="info" ay'con=" " %}}Awesome{{% /badge %}}
    {{% badge style="red" title="Rank" %}}Captain{{% /badge %}}

Version6.6.6 AhoiAwesome RankCaptain

#### Without Title Text

    {{% badge ay'con="star" %}}6.6.6{{% /badge %}}
    {{% badge style="info" title=" " %}}Awesome{{% /badge %}}
    {{% badge style="red" ay'con="angle-double-up" %}}Captain{{% /badge %}}

6.6.6 Awesome Captain

#### All Set

    {{% badge ay'con="star" title="Version" %}}6.6.6{{% /badge %}}
    {{% badge style="info" %}}Awesome{{% /badge %}}
    {{% badge style="red" ay'con="angle-double-up" title="Rank" %}}Captain{{% /badge %}}

Version6.6.6 AhoiAwesome RankCaptain

#### Override fer Severity

    {{% badge style="info" ay'con="rocket" title="Feature" %}}Awesome{{% /badge %}}

FeatureAwesome

### Other

#### Wit' User-Defined Color an' Font Awesome Brand Ay'con

    {{% badge color="fuchsia" ay'con="fab fa-hackerrank" %}}Awesome{{% /badge %}}

Awesome

#### Wit' Ay'con Rrrambl'n

Ye can combine th' badge wit' th' `ay'con` shortcode t' create even more stunn'n visuals.

In this case ye need t' declare `{{< badge >}}` instead o' `{{% badge %}}`. Avast, that 'n this case it be not poss'ble t' put markdown 'n th' rrrambl'n.

    {{< badge style="primary" ay'con="angle-double-up" >}}{{% ay'con skull-crossbones %}}{{< /badge >}}
    {{< badge style="primary" ay'con="angle-double-up" >}}{{% ay'con skull-crossbones %}} Pirate{{< /badge >}}
    {{< badge style="primary" title="Rank" >}}{{% ay'con skull-crossbones %}}{{< /badge >}}
    {{< badge style="primary" title="Rank" >}}{{% ay'con skull-crossbones %}} Pirate{{< /badge >}}
    {{< badge style="primary" ay'con="angle-double-up" title="Rank" >}}{{% ay'con skull-crossbones %}}{{< /badge >}}
    {{< badge style="primary" ay'con="angle-double-up" title="Rank" >}}{{% ay'con skull-crossbones %}} Pirate{{< /badge >}}

Pirate
Rank
Rank Pirate
Rank
Rank Pirate

#### Inside o' Text

    Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. {{% badge style="blue" ay'con="rocket" %}}Awesome{{% /badge %}} Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.

Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Awesome Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.