From bd5176c78d9b014544252ce1af1b555ad69e3e3b Mon Sep 17 00:00:00 2001
From: Will Faught <willfaught@users.noreply.github.com>
Date: Fri, 3 Mar 2023 21:07:11 -0800
Subject: [PATCH] Add maxheight, maxwidth params to image

---
 README.md                               |  6 ++++++
 exampleSite/content/shortcodes/image.md | 24 ++++++++++++++++++++++++
 layouts/shortcodes/paige/image.html     |  4 ++++
 3 files changed, 34 insertions(+)

diff --git a/README.md b/README.md
index 82a1ec3d..4fe5a6d6 100644
--- a/README.md
+++ b/README.md
@@ -438,6 +438,8 @@ The `paige/image` shortcode provides a figure with an image.
     alt="My alt" >}}
     height="10rem"
     link="https://github.com/willfaught/paige"
+    maxheight="10rem"
+    maxwidth="10rem"
     method="resize"
     options="550x webp picture Lanczos"
     raw=false
@@ -458,6 +460,10 @@ Parameters:
     <dd>Optional. String. CSS value. Image height.</dd>
     <dt><code>link</code></dt>
     <dd>Optional. String. URL. Image link.</dd>
+    <dt><code>maxheight</code></dt>
+    <dd>Optional. String. CSS value. Image maximum height.</dd>
+    <dt><code>maxwidth</code></dt>
+    <dd>Optional. String. CSS value. Image maximum width.</dd>
     <dt><code>method</code></dt>
     <dd>Optional. String. Hugo image processing method. Must be <code>crop</code>, <code>fill</code>, <code>fit</code>, or <code>resize</code>. Must be specified with <code>options</code>. See the <a href="https://gohugo.io/content-management/image-processing/#image-processing-methods">methods</a>.</dd>
     <dt><code>options</code></dt>
diff --git a/exampleSite/content/shortcodes/image.md b/exampleSite/content/shortcodes/image.md
index e072a6fb..4d32a471 100644
--- a/exampleSite/content/shortcodes/image.md
+++ b/exampleSite/content/shortcodes/image.md
@@ -47,6 +47,30 @@ Result:
 
 {{< paige/image link="https://github.com/willfaught/paige" src="landscape.webp" >}}
 
+## Maxheight parameter
+
+Code:
+
+```go-text-template
+{{</* paige/image maxheight="10rem" src="landscape.webp" */>}}
+```
+
+Result:
+
+{{< paige/image maxheight="10rem" src="landscape.webp" >}}
+
+## Maxwidth parameter
+
+Code:
+
+```go-text-template
+{{</* paige/image maxwidth="10rem" src="landscape.webp" */>}}
+```
+
+Result:
+
+{{< paige/image maxwidth="10rem" src="landscape.webp" >}}
+
 ## Method and options parameters
 
 Code:
diff --git a/layouts/shortcodes/paige/image.html b/layouts/shortcodes/paige/image.html
index 9979ac67..b80a8197 100644
--- a/layouts/shortcodes/paige/image.html
+++ b/layouts/shortcodes/paige/image.html
@@ -1,6 +1,8 @@
 {{ $alt := .Get "alt" }}
 {{ $link := .Get "link" }}
 {{ $height := .Get "height" }}
+{{ $maxheight := .Get "maxheight" }}
+{{ $maxwidth := .Get "maxwidth" }}
 {{ $method := .Get "method" }}
 {{ $options := .Get "options" }}
 {{ $raw := .Get "raw" }}
@@ -12,6 +14,8 @@
     "alt" $alt
     "class" "img-fluid"
     "height" $height
+    "maxheight" $maxheight
+    "maxwidth" $maxwidth
     "method" $method
     "options" $options
     "page" .Page