mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-27 01:33:04 +00:00
shortcodes: add color parameter #438
This commit is contained in:
Sören Weber
parent
b12855e2f3
commit
7e766aa5dd
13 changed files with 112 additions and 38 deletions
|
|
@ -14,6 +14,12 @@ This document shows you what's new in the latest release. For a detailed list of
|
|||
|
||||
---
|
||||
|
||||
## 5.10.0 (not yet released)
|
||||
|
||||
- {{% badge style="info" icon="plus-circle" title=" " %}}New{{% /badge %}} The [`attachments`]({{% relref "shortcodes/attachments" %}}), [`badge`]({{% relref "shortcodes/badge" %}}), [`button`]({{% relref "shortcodes/button" %}}) and [`notice`]({{% relref "shortcodes/notice" %}}) shortcodes have a new parameter `color` to set arbitrary CSS color values.
|
||||
|
||||
---
|
||||
|
||||
## 5.9.0 (2022-12-23)
|
||||
|
||||
- {{% badge style="note" title=" " %}}Change{{% /badge %}} The required folder name for the [`attachments` shortcode]({{% relref "shortcodes/attachments" %}}) was changed for leaf bundles.
|
||||
|
|
|
|||
|
|
@ -31,6 +31,21 @@ While the examples are using shortcodes with named parameter you are free to als
|
|||
{{% /tab %}}
|
||||
{{< /tabs >}}
|
||||
|
||||
### Parameter
|
||||
|
||||
| Name | Default | Notes |
|
||||
|:------------|:----------------|:------------|
|
||||
| **style** | `transparent` | The style scheme used for the box.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **color** | see notes | The [CSS color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value) to be used. If not set, the chosen color depends on the **style**. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching color for the severity<br>- for all other styles: the corresponding color |
|
||||
| **title** | see notes | Arbitrary text for the box title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other styles: `Attachments`<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **icon** | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other styles: `paperclip`<br><br>If you want no icon, you have to set this parameter to `" "` (a non empty d with spaces) |
|
||||
| **sort** | `asc` | Sorting the output in `asc`ending or `desc`ending order. |
|
||||
| **pattern** | `.*` | A [regular expressions](https://en.wikipedia.org/wiki/Regular_expression), used to filter the attachments by file name. For example:<br><br>- to match a file suffix of 'jpg', use `.*\.jpg` (not `*.\.jpg`)<br>- to match file names ending in `jpg` or `png`, use `.*\.(jpg\|png)` |
|
||||
|
||||
## Setup
|
||||
|
||||
### Single language
|
||||
|
||||
The shortcode lists files found in a specific folder. The name of the folder depends on your page type (either branch bundle, leaf bundle or page).
|
||||
|
||||
1. For simple pages, attachments must be placed in a folder named like your page and ending with `.files`.
|
||||
|
|
@ -61,6 +76,8 @@ The shortcode lists files found in a specific folder. The name of the folder dep
|
|||
> * **_index.files**
|
||||
> * attachment.pdf
|
||||
|
||||
### Multilingual
|
||||
|
||||
Be aware that if you use a multilingual website, you will need to have as many folders as languages and the language code must be part of the folder name.
|
||||
|
||||
Eg. for a site in English and Piratish:
|
||||
|
|
@ -75,16 +92,6 @@ Eg. for a site in English and Piratish:
|
|||
> * page.en.md
|
||||
> * page.pir.md
|
||||
|
||||
### Parameter
|
||||
|
||||
| Name | Default | Notes |
|
||||
|:------------|:--------------|:------------|
|
||||
| **style** | `transparent` | The color scheme used to highlight the box content.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **title** | see notes | Arbitrary text for the box title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other colors: `Attachments`<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **icon** | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other colors: `paperclip`<br><br>If you want no icon, you have to set this parameter to `" "` (a non empty d with spaces) |
|
||||
| **sort** | `asc` | Sorting the output in `asc`ending or `desc`ending order. |
|
||||
| **pattern** | `.*` | A [regular expressions](https://en.wikipedia.org/wiki/Regular_expression), used to filter the attachments by file name. For example:<br><br>- to match a file suffix of 'jpg', use `.*\.jpg` (not `*.\.jpg`)<br>- to match file names ending in `jpg` or `png`, use `.*\.(jpg\|png)` |
|
||||
|
||||
## Examples
|
||||
|
||||
### Custom Title, List of Attachments Ending in pdf or mp4
|
||||
|
|
@ -103,6 +110,14 @@ Eg. for a site in English and Piratish:
|
|||
|
||||
{{% attachments style="info" sort="desc" /%}}
|
||||
|
||||
### Style and Icons
|
||||
### With User-Defined Color and Font Awesome Brand Icon
|
||||
|
||||
For further examples for **style**, **title** and **icon**, see the [`notice` shortcode]({{% relref "shortcodes/notice" %}}) documentation. The parameter are working the same way for both shortcodes, besides having different defaults.
|
||||
````go
|
||||
{{%/* attachments color="fuchsia" icon="fab fa-hackerrank" /*/%}}
|
||||
````
|
||||
|
||||
{{% attachments color="fuchsia" icon="fab fa-hackerrank" /%}}
|
||||
|
||||
### Style, Color, Title and Icons
|
||||
|
||||
For further examples for **style**, **color**, **title** and **icon**, see the [`notice` shortcode]({{% relref "shortcodes/notice" %}}) documentation. The parameter are working the same way for both shortcodes, besides having different defaults.
|
||||
|
|
|
|||
|
|
@ -8,7 +8,8 @@ The `badge` shortcode displays little markers in your text with adjustable color
|
|||
{{% badge %}}Important{{% /badge %}}
|
||||
{{% badge style="primary" title="Version" %}}6.6.6{{% /badge %}}
|
||||
{{% badge style="red" icon="angle-double-up" %}}Captain{{% /badge %}}
|
||||
{{% badge style="info" %}}Awesome{{% /badge %}}
|
||||
{{% badge style="info" %}}New{{% /badge %}}
|
||||
{{% badge color="fuchsia" icon="fab fa-hackerrank" %}}Awesome{{% /badge %}}
|
||||
|
||||
## Usage
|
||||
|
||||
|
|
@ -21,7 +22,8 @@ While the examples are using shortcodes with named parameter you are free to als
|
|||
{{%/* badge %}}Important{{% /badge */%}}
|
||||
{{%/* badge style="primary" title="Version" %}}6.6.6{{% /badge */%}}
|
||||
{{%/* badge style="red" icon="angle-double-up" %}}Captain{{% /badge */%}}
|
||||
{{%/* badge style="info" %}}Awesome{{% /badge */%}}
|
||||
{{%/* badge style="info" %}}New{{% /badge */%}}
|
||||
{{%/* badge color="fuchsia" icon="fab fa-hackerrank" %}}Awesome{{% /badge */%}}
|
||||
````
|
||||
|
||||
{{% /tab %}}
|
||||
|
|
@ -47,6 +49,12 @@ While the examples are using shortcodes with named parameter you are free to als
|
|||
{{ partial "shortcodes/badge.html" (dict
|
||||
"context" .
|
||||
"style" "info"
|
||||
"content" "New"
|
||||
)}}
|
||||
{{ partial "shortcodes/badge.html" (dict
|
||||
"context" .
|
||||
"color" "fuchsia"
|
||||
"icon" "fab fa-hackerrank"
|
||||
"content" "Awesome"
|
||||
)}}
|
||||
````
|
||||
|
|
@ -58,9 +66,10 @@ While the examples are using shortcodes with named parameter you are free to als
|
|||
|
||||
| Name | Default | Notes |
|
||||
|:----------------------|:----------------|:------------|
|
||||
| **style** | `default` | The color scheme used to paint the badge.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **icon** | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other colors: _<empty>_<br><br>If you want no icon for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **title** | see notes | Arbitrary text for the badge title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other colors: _<empty>_<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **style** | `default` | The style scheme used for the badge.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **color** | see notes | The [CSS color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value) to be used. If not set, the chosen color depends on the **style**. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching color for the severity<br>- for all other styles: the corresponding color |
|
||||
| **title** | see notes | Arbitrary text for the badge title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other styles: _<empty>_<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **icon** | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other styles: _<empty>_<br><br>If you want no icon for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| _**<content>**_ | _<empty>_ | Arbitrary text for the badge. |
|
||||
|
||||
## Examples
|
||||
|
|
@ -177,9 +186,17 @@ While the examples are using shortcodes with named parameter you are free to als
|
|||
|
||||
### Other
|
||||
|
||||
#### With User-Defined Color and Font Awesome Brand Icon
|
||||
|
||||
````go
|
||||
{{%/* badge color="fuchsia" icon="fab fa-hackerrank" %}}Awesome{{% /badge */%}}
|
||||
````
|
||||
|
||||
{{% badge color="fuchsia" icon="fab fa-hackerrank" %}}Awesome{{% /badge %}}
|
||||
|
||||
#### With Icon Content
|
||||
|
||||
You can combine the badge with the [`icon` shortcode]({{% relref "shortcodes/icon" %}}) to create even more stunning variants.
|
||||
You can combine the badge with the [`icon` shortcode]({{% relref "shortcodes/icon" %}}) to create even more stunning visuals.
|
||||
|
||||
In this case you need to declare `{{</* badge */>}}` instead of `{{%/* badge */%}}`. Note, that in this case it is not possible to put markdown in the content.
|
||||
|
||||
|
|
|
|||
|
|
@ -48,12 +48,13 @@ Once the button is clicked, it opens another browser tab for the given URL.
|
|||
| Name | Default | Notes |
|
||||
|:----------------------|:----------------|:------------|
|
||||
| **href** | _<empty>_ | Either the destination URL for the button or JavaScript code to be executed on click. If this parameter is not set, the button will do nothing but is still displayed as clickable.<br><br>- if starting with `javascript:` all following text will be executed in your browser<br>- every other string will be interpreted as URL|
|
||||
| **style** | `transparent` | The color scheme used to paint the button.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **icon** | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other colors: _<empty>_<br><br>If you want no icon for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **style** | `transparent` | The style scheme used for the button.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **color** | see notes | The [CSS color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value) to be used. If not set, the chosen color depends on the **style**. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching color for the severity<br>- for all other styles: the corresponding color |
|
||||
| **icon** | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other styles: _<empty>_<br><br>If you want no icon for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **iconposition** | `left` | Places the icon to the `left` or `right` of the title. |
|
||||
| **target** | see notes | The destination frame/window if **href** is an URL. Otherwise the parameter is not used. This behaves similar to normal links. If the parameter is not given it defaults to:<br><br>- the setting of `externalLinkTarget` or `_blank` if not set, for any address starting with `http://` or `https://`<br>- no specific value for all other links |
|
||||
| **type** | see notes | The [button type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type) if **href** is JavaScript. Otherwise the parameter is not used. If the parameter is not given it defaults to `button` |
|
||||
| _**<content>**_ | see notes | Arbitrary text for the button title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other colors: _<empty>_<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| _**<content>**_ | see notes | Arbitrary text for the button title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other styles: _<empty>_<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
|
||||
## Examples
|
||||
|
||||
|
|
@ -147,6 +148,14 @@ Once the button is clicked, it opens another browser tab for the given URL.
|
|||
|
||||
### Other
|
||||
|
||||
#### With User-Defined Color and Font Awesome Brand Icon
|
||||
|
||||
````go
|
||||
{{%/* button href="https://gohugo.io/" color="fuchsia" icon="fab fa-hackerrank" %}}Hugo{{% /button */%}}
|
||||
````
|
||||
|
||||
{{% button href="https://gohugo.io/" color="fuchsia" icon="fab fa-hackerrank" %}}Hugo{{% /button %}}
|
||||
|
||||
#### Severity Style with All Defaults
|
||||
|
||||
````go
|
||||
|
|
|
|||
|
|
@ -51,9 +51,10 @@ It is all about the boxes.
|
|||
|
||||
| Name | Position | Default | Notes |
|
||||
|:----------|:---------|:----------|:------------|
|
||||
| **style** | 1 | `default` | The color scheme used to highlight the box content.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **title** | 2 | see notes | Arbitrary text for the box title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other colors: _<empty>_<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **icon** | 3 | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other colors: _<empty>_<br><br>If you want no icon for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **style** | 1 | `default` | The style scheme used for the box.<br><br>- by severity: `info`, `note`, `tip`, `warning`<br>- by brand color: `primary`, `secondary`<br>- by color: `blue`, `green`, `grey`, `orange`, `red`<br>- by special color: `default`, `transparent` |
|
||||
| **color** | | see notes | The [CSS color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value) to be used. If not set, the chosen color depends on the **style**. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching color for the severity<br>- for all other styles: the corresponding color |
|
||||
| **title** | 2 | see notes | Arbitrary text for the box title. Depending on the **style** there may be a default title. Any given value will overwrite the default.<br><br>- for severity styles: the matching title for the severity<br>- for all other styles: _<empty>_<br><br>If you want no title for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| **icon** | 3 | see notes | [Font Awesome icon name]({{%relref "shortcodes/icon#finding-an-icon" %}}) set to the left of the title. Depending on the **style** there may be a default icon. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching icon for the severity<br>- for all other styles: _<empty>_<br><br>If you want no icon for a severity style, you have to set this parameter to `" "` (a non empty string filled with spaces) |
|
||||
| _**<content>**_ | | _<empty>_ | Arbitrary text to be displayed in box. |
|
||||
|
||||
## Examples
|
||||
|
|
@ -249,10 +250,10 @@ A **red** disclaimer
|
|||
|
||||
### By Special Color
|
||||
|
||||
#### Default with Title and Icon
|
||||
#### Default with Positional Parameter
|
||||
|
||||
````go
|
||||
{{%/* notice style="default" title"Pay Attention to this Note!" icon="skull-crossbones" */%}}
|
||||
{{%/* notice default "Pay Attention to this Note!" "skull-crossbones" */%}}
|
||||
Some serious information.
|
||||
{{%/* /notice */%}}
|
||||
````
|
||||
|
|
@ -264,7 +265,7 @@ Some serious information.
|
|||
#### Transparent with Title and Icon
|
||||
|
||||
````go
|
||||
{{%/* notice style="transparent" title"Pay Attention to this Note!" icon="skull-crossbones" */%}}
|
||||
{{%/* notice style="transparent" title="Pay Attention to this Note!" icon="skull-crossbones" */%}}
|
||||
Some serious information.
|
||||
{{%/* /notice */%}}
|
||||
````
|
||||
|
|
@ -272,3 +273,15 @@ Some serious information.
|
|||
{{% notice style="transparent" title="Pay Attention to this Note!" icon="skull-crossbones" %}}
|
||||
Some serious information.
|
||||
{{% /notice %}}
|
||||
|
||||
### With User-Defined Color and Font Awesome Brand Icon
|
||||
|
||||
````go
|
||||
{{%/* notice color="fuchsia" title="Hugo" icon="fab fa-hackerrank" */%}}
|
||||
Victor? Is it you?
|
||||
{{%/* /notice */%}}
|
||||
````
|
||||
|
||||
{{% notice color="fuchsia" title="Hugo" icon="fab fa-hackerrank" %}}
|
||||
Victor? Is it you?
|
||||
{{% /notice %}}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
{{- $context := .context }}
|
||||
{{- $color := .color | default "" }}
|
||||
{{- $content := .content }}
|
||||
{{- $style := .style | default "transparent" }}
|
||||
{{- $style := .style | default "default" }}
|
||||
{{- if and (not $color) (eq (len $color) 0) }}
|
||||
{{- $style = .style | default "transparent" }}
|
||||
{{- end }}
|
||||
{{- $title := .title | default ($style | T) | default ("Attachments-label" | T) }}
|
||||
{{- $title = trim $title " " }}
|
||||
{{- $icon := .icon | default "" }}
|
||||
|
|
@ -22,7 +26,7 @@
|
|||
{{- $defaultUrlPrefix := strings.TrimRight "/" $defaultLanguagePage.RelPermalink }}
|
||||
{{- $urlPrefix := strings.TrimRight "/" $context.Page.RelPermalink }}
|
||||
{{- with $context }}
|
||||
<div class="box attachments cstyle {{ $style }}">
|
||||
<div class="box attachments cstyle {{ $style }}"{{ if $color }} style="--VARIABLE-BOX-color: {{ $color }};"{{ end }}>
|
||||
<div class="box-label">{{ if $icon }}<i class="{{ $icon }}"></i>{{ end }}{{ if and $icon $title }} {{ end }}{{ $title }}</div>
|
||||
<ul class="box-content attachments-files">
|
||||
{{- $fileLink := printf "%s/%s" (.Page.Language.ContentDir | default "content") .Page.File.Dir }}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
{{- $context := .context }}
|
||||
{{- $color := .color | default "" }}
|
||||
{{- $content := .content }}
|
||||
{{- $style := .style | default "default" }}
|
||||
{{- $title := .title | default ($style | T) }}
|
||||
|
|
@ -15,5 +16,5 @@
|
|||
{{- $icon = printf "fa-fw fas fa-%s" $icon }}
|
||||
{{- end }}
|
||||
{{- with $context -}}
|
||||
<span class="badge cstyle {{ $style }}{{ if or $icon $title }} badge-with-title{{ end }}">{{ if or $icon $title }}<span class="badge-title">{{ if $icon }}<i class="{{ $icon }}"></i>{{ end }}{{ if and $icon $title }} {{ end }}{{ if $title }}{{ $title }}{{ end }}</span>{{ end }}<span class="badge-content">{{ $content }}</span></span>
|
||||
<span class="badge cstyle {{ $style }}{{ if or $icon $title }} badge-with-title{{ end }}">{{ if or $icon $title }}<span class="badge-title">{{ if $icon }}<i class="{{ $icon }}"></i>{{ end }}{{ if and $icon $title }} {{ end }}{{ if $title }}{{ $title }}{{ end }}</span>{{ end }}<span class="badge-content"{{ if $color }} style="background-color: {{ $color }};"{{ end }}>{{ $content }}</span></span>
|
||||
{{- end }}
|
||||
|
|
@ -1,7 +1,11 @@
|
|||
{{- $context := .context }}
|
||||
{{- $color := .color | default "" }}
|
||||
{{- $content := .content }}
|
||||
{{- $href := (trim .href " ") | default "" }}
|
||||
{{- $style := .style | default "transparent" }}
|
||||
{{- $style := .style | default "default" }}
|
||||
{{- if and (not $color) (eq (len $color) 0) }}
|
||||
{{- $style = .style | default "transparent" }}
|
||||
{{- end }}
|
||||
{{- $target := .target | default "" }}
|
||||
{{- $type := .type | default "" }}
|
||||
{{- $isButton := false }}
|
||||
|
|
@ -32,7 +36,7 @@
|
|||
{{- end }}
|
||||
{{- $iconposition := .iconposition | default "left" }}
|
||||
{{- with $context }}
|
||||
<span class="btn cstyle {{ $style }}">
|
||||
<span class="btn cstyle {{ $style }}"{{ if $color }} style="--VARIABLE-BOX-color: {{ $color }};"{{ end }}>
|
||||
{{- if $isButton }}
|
||||
<button{{ if $href }} onclick="{{ $href | safeJS }}"{{ end }}{{ if gt (len $type) 0 }} type="{{ $type }}"{{ end }}>
|
||||
{{- else }}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
{{- $context := .context }}
|
||||
{{- $color := .color | default "" }}
|
||||
{{- $content := .content }}
|
||||
{{- $style := .style | default "default" }}
|
||||
{{- $title := .title | default ($style | T) }}
|
||||
|
|
@ -15,7 +16,7 @@
|
|||
{{- $icon = printf "fa-fw fas fa-%s" $icon }}
|
||||
{{- end }}
|
||||
{{- with $context }}
|
||||
<div class="box notices cstyle {{ $style }}">
|
||||
<div class="box notices cstyle {{ $style }}"{{ if $color }} style="--VARIABLE-BOX-color: {{ $color }};"{{ end }}>
|
||||
<div class="box-label">{{ if $icon }}<i class="{{ $icon }}"></i>{{ end }}{{ if and $icon $title }} {{ end }}{{ $title }}</div>
|
||||
<div class="box-content">
|
||||
{{ $content | safeHTML }} </div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
{{- $_hugo_config := `{ "version": 1 }` }}
|
||||
{{- partial "shortcodes/attachments.html" (dict
|
||||
"context" .
|
||||
"color" (.Get "color")
|
||||
"content" .Inner
|
||||
"icon" (.Get "icon")
|
||||
"pattern" (.Get "pattern")
|
||||
|
|
|
|||
|
|
@ -1,8 +1,9 @@
|
|||
{{- $_hugo_config := `{ "version": 1 }` }}
|
||||
{{- partial "shortcodes/badge.html" (dict
|
||||
"context" .
|
||||
"color" (.Get "color")
|
||||
"content" .Inner
|
||||
"icon" (.Get "icon")
|
||||
"style" (.Get "style")
|
||||
"title" (.Get "title")
|
||||
"icon" (.Get "icon")
|
||||
"style" (.Get "style")
|
||||
"title" (.Get "title")
|
||||
) }}
|
||||
|
|
@ -1,7 +1,8 @@
|
|||
{{- $_hugo_config := `{ "version": 1 }` }}
|
||||
{{- partial "shortcodes/button.html" (dict
|
||||
"context" .
|
||||
"content" .Inner
|
||||
"context" .
|
||||
"color" (.Get "color")
|
||||
"content" .Inner
|
||||
"href" (.Get "href")
|
||||
"icon" (.Get "icon")
|
||||
"iconposition" ((.Get "iconposition") | default (.Get "icon-position"))
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
{{- $_hugo_config := `{ "version": 1 }` }}
|
||||
{{- partial "shortcodes/notice.html" (dict
|
||||
"context" .
|
||||
"color" (.Get "color")
|
||||
"content" .Inner
|
||||
"icon" (.Get "icon" | default (.Get 2))
|
||||
"style" (.Get "style" | default (.Get 0))
|
||||
|
|
|
|||
Loading…
Reference in a new issue