Rockingcool/paige-hugo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add justify param

Browse Source
This commit is contained in:
Will Faught
2023-01-16 21:56:16 -08:00
parent f694597cfa
commit 7d418a96fe
7 changed files with 25 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
README.md
View File

@@ -511,7 +511,7 @@ title: Search
The `paige/figure` shortcode provides a figure with centered content.
```
{{< paige/figure align="center" caption="My caption" float="left" >}}
{{< paige/figure align="center" caption="My caption" float="left" justify="center" >}}
My content
{{< /paige/figure >}}
```
@@ -527,6 +527,8 @@ Parameters:
<dd>Optional. Position 0. String. Markdown. Descriptive text that appears centered below the content.</dd>
<dt><code>float</code></dt>
<dd>Optional. String. Float to one side of its container. Must be <code>start</code> or <code>end</code>.</dd>
<dt><code>justify</code></dt>
<dd>Optional. String. Vertical spacing of the figure and caption. Must be <code>start</code>, <code>center</code>, or <code>end</code>. Default is <code>center</code>.</dd>
</dl>
### Quote
@@ -534,7 +536,7 @@ Parameters:
The `paige/quote` shortcode provides a figure with a centered quotation.
```
{{< paige/quote align="center" caption="My caption" cite="My citation" float="left" >}}
{{< paige/quote align="center" caption="My caption" cite="My citation" float="left" justify="center" >}}
My content
{{< /paige/quote >}}
```
@@ -552,6 +554,8 @@ Parameters:
<dd>Optional. Position 0. String. Markdown. Citation text that appears centered below the quotation. Must not be used with <code>caption</code>.</dd>
<dt><code>float</code></dt>
<dd>Optional. String. Float to one side of its container. Must be <code>start</code> or <code>end</code>.</dd>
<dt><code>justify</code></dt>
<dd>Optional. String. Vertical spacing of the figure and caption. Must be <code>start</code>, <code>center</code>, or <code>end</code>. Default is <code>center</code>.</dd>
</dl>
### Code
@@ -559,7 +563,7 @@ Parameters:
The `paige/code` shortcode provides a figure with centered code.
```
{{< paige/code align="center" caption="My caption" float="left" lang="html" options="linenos=true" >}}
{{< paige/code align="center" caption="My caption" float="left" justify="center" lang="html" options="linenos=true" >}}
<!doctype html>
<html lang="en">
<body>
@@ -580,6 +584,8 @@ Parameters:
<dd>Optional. String. Markdown. Descriptive text that appears centered below the code.</dd>
<dt><code>float</code></dt>
<dd>Optional. String. Float to one side of its container. Must be <code>start</code> or <code>end</code>.</dd>
<dt><code>justify</code></dt>
<dd>Optional. String. Vertical spacing of the figure and caption. Must be <code>start</code>, <code>center</code>, or <code>end</code>. Default is <code>center</code>.</dd>
<dt><code>lang</code></dt>
<dd>Optional. Position 0. String. Chroma language code. Defaults to <code>plaintext</code>. See <a href="https://gohugo.io/content-management/syntax-highlighting/#list-of-chroma-highlighting-languages">available codes</a>.</dd>
<dt><code>options</code></dt>
@@ -597,6 +603,7 @@ The `paige/image` shortcode provides a figure with a centered image.
caption="My caption"
float="left"
height="10rem"
justify="center"
link="https://github.com/willfaught/paige"
maxheight="10rem"
maxwidth="10rem"
@@ -621,6 +628,8 @@ Parameters:
<dd>Optional. String. Float to one side of its container. Must be <code>start</code> or <code>end</code>.</dd>
<dt><code>height</code></dt>
<dd>Optional. String. Image height.</dd>
<dt><code>justify</code></dt>
<dd>Optional. String. Vertical spacing of the figure and caption. Must be <code>start</code>, <code>center</code>, or <code>end</code>. Default is <code>center</code>.</dd>
<dt><code>link</code></dt>
<dd>Optional. String. URL. Image link.</dd>
<dt><code>maxheight</code></dt>

4
exampleSite/content/blog/figure-shortcode.md
View File

@@ -57,7 +57,7 @@ Michael was having brunch with Sally Sitwell at a restaurant called Skip Church'
Code:
```go-text-template
{{</* paige/figure caption="Michael was having brunch with Sally Sitwell" float="end" */>}}
{{</* paige/figure caption="Michael was having brunch with Sally Sitwell at a restaurant called Skip Church's Bistro." width="20%" height="15rem" float="end" justify="center" */>}}
Michael was having brunch
{{</* /paige/figure */>}}
@@ -66,7 +66,7 @@ Michael was having brunch with Sally Sitwell at a restaurant called Skip Church'
Result:
{{< paige/figure caption="Michael was having brunch with Sally Sitwell at a restaurant called Skip Church's Bistro." width="20%" height="15rem" float="end" >}}
{{< paige/figure caption="Michael was having brunch with Sally Sitwell at a restaurant called Skip Church's Bistro." width="20%" height="15rem" float="end" justify="center" >}}
Michael was having brunch with Sally Sitwell
{{< /paige/figure >}}

5
layouts/partials/paige/figure.html
View File

@@ -5,6 +5,7 @@
{{ $float := .float }}
{{ $gap := .gap }}
{{ $height := .height }}
{{ $justify := .justify | default "center" }}
{{ $maxheight := .maxheight }}
{{ $maxwidth := .maxwidth }}
{{ $width := .width }}
@@ -69,9 +70,9 @@
{{ end }}
{{ end }}
<figure class="align-items-{{ $align }} d-flex flex-column {{ with $float }} float-{{ . }} {{ end }} justify-content-center {{ if $compact }} mb-0 {{ end }} {{ if $float }} {{ $sidemargin }} {{ end }} paige-figure" {{ if and $float $style }} style="{{ $style | safeCSS }}" {{ end }}>
<figure class="align-items-{{ $align }} d-flex flex-column {{ with $float }} float-{{ . }} {{ end }} justify-content-{{ $justify }} {{ if $compact }} mb-0 {{ end }} {{ if $float }} {{ $sidemargin }} {{ end }} paige-figure" {{ if and $float $style }} style="{{ $style | safeCSS }}" {{ end }}>
{{ if and (not $float) $style }}
<div class="align-items-{{ $align }} d-flex flex-column {{ if $height }} h-100 {{ end }} justify-content-center" style="{{ $style | safeCSS }}">
<div class="align-items-{{ $align }} d-flex flex-column {{ if $height }} h-100 {{ end }} justify-content-{{ $justify }}" style="{{ $style | safeCSS }}">
{{ end }}
{{ if $table }}
<div class="d-table">

2
layouts/shortcodes/paige/code.html
View File

@@ -2,6 +2,7 @@
{{ $caption := .Get "caption" }}
{{ $float := .Get "float" }}
{{ $height := .Get "height" }}
{{ $justify := .Get "justify" }}
{{ $lang := .Get 0 | default (.Get "lang") | default "plaintext" }}
{{ $maxheight := .Get "maxheight" }}
{{ $maxwidth := .Get "maxwidth" }}
@@ -17,6 +18,7 @@
"float" $float
"gap" 2
"height" $height
"justify" $justify
"maxheight" $maxheight
"maxwidth" $maxwidth
"width" $width

2
layouts/shortcodes/paige/figure.html
View File

@@ -3,6 +3,7 @@
{{ $content := .Inner | markdownify }}
{{ $float := .Get "float" }}
{{ $height := .Get "height" }}
{{ $justify := .Get "justify" }}
{{ $maxheight := .Get "maxheight" }}
{{ $maxwidth := .Get "maxwidth" }}
{{ $width := .Get "width" }}
@@ -14,6 +15,7 @@
"float" $float
"gap" 2
"height" $height
"justify" $justify
"maxheight" $maxheight
"maxwidth" $maxwidth
"width" $width

2
layouts/shortcodes/paige/image.html
View File

@@ -3,6 +3,7 @@
{{ $caption := .Get "caption" }}
{{ $float := .Get "float" }}
{{ $height := .Get "height" }}
{{ $justify := .Get "justify" }}
{{ $link := .Get "link" }}
{{ $maxheight := .Get "maxheight" }}
{{ $maxwidth := .Get "maxwidth" }}
@@ -20,6 +21,7 @@
"float" $float
"gap" 2
"height" $height
"justify" $justify
"link" $link
"maxheight" $maxheight
"maxwidth" $maxwidth

2
layouts/shortcodes/paige/quote.html
View File

@@ -3,6 +3,7 @@
{{ $content := .Inner | markdownify }}
{{ $float := .Get "float" }}
{{ $height := .Get "height" }}
{{ $justify := .Get "justify" }}
{{ $maxheight := .Get "maxheight" }}
{{ $maxwidth := .Get "maxwidth" }}
{{ $width := .Get "width" }}
@@ -15,6 +16,7 @@
"content" $content
"float" $float
"height" $height
"justify" $justify
"maxheight" $maxheight
"maxwidth" $maxwidth
"width" $width