feat: add the article-cards shortcode

config.toml

@@ -3,3 +3,6 @@ min = "0.110.0"
 
 [[module.imports]]
 path = "github.com/hugomods/icons/vendors/bootstrap"
+
+[[module.imports]]
+path = "github.com/hugomods/images"

go.mod

@@ -2,4 +2,7 @@ module github.com/hugomods/bootstrap
 
 go 1.19
 
-require github.com/hugomods/icons/vendors/bootstrap v0.5.0 // indirect
+require (
+	github.com/hugomods/icons/vendors/bootstrap v0.5.0 // indirect
+	github.com/hugomods/images v0.7.0 // indirect
+)

go.sum

@@ -1,5 +1,5 @@
 github.com/hugomods/icons v0.6.0 h1:G6RU93okhPPRDh/jqcew9gwkcYpSpg0rCBv4S6yUAFw=
-github.com/hugomods/icons/vendors/bootstrap v0.4.0 h1:+2r0aWG/qdsdLBtQ+b5VN7z3Kh/M0/TduF9ZxW0d9Kg=
-github.com/hugomods/icons/vendors/bootstrap v0.4.0/go.mod h1:my/xxEyTvWAym67NVfhWRvdQKrHcscU43neIBXnlbfM=
-github.com/hugomods/icons/vendors/bootstrap v0.4.1/go.mod h1:3fXUsXdGZa+f31OEKUMDGsrCq1XZwhLvUys8XT63AZM=
+github.com/hugomods/icons/vendors/bootstrap v0.5.0 h1:CHEGk677heq2kJZa7XsGHRc3Hwizl9NFkmNw146OVm0=
 github.com/hugomods/icons/vendors/bootstrap v0.5.0/go.mod h1:kfC17VWV+tNi6PGF4AY7CJBBa1/HEgWxCYq2kNOdcdI=
+github.com/hugomods/images v0.7.0 h1:NEGgCSrh1YuHGmTAL9wDAKLdXL4WU6Nw4BfkampJxyM=
+github.com/hugomods/images v0.7.0/go.mod h1:U6Gwj16LKvk66rOMyGFrnF6f0aV8lT89lqOsckOAjYY=

i18n/en.toml

@@ -1,2 +1,5 @@
 [learn_more]
 other = "Learn more"
+
+[read_more]
+other = "Read more"

i18n/zh-hans.toml

@@ -1,2 +1,5 @@
 [learn_more]
 other = "了解详情"
+
+[read_more]
+other = "阅读更多"

i18n/zh-hant.toml

@@ -1,2 +1,5 @@
 [learn_more]
 other = "瞭解詳情"
+
+[read_more]
+other = "閱讀更多"

layouts/partials/bootstrap/article-cards.html

@@ -0,0 +1,64 @@
+{{- $summaryLen := 120 }}
+{{- $limit := 12 }}
+{{- $sections := slice }}
+{{- if .IsNamedParams }}
+  {{- with .Get "limit" }}{{ $limit = . }}{{ end }}
+  {{- with .Get "summaryLen" }}{{ $summaryLen = . }}{{ end }}
+  {{- with .Get "sections" }}{{ $sections = split . "," }}{{ end }}
+{{- end }}
+{{- $pages := site.RegularPages }}
+{{- with $sections }}
+  {{- $pages = where $pages "Section" "in" . }}
+{{- end }}
+<div class="row g-3 row-cols-1 row-cols-md-2 row-cols-lg-3 mb-5">
+  {{- range first $limit $pages }}
+    <div class="col">
+      <div class="card shadow h-100 w-100 position-relativ">
+        {{- with .FirstSection }}
+          <a
+            href="{{ .RelPermalink }}"
+            class="z-1 badge text-bg-secondary position-absolute fw-normal top-0 start-0 ms-2 mt-2 text-decoration-none">
+            {{- .Title -}}
+          </a>
+        {{- end }}
+        <span
+          class="z-1 badge text-bg-secondary position-absolute fw-normal top-0 end-0 me-2 mt-2">
+          {{- .Date | time.Format ":date_medium" -}}
+        </span>
+        {{- $img := partial "images/functions/page-thumbnail" (dict
+          "Page" .
+          "ClassName" "card-img-top object-fit-cover bg-secondary-subtle"
+          "LazyLoading" false
+          "Style" (slice "height: 160px;"))
+        }}
+        {{- with $img }}
+          {{ . }}
+        {{- else }}
+          <div
+            class="card-img-top bg-secondary-subtle d-flex justify-content-center align-items-center h4 user-select-none"
+            style="height: 160px; filter: blur(1px);">
+            NO IMAGE
+          </div>
+        {{- end }}
+        <div class="card-body d-flex flex-column p-4 pt-2">
+          <div class="card-title h5">
+            {{- .Title -}}
+          </div>
+          <p class="card-text mb-0">
+            {{ truncate $summaryLen "..." .Summary }}
+          </p>
+          <p class="mt-auto mb-0">
+            <a class="text-decoration-none" href="{{ .RelPermalink }}">
+              {{- i18n "read_more" -}}
+              {{ partial "icons/icon" (dict
+                "vendor" "bootstrap"
+                "name" "arrow-right"
+                "className" "ms-1")
+              }}
+            </a>
+          </p>
+        </div>
+      </div>
+    </div>
+  {{- end }}
+</div>

layouts/shortcodes/bootstrap/article-cards.html

@@ -0,0 +1 @@
+{{ partial "bootstrap/article-cards" . }}

layouts/shortcodes/bs/article-cards.html

@@ -0,0 +1 @@
+{{ partial "bootstrap/article-cards" . }}