From 91c405b90d15677f62a5894e65e8d77f0cabb555 Mon Sep 17 00:00:00 2001
From: Zachary Betz <zwbetz@gmail.com>
Date: Tue, 26 Feb 2019 21:33:06 -0600
Subject: Add card shortcode

---
 exampleSite/content/post/papercss-shortcodes.md    | 229 -------------------
 .../content/post/papercss-shortcodes/index.md      | 243 +++++++++++++++++++++
 .../content/post/papercss-shortcodes/sun.jpg       | Bin 0 -> 3118921 bytes
 layouts/shortcodes/card.html                       |  35 +++
 4 files changed, 278 insertions(+), 229 deletions(-)
 delete mode 100644 exampleSite/content/post/papercss-shortcodes.md
 create mode 100644 exampleSite/content/post/papercss-shortcodes/index.md
 create mode 100644 exampleSite/content/post/papercss-shortcodes/sun.jpg
 create mode 100644 layouts/shortcodes/card.html

diff --git a/exampleSite/content/post/papercss-shortcodes.md b/exampleSite/content/post/papercss-shortcodes.md
deleted file mode 100644
index 2cc5885..0000000
--- a/exampleSite/content/post/papercss-shortcodes.md
+++ /dev/null
@@ -1,229 +0,0 @@
----
-title: "Papercss Shortcodes"
-date: 2019-02-26T13:50:01-06:00
-tags: [shortcodes]
----
-
-## border
-
-```
-{{</* border */>}}
-Regular
-{{</* /border */>}}
-
-{{</* border "dashed" */>}}
-Dashed
-{{</* /border */>}}
-
-{{</* border "dotted" */>}}
-Dotted
-{{</* /border */>}}
-
-{{</* border "dashed thick" */>}}
-Dashed Thick
-{{</* /border */>}}
-
-{{</* border "dotted thick" */>}}
-Dotted Thick
-{{</* /border */>}}
-```
-
-{{< border >}}
-Regular
-{{< /border >}}
-
-{{< border "dashed" >}}
-Dashed
-{{< /border >}}
-
-{{< border "dotted" >}}
-Dotted
-{{< /border >}}
-
-{{< border "dashed thick" >}}
-Dashed Thick
-{{< /border >}}
-
-{{< border "dotted thick" >}}
-Dotted Thick
-{{< /border >}}
-
-## color
-
-```
-{{</* color "primary" */>}}
-Text primary
-{{</* /color */>}}
-
-{{</* color "secondary" */>}}
-Text secondary
-{{</* /color */>}}
-
-{{</* color "success" */>}}
-Text success
-{{</* /color */>}}
-
-{{</* color "warning" */>}}
-Text warning
-{{</* /color */>}}
-
-{{</* color "danger" */>}}
-Text danger
-{{</* /color */>}}
-
-{{</* color "muted" */>}}
-Text muted
-{{</* /color */>}}
-```
-
-{{< color "primary" >}}
-Text primary
-{{< /color >}}
-
-{{< color "secondary" >}}
-Text secondary
-{{< /color >}}
-
-{{< color "success" >}}
-Text success
-{{< /color >}}
-
-{{< color "warning" >}}
-Text warning
-{{< /color >}}
-
-{{< color "danger" >}}
-Text danger
-{{< /color >}}
-
-{{< color "muted" >}}
-Text muted
-{{< /color >}}
-
-## background
-
-```
-{{</* background "primary" */>}}
-Background primary
-{{</* /background */>}}
-
-{{</* background "secondary" */>}}
-Background secondary
-{{</* /background */>}}
-
-{{</* background "success" */>}}
-Background success
-{{</* /background */>}}
-
-{{</* background "warning" */>}}
-Background warning
-{{</* /background */>}}
-
-{{</* background "danger" */>}}
-Background danger
-{{</* /background */>}}
-```
-
-{{< background "primary" >}}
-Background primary
-{{< /background >}}
-
-{{< background "secondary" >}}
-Background secondary
-{{< /background >}}
-
-{{< background "success" >}}
-Background success
-{{< /background >}}
-
-{{< background "warning" >}}
-Background warning
-{{< /background >}}
-
-{{< background "danger" >}}
-Background danger
-{{< /background >}}
-
-## alert
-
-```
-{{</* alert "primary" */>}}
-Alert-primary
-{{</* /alert */>}}
-
-{{</* alert "secondary" */>}}
-Alert-secondary
-{{</* /alert */>}}
-
-{{</* alert "success" */>}}
-Alert-success
-{{</* /alert */>}}
-
-{{</* alert "warning" */>}}
-Alert-warning
-{{</* /alert */>}}
-
-{{</* alert "danger" */>}}
-Alert-danger
-{{</* /alert */>}}
-```
-
-{{< alert "primary" >}}
-Alert-primary
-{{< /alert >}}
-
-{{< alert "secondary" >}}
-Alert-secondary
-{{< /alert >}}
-
-{{< alert "success" >}}
-Alert-success
-{{< /alert >}}
-
-{{< alert "warning" >}}
-Alert-warning
-{{< /alert >}}
-
-{{< alert "danger" >}}
-Alert-danger
-{{< /alert >}}
-
-## badge
-
-```
-<h3>Example badge {{</* badge */>}}123{{</* /badge */>}}</h3>
-
-<h3>Example badge {{</* badge "secondary" */>}}123{{</* /badge */>}}</h3>
-
-<h3>Example badge {{</* badge "success" */>}}123{{</* /badge */>}}</h3>
-
-<h3>Example badge {{</* badge "warning" */>}}123{{</* /badge */>}}</h3>
-
-<h3>Example badge {{</* badge "danger" */>}}123{{</* /badge */>}}</h3>
-```
-
-<h3>Example badge {{< badge >}}123{{< /badge >}}</h3>
-
-<h3>Example badge {{< badge "secondary" >}}123{{< /badge >}}</h3>
-
-<h3>Example badge {{< badge "success" >}}123{{< /badge >}}</h3>
-
-<h3>Example badge {{< badge "warning" >}}123{{< /badge >}}</h3>
-
-<h3>Example badge {{< badge "danger" >}}123{{< /badge >}}</h3>
-
-## card
-
-```
-TODO
-```
-
-<div class="card row flex-center" style="width: 20rem;">
-  <img src="https://picsum.photos/768" alt="Card example image">
-
-  <div class="card-body">
-    <h4 class="card-title">My awesome Paper card!</h4>
-    <h5 class="card-subtitle">Nice looking subtitle.</h5>
-    <p class="card-text">Notice that the card width in this example have been set to 20rem, otherwise it will try to fill the current container/row where the card is.</p>
-  </div>
-</div>
diff --git a/exampleSite/content/post/papercss-shortcodes/index.md b/exampleSite/content/post/papercss-shortcodes/index.md
new file mode 100644
index 0000000..a61fe7d
--- /dev/null
+++ b/exampleSite/content/post/papercss-shortcodes/index.md
@@ -0,0 +1,243 @@
+---
+title: "Papercss Shortcodes"
+date: 2019-02-26T13:50:01-06:00
+tags: [shortcodes]
+---
+
+## border
+
+```
+{{</* border */>}}
+Regular
+{{</* /border */>}}
+
+{{</* border "dashed" */>}}
+Dashed
+{{</* /border */>}}
+
+{{</* border "dotted" */>}}
+Dotted
+{{</* /border */>}}
+
+{{</* border "dashed thick" */>}}
+Dashed Thick
+{{</* /border */>}}
+
+{{</* border "dotted thick" */>}}
+Dotted Thick
+{{</* /border */>}}
+```
+
+{{< border >}}
+Regular
+{{< /border >}}
+
+{{< border "dashed" >}}
+Dashed
+{{< /border >}}
+
+{{< border "dotted" >}}
+Dotted
+{{< /border >}}
+
+{{< border "dashed thick" >}}
+Dashed Thick
+{{< /border >}}
+
+{{< border "dotted thick" >}}
+Dotted Thick
+{{< /border >}}
+
+## color
+
+```
+{{</* color "primary" */>}}
+Text primary
+{{</* /color */>}}
+
+{{</* color "secondary" */>}}
+Text secondary
+{{</* /color */>}}
+
+{{</* color "success" */>}}
+Text success
+{{</* /color */>}}
+
+{{</* color "warning" */>}}
+Text warning
+{{</* /color */>}}
+
+{{</* color "danger" */>}}
+Text danger
+{{</* /color */>}}
+
+{{</* color "muted" */>}}
+Text muted
+{{</* /color */>}}
+```
+
+{{< color "primary" >}}
+Text primary
+{{< /color >}}
+
+{{< color "secondary" >}}
+Text secondary
+{{< /color >}}
+
+{{< color "success" >}}
+Text success
+{{< /color >}}
+
+{{< color "warning" >}}
+Text warning
+{{< /color >}}
+
+{{< color "danger" >}}
+Text danger
+{{< /color >}}
+
+{{< color "muted" >}}
+Text muted
+{{< /color >}}
+
+## background
+
+```
+{{</* background "primary" */>}}
+Background primary
+{{</* /background */>}}
+
+{{</* background "secondary" */>}}
+Background secondary
+{{</* /background */>}}
+
+{{</* background "success" */>}}
+Background success
+{{</* /background */>}}
+
+{{</* background "warning" */>}}
+Background warning
+{{</* /background */>}}
+
+{{</* background "danger" */>}}
+Background danger
+{{</* /background */>}}
+```
+
+{{< background "primary" >}}
+Background primary
+{{< /background >}}
+
+{{< background "secondary" >}}
+Background secondary
+{{< /background >}}
+
+{{< background "success" >}}
+Background success
+{{< /background >}}
+
+{{< background "warning" >}}
+Background warning
+{{< /background >}}
+
+{{< background "danger" >}}
+Background danger
+{{< /background >}}
+
+## alert
+
+```
+{{</* alert "primary" */>}}
+Alert-primary
+{{</* /alert */>}}
+
+{{</* alert "secondary" */>}}
+Alert-secondary
+{{</* /alert */>}}
+
+{{</* alert "success" */>}}
+Alert-success
+{{</* /alert */>}}
+
+{{</* alert "warning" */>}}
+Alert-warning
+{{</* /alert */>}}
+
+{{</* alert "danger" */>}}
+Alert-danger
+{{</* /alert */>}}
+```
+
+{{< alert "primary" >}}
+Alert-primary
+{{< /alert >}}
+
+{{< alert "secondary" >}}
+Alert-secondary
+{{< /alert >}}
+
+{{< alert "success" >}}
+Alert-success
+{{< /alert >}}
+
+{{< alert "warning" >}}
+Alert-warning
+{{< /alert >}}
+
+{{< alert "danger" >}}
+Alert-danger
+{{< /alert >}}
+
+## badge
+
+```
+<h3>Example badge {{</* badge */>}}123{{</* /badge */>}}</h3>
+
+<h3>Example badge {{</* badge "secondary" */>}}123{{</* /badge */>}}</h3>
+
+<h3>Example badge {{</* badge "success" */>}}123{{</* /badge */>}}</h3>
+
+<h3>Example badge {{</* badge "warning" */>}}123{{</* /badge */>}}</h3>
+
+<h3>Example badge {{</* badge "danger" */>}}123{{</* /badge */>}}</h3>
+```
+
+<h3>Example badge {{< badge >}}123{{< /badge >}}</h3>
+
+<h3>Example badge {{< badge "secondary" >}}123{{< /badge >}}</h3>
+
+<h3>Example badge {{< badge "success" >}}123{{< /badge >}}</h3>
+
+<h3>Example badge {{< badge "warning" >}}123{{< /badge >}}</h3>
+
+<h3>Example badge {{< badge "danger" >}}123{{< /badge >}}</h3>
+
+## card
+
+The `img` param accepts an [image page resource](https://gohugo.io/content-management/page-resources/) name. 
+
+The `command` and `options` params accept [image processing](https://gohugo.io/content-management/image-processing/#readout) args. 
+
+Required params: `img`, `command`, `options`.
+
+Optional params: `title`, `subtitle`, `text`.
+
+```
+{{</* card
+img="sun.jpg"
+command="Resize"
+options="900x"
+title="The Sun"
+subtitle="It's the Sun, dude"
+text="The Sun is the star at the center of the Solar System. It is a nearly perfect sphere of hot plasma, with internal convective motion that generates a magnetic field via a dynamo process. It is by far the most important source of energy for life on Earth. [Credits](https://images.nasa.gov/details-GSFC_20171208_Archive_e000393.html)." */>}}
+```
+
+
+
+{{< card
+img="sun.jpg"
+command="Resize"
+options="900x"
+title="The Sun"
+subtitle="It's the Sun, dude"
+text="The Sun is the star at the center of the Solar System. It is a nearly perfect sphere of hot plasma, with internal convective motion that generates a magnetic field via a dynamo process. It is by far the most important source of energy for life on Earth. [Credits](https://images.nasa.gov/details-GSFC_20171208_Archive_e000393.html)." >}}
diff --git a/exampleSite/content/post/papercss-shortcodes/sun.jpg b/exampleSite/content/post/papercss-shortcodes/sun.jpg
new file mode 100644
index 0000000..0faeb53
Binary files /dev/null and b/exampleSite/content/post/papercss-shortcodes/sun.jpg differ
diff --git a/layouts/shortcodes/card.html b/layouts/shortcodes/card.html
new file mode 100644
index 0000000..42a9fbb
--- /dev/null
+++ b/layouts/shortcodes/card.html
@@ -0,0 +1,35 @@
+{{ $img := .Get "img" }}
+{{ $command := .Get "command" }}
+{{ $options := .Get "options" }}
+
+{{ $original := .Page.Resources.GetMatch (printf "*%s*" $img) }}
+{{ $new := "" }}
+
+{{ if eq $command "Fit" }}
+  {{ $new = $original.Fit $options }}
+{{ else if eq $command "Fill" }}
+  {{ $new = $original.Fill $options }}
+{{ else if eq $command "Resize" }}
+  {{ $new = $original.Resize $options }}
+{{ else if eq $command "Original" }}
+  {{ $new = $original }}
+{{ else }}
+  {{ errorf "Invalid image processing command: Must be one of Fit, Fill, Resize, Original." }}
+{{ end }}
+
+<div class="card row flex-center" style="">
+  <a href="{{ $original.Permalink }}" class="img-link">
+    <img src="{{ $new.Permalink }}">
+  </a>
+  <div class="card-body">
+  {{ with (.Get "title" )}}
+    <h4 class="card-title">{{ . | markdownify }}</h4>
+  {{ end }}
+  {{ with (.Get "subtitle" )}}
+    <h5 class="card-subtitle">{{ . | markdownify }}</h5>
+  {{ end }}
+  {{ with (.Get "text") }}
+    <p class="card-text">{{ . | markdownify }}</p>
+  {{ end }}
+  </div>
+</div>
\ No newline at end of file
-- 
cgit v1.2.3