Separate gallery and figure shortcodes

This commit is contained in:
Will Faught
2023-03-01 19:01:38 -08:00
parent 7c13b69784
commit 34d39540a1
4 changed files with 107 additions and 76 deletions

View File

@@ -1,7 +1,6 @@
{{ $params := . }}
{{ $caption := $params.caption | markdownify }}
{{ $compact := $params.compact }}
{{ $content := $params.content | markdownify }}
{{ $float := $params.float }}
{{ $gap := $params.gap }}
@@ -17,7 +16,7 @@
{{ $table := false }}
{{ $widths := slice }}
{{ if and $caption (or $compact $float) }}
{{ if and $caption $float }}
{{ $table = true }}
{{ end }}
@@ -54,7 +53,7 @@
{{ end }}
{{ end }}
<div class="align-items-{{ $vertical }} d-flex {{ with $float }} float-{{ . }} {{ end }} justify-content-{{ $horizontal }} {{ if $compact }} mb-0 {{ else }} mb-3 {{ end }} {{ with $sidemargin }} {{ . }} {{ end }} overflow-auto paige-figure {{ if $numbered }} paige-figure-numbered {{ end }}">
<div class="align-items-{{ $vertical }} d-flex {{ with $float }} float-{{ . }} {{ end }} justify-content-{{ $horizontal }} {{ with $sidemargin }} {{ . }} {{ end }} overflow-auto paige-figure {{ if $numbered }} paige-figure-numbered {{ end }}">
<figure class="{{ if $table }} d-table {{ end }} mb-0" {{ with $widths }} style="{{ . | safeCSS }}" {{ end }}>
<div class="d-flex justify-content-{{ $horizontal }} text-{{ $horizontal }}">{{ $content }}</div>

View File

@@ -39,6 +39,10 @@ body, html {
margin-bottom: 0;
}
.paige-figure {
margin-bottom: 1rem;
}
.paige-figure .highlight .chroma pre, .paige-figure .highlight pre.chroma {
margin-bottom: 0;
}
@@ -47,6 +51,14 @@ body, html {
margin-bottom: 0;
}
.paige-gallery {
margin-bottom: 1rem;
}
.paige-gallery .paige-figure {
margin-bottom: 0;
}
.paige-gallery .paige-image {
margin-bottom: 0;
}

View File

@@ -1,48 +1,33 @@
{{ $align := .Get "align" | default "center" }}
{{ $caption := .Get "caption" }}
{{ $height := .Get "height" }}
{{ $images := .Get 0 | default (.Get "images") }}
{{ $justify := .Get "justify" | default "center" }}
{{ $maxwidth := .Get "maxwidth" }}
{{ $method := .Get "method" | default "resize" }}
{{ $number := .Get "number" }}
{{ $numbered := .Get "numbered" }}
{{ $options := .Get "options" | default "550x webp picture Lanczos" }}
{{ $type := .Get "type" | default "rows" }}
{{ $width := .Get "width" }}
{{ $inner := chomp .Inner }}
{{ $resources := slice }}
{{ $showcaption := $caption }}
{{ with $images }}
{{ with $.Page.Resources.Match . }}
{{ $resources = . }}
{{ if not $inner }}
{{ with $images }}
{{ with $.Page.Resources.Match . }}
{{ $resources = . }}
{{ else }}
{{ $resources = resources.Match . }}
{{ end }}
{{ else }}
{{ $resources = resources.Match . }}
{{ end }}
{{ else }}
{{ with .Page.Resources.ByType "image" }}
{{ $resources = . }}
{{ else }}
{{ $resources = resources.ByType "image" }}
{{ with .Page.Resources.ByType "image" }}
{{ $resources = . }}
{{ else }}
{{ $resources = resources.ByType "image" }}
{{ end }}
{{ end }}
{{ end }}
{{ if $caption }}
{{ if $number }}
{{ $caption = printf "%v %v: %v" (i18n "paige_figure") $number $caption }}
{{ end }}
{{ else }}
{{ if $number }}
{{ $caption = printf "%v %v" (i18n "paige_figure") $number }}
{{ $showcaption = true }}
{{ else if $numbered }}
{{ $showcaption = true }}
{{ end }}
{{ end }}
<figure class="paige-gallery">
<div class="paige-gallery">
{{ if eq $type "grid" }}
<div class="container-fluid px-0">
<div class="align-items-{{ $align }} gx-3 gy-3 justify-content-{{ $justify }} row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 row-cols-xl-5 row-cols-xxl-6">
@@ -92,7 +77,4 @@
{{ else }}
{{ errorf "invalid type: %q" $type }}
{{ end }}
{{ if $showcaption }}
<figcaption class="figure-caption mt-2 text-center">{{ $caption }}</figcaption>
{{ end }}
</figure>
</div>