mirror of
https://github.com/gethinode/hinode.git
synced 2025-10-07 18:14:28 +00:00
Introduce badge shortcode to replace HTML code
This commit is contained in:
@@ -49,15 +49,26 @@ As an example, the following shortcode displays a simple alert.
|
|||||||
|
|
||||||
## Badge
|
## Badge
|
||||||
|
|
||||||
Use HTML code to display a badge for a heading. See the Bootstrap [documentation]({{< param "links.bs_badge_heading" >}}) for more options.
|
Use the badge shortcode to display a badge for a heading.
|
||||||
|
|
||||||
{{< example >}}
|
{{< example >}}
|
||||||
<h1>Example heading of size one <span class="badge bg-secondary">New</span></h1>
|
Heading 1 {{</* badge title="New" */>}}
|
||||||
<h2>Example heading of size two <span class="badge bg-secondary">New</span></h2>
|
{.h1}
|
||||||
<h3>Example heading of size three <span class="badge bg-secondary">New</span></h3>
|
|
||||||
<h4>Example heading of size four <span class="badge bg-secondary">New</span></h4>
|
Heading 2 {{</* badge title="New" */>}}
|
||||||
<h5>Example heading of size five <span class="badge bg-secondary">New</span></h5>
|
{.h2}
|
||||||
<h6>Example heading of size six <span class="badge bg-secondary">New</span></h6>
|
|
||||||
|
Heading 3 {{</* badge title="New" */>}}
|
||||||
|
{.h3}
|
||||||
|
|
||||||
|
Heading 4 {{</* badge title="New" */>}}
|
||||||
|
{.h4}
|
||||||
|
|
||||||
|
Heading 5 {{</* badge title="New" */>}}
|
||||||
|
{.h5}
|
||||||
|
|
||||||
|
Heading 6 {{</* badge title="New" */>}}
|
||||||
|
{.h6}
|
||||||
{{< /example >}}
|
{{< /example >}}
|
||||||
|
|
||||||
## Breadcrumb
|
## Breadcrumb
|
||||||
|
23
layouts/shortcodes/badge.html
Normal file
23
layouts/shortcodes/badge.html
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
<!--
|
||||||
|
Adds an inline badge. The shortcode supports the following arguments:
|
||||||
|
"title" Required title of the badge.
|
||||||
|
"class" Optional class attributes of the badge element.
|
||||||
|
"color" Optional theme color of the element, either "primary", "secondary" (default), "success",
|
||||||
|
"danger", "warning", "info", "light", "dark", "white", or "black".
|
||||||
|
-->
|
||||||
|
|
||||||
|
{{- $error := false -}}
|
||||||
|
{{- $title := .Get "title" -}}
|
||||||
|
{{- $class := .Get "class" -}}
|
||||||
|
{{- $color := "secondary" -}}
|
||||||
|
{{- with .Get "color" }}{{ $color = . }}{{ end -}}
|
||||||
|
{{- $supportedColors := slice "primary" "secondary" "success" "danger" "warning" "info" "light" "dark" "white" "black" -}}
|
||||||
|
{{- if not (in $supportedColors $color) -}}
|
||||||
|
{{- errorf "Invalid value for param 'color': %s" .Position -}}
|
||||||
|
{{- end -}}
|
||||||
|
|
||||||
|
{{- if not $title }}
|
||||||
|
{{ errorf "Missing title: %s" .Position -}}
|
||||||
|
{{ else -}}
|
||||||
|
<span class="badge bg-{{ $color }}{{ with $class }} {{ . }}{{ end }}">{{ $title | plainify }}</span>
|
||||||
|
{{ end -}}
|
Reference in New Issue
Block a user