nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-23 07:47:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

shortcodes: add color parameter #438

Browse source
This commit is contained in:
Sören Weber 2023-01-23 22:35:43 +01:00
parent b12855e2f3
commit 7e766aa5dd
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
13 changed files with 112 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
exampleSite/content/basics/migration/_index.en.md
View file

@ -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) ## 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. - {{% badge style="note" title=" " %}}Change{{% /badge %}} The required folder name for the [`attachments` shortcode]({{% relref "shortcodes/attachments" %}}) was changed for leaf bundles.

39
exampleSite/content/shortcodes/attachments.en.md
View file

@ -31,6 +31,21 @@ While the examples are using shortcodes with named parameter you are free to als
{{% /tab %}} {{% /tab %}}
{{< /tabs >}} {{< /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). 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`. 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** > * **_index.files**
> * attachment.pdf > * 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. 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: Eg. for a site in English and Piratish:
@ -75,16 +92,6 @@ Eg. for a site in English and Piratish:
> * page.en.md > * page.en.md
> * page.pir.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 ## Examples
### Custom Title, List of Attachments Ending in pdf or mp4 ### 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" /%}} {{% 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.

29
exampleSite/content/shortcodes/badge.en.md
View file

@ -8,7 +8,8 @@ The `badge` shortcode displays little markers in your text with adjustable color
{{% badge %}}Important{{% /badge %}} {{% badge %}}Important{{% /badge %}}
{{% badge style="primary" title="Version" %}}6.6.6{{% /badge %}} {{% badge style="primary" title="Version" %}}6.6.6{{% /badge %}}
{{% badge style="red" icon="angle-double-up" %}}Captain{{% /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 ## Usage
@ -21,7 +22,8 @@ While the examples are using shortcodes with named parameter you are free to als
{{%/* badge %}}Important{{% /badge */%}} {{%/* badge %}}Important{{% /badge */%}}
{{%/* badge style="primary" title="Version" %}}6.6.6{{% /badge */%}} {{%/* badge style="primary" title="Version" %}}6.6.6{{% /badge */%}}
{{%/* badge style="red" icon="angle-double-up" %}}Captain{{% /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 %}} {{% /tab %}}
@ -47,6 +49,12 @@ While the examples are using shortcodes with named parameter you are free to als
{{ partial "shortcodes/badge.html" (dict {{ partial "shortcodes/badge.html" (dict
"context" . "context" .
"style" "info" "style" "info"
"content" "New"
)}}
{{ partial "shortcodes/badge.html" (dict
"context" .
"color" "fuchsia"
"icon" "fab fa-hackerrank"
"content" "Awesome" "content" "Awesome"
)}} )}}
```` ````
@ -58,9 +66,10 @@ While the examples are using shortcodes with named parameter you are free to als
| Name | Default | Notes | | 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` | | **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` |
| **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: _&lt;empty&gt;_<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) | | **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 colors: _&lt;empty&gt;_<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) | | **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: _&lt;empty&gt;_<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: _&lt;empty&gt;_<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) |
| _**&lt;content&gt;**_ | _&lt;empty&gt;_ | Arbitrary text for the badge. | | _**&lt;content&gt;**_ | _&lt;empty&gt;_ | Arbitrary text for the badge. |
## Examples ## Examples
@ -177,9 +186,17 @@ While the examples are using shortcodes with named parameter you are free to als
### Other ### 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 #### 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. 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.

15
exampleSite/content/shortcodes/button.en.md
View file

@ -48,12 +48,13 @@ Once the button is clicked, it opens another browser tab for the given URL.
| Name | Default | Notes | | Name | Default | Notes |
|:----------------------|:----------------|:------------| |:----------------------|:----------------|:------------|
| **href** | _&lt;empty&gt;_ | 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| | **href** | _&lt;empty&gt;_ | 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` | | **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` |
| **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: _&lt;empty&gt;_<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) | | **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: _&lt;empty&gt;_<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. | | **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 | | **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` | | **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` |
| _**&lt;content&gt;**_ | 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: _&lt;empty&gt;_<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) | | _**&lt;content&gt;**_ | 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: _&lt;empty&gt;_<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 ## Examples
@ -147,6 +148,14 @@ Once the button is clicked, it opens another browser tab for the given URL.
### Other ### 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 #### Severity Style with All Defaults
````go ````go

25
exampleSite/content/shortcodes/notice.en.md
View file

@ -51,9 +51,10 @@ It is all about the boxes.
| Name | Position | Default | Notes | | 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` | | **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` |
| **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: _&lt;empty&gt;_<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) | | **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** | 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: _&lt;empty&gt;_<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** | 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: _&lt;empty&gt;_<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: _&lt;empty&gt;_<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) |
| _**&lt;content&gt;**_ | | _&lt;empty&gt;_ | Arbitrary text to be displayed in box. | | _**&lt;content&gt;**_ | | _&lt;empty&gt;_ | Arbitrary text to be displayed in box. |
## Examples ## Examples
@ -249,10 +250,10 @@ A **red** disclaimer
### By Special Color ### By Special Color
#### Default with Title and Icon #### Default with Positional Parameter
````go ````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. Some serious information.
{{%/* /notice */%}} {{%/* /notice */%}}
```` ````
@ -264,7 +265,7 @@ Some serious information.
#### Transparent with Title and Icon #### Transparent with Title and Icon
````go ````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. Some serious information.
{{%/* /notice */%}} {{%/* /notice */%}}
```` ````
@ -272,3 +273,15 @@ Some serious information.
{{% 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. Some serious information.
{{% /notice %}} {{% /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 %}}

8
layouts/partials/shortcodes/attachments.html
View file

@ -1,6 +1,10 @@
{{- $context := .context }} {{- $context := .context }}
{{- $color := .color | default "" }}
{{- $content := .content }} {{- $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 := .title | default ($style | T) | default ("Attachments-label" | T) }}
{{- $title = trim $title " " }} {{- $title = trim $title " " }}
{{- $icon := .icon | default "" }} {{- $icon := .icon | default "" }}
@ -22,7 +26,7 @@
{{- $defaultUrlPrefix := strings.TrimRight "/" $defaultLanguagePage.RelPermalink }} {{- $defaultUrlPrefix := strings.TrimRight "/" $defaultLanguagePage.RelPermalink }}
{{- $urlPrefix := strings.TrimRight "/" $context.Page.RelPermalink }} {{- $urlPrefix := strings.TrimRight "/" $context.Page.RelPermalink }}
{{- with $context }} {{- 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> <div class="box-label">{{ if $icon }}<i class="{{ $icon }}"></i>{{ end }}{{ if and $icon $title }} {{ end }}{{ $title }}</div>
<ul class="box-content attachments-files"> <ul class="box-content attachments-files">
{{- $fileLink := printf "%s/%s" (.Page.Language.ContentDir | default "content") .Page.File.Dir }} {{- $fileLink := printf "%s/%s" (.Page.Language.ContentDir | default "content") .Page.File.Dir }}

3
layouts/partials/shortcodes/badge.html
View file

@ -1,4 +1,5 @@
{{- $context := .context }} {{- $context := .context }}
{{- $color := .color | default "" }}
{{- $content := .content }} {{- $content := .content }}
{{- $style := .style | default "default" }} {{- $style := .style | default "default" }}
{{- $title := .title | default ($style | T) }} {{- $title := .title | default ($style | T) }}
@ -15,5 +16,5 @@
{{- $icon = printf "fa-fw fas fa-%s" $icon }} {{- $icon = printf "fa-fw fas fa-%s" $icon }}
{{- end }} {{- end }}
{{- with $context -}} {{- 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 }} {{- end }}

8
layouts/partials/shortcodes/button.html
View file

@ -1,7 +1,11 @@
{{- $context := .context }} {{- $context := .context }}
{{- $color := .color | default "" }}
{{- $content := .content }} {{- $content := .content }}
{{- $href := (trim .href " ") | default "" }} {{- $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 "" }} {{- $target := .target | default "" }}
{{- $type := .type | default "" }} {{- $type := .type | default "" }}
{{- $isButton := false }} {{- $isButton := false }}
@ -32,7 +36,7 @@
{{- end }} {{- end }}
{{- $iconposition := .iconposition | default "left" }} {{- $iconposition := .iconposition | default "left" }}
{{- with $context }} {{- with $context }}
<span class="btn cstyle {{ $style }}"> <span class="btn cstyle {{ $style }}"{{ if $color }} style="--VARIABLE-BOX-color: {{ $color }};"{{ end }}>
{{- if $isButton }} {{- if $isButton }}
<button{{ if $href }} onclick="{{ $href | safeJS }}"{{ end }}{{ if gt (len $type) 0 }} type="{{ $type }}"{{ end }}> <button{{ if $href }} onclick="{{ $href | safeJS }}"{{ end }}{{ if gt (len $type) 0 }} type="{{ $type }}"{{ end }}>
{{- else }} {{- else }}

3
layouts/partials/shortcodes/notice.html
View file

@ -1,4 +1,5 @@
{{- $context := .context }} {{- $context := .context }}
{{- $color := .color | default "" }}
{{- $content := .content }} {{- $content := .content }}
{{- $style := .style | default "default" }} {{- $style := .style | default "default" }}
{{- $title := .title | default ($style | T) }} {{- $title := .title | default ($style | T) }}
@ -15,7 +16,7 @@
{{- $icon = printf "fa-fw fas fa-%s" $icon }} {{- $icon = printf "fa-fw fas fa-%s" $icon }}
{{- end }} {{- end }}
{{- with $context }} {{- 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-label">{{ if $icon }}<i class="{{ $icon }}"></i>{{ end }}{{ if and $icon $title }} {{ end }}{{ $title }}</div>
<div class="box-content"> <div class="box-content">
{{ $content | safeHTML }} </div> {{ $content | safeHTML }} </div>

1
layouts/shortcodes/attachments.html
View file

@ -1,6 +1,7 @@
{{- $_hugo_config := `{ "version": 1 }` }} {{- $_hugo_config := `{ "version": 1 }` }}
{{- partial "shortcodes/attachments.html" (dict {{- partial "shortcodes/attachments.html" (dict
"context" . "context" .
"color" (.Get "color")
"content" .Inner "content" .Inner
"icon" (.Get "icon") "icon" (.Get "icon")
"pattern" (.Get "pattern") "pattern" (.Get "pattern")

7
layouts/shortcodes/badge.html
View file

@ -1,8 +1,9 @@
{{- $_hugo_config := `{ "version": 1 }` }} {{- $_hugo_config := `{ "version": 1 }` }}
{{- partial "shortcodes/badge.html" (dict {{- partial "shortcodes/badge.html" (dict
"context" . "context" .
"color" (.Get "color")
"content" .Inner "content" .Inner
"icon" (.Get "icon") "icon" (.Get "icon")
"style" (.Get "style") "style" (.Get "style")
"title" (.Get "title") "title" (.Get "title")
) }} ) }}

5
layouts/shortcodes/button.html
View file

@ -1,7 +1,8 @@
{{- $_hugo_config := `{ "version": 1 }` }} {{- $_hugo_config := `{ "version": 1 }` }}
{{- partial "shortcodes/button.html" (dict {{- partial "shortcodes/button.html" (dict
"context" . "context" .
"content" .Inner "color" (.Get "color")
"content" .Inner
"href" (.Get "href") "href" (.Get "href")
"icon" (.Get "icon") "icon" (.Get "icon")
"iconposition" ((.Get "iconposition") | default (.Get "icon-position")) "iconposition" ((.Get "iconposition") | default (.Get "icon-position"))

1
layouts/shortcodes/notice.html
View file

@ -1,6 +1,7 @@
{{- $_hugo_config := `{ "version": 1 }` }} {{- $_hugo_config := `{ "version": 1 }` }}
{{- partial "shortcodes/notice.html" (dict {{- partial "shortcodes/notice.html" (dict
"context" . "context" .
"color" (.Get "color")
"content" .Inner "content" .Inner
"icon" (.Get "icon" | default (.Get 2)) "icon" (.Get "icon" | default (.Get 2))
"style" (.Get "style" | default (.Get 0)) "style" (.Get "style" | default (.Get 0))