style(icon-grid): the card will be clickable if the link text is empty (

#54)
hugomods · Jul 25, 2023 · df48eed · df48eed
1 parent d4e9219
commit df48eed
Showing 1 changed file with 58 additions and 39 deletions.
diff --git a/layouts/partials/bootstrap/icon-grid.html b/layouts/partials/bootstrap/icon-grid.html
@@ -1,8 +1,13 @@
 {{- $key := "" }}
 {{- $linkText := i18n "learn_more" }}
+{{- $linkIcon := partial "icons/icon" (dict
+  "vendor" "bootstrap"
+  "name" "arrow-right"
+  "className" "ms-1")
+}}
 {{- if .IsNamedParams }}
   {{- $key = .Get "data" }}
-  {{- with .Get "linkText" }}{{ $linkText = . }}{{ end }}
+  {{- if isset .Params "linkText" }}{{ $linkText = .Get "linkText" }}{{ end }}
 {{- else }}
   {{- $key = .Get 0 }}
 {{- end }}
@@ -11,46 +16,60 @@
   <div class="row g-4 row-cols-1 row-cols-md-2 row-cols-lg-3 mb-5">
     {{- range sort . "weight" }}
       <div class="col">
-        <div class="d-flex flex-column border rounded h-100 w-100 p-4 shadow">
-          <div class="fw-bold mb-2 fs-4 d-flex align-items-center">
-            {{- with .icon }}
-              {{ partial "icons/icon" (merge (dict
-                "width" "1.25em"
-                "height" "1.25em"
-                "vendor" "bootstrap"
-                "className" "me-3") .)
-              }}
+        {{- $icon := "" }}
+        {{- with .icon }}
+          {{- $icon = partial "icons/icon" (merge (dict
+            "width" "1.25em"
+            "height" "1.25em"
+            "vendor" "bootstrap"
+            "className" "me-3") .)
+          }}
+        {{- end }}
+        {{- $link := "" }}
+        {{- $url := "" }}
+        {{- if .url }}
+          {{- $link = .url }}
+          {{- $url = urls.Parse .url }}
+          {{- if not $url.Scheme }}
+            {{- with site.GetPage .url }}
+              {{- $link = .RelPermalink }}
+            {{- else }}
+              {{- $link = relURL .url }}
             {{- end }}
-            {{- .title -}}
-          </div>
-          <p class="mb-0 text-body-secondary">
-            {{ .description | markdownify }}
-          </p>
-          {{- if .url }}
-            {{- $link := .url }}
-            {{- $url := urls.Parse .url }}
-            {{- if not $url.Scheme }}
-              {{- with site.GetPage .url }}
-                {{- $link = .RelPermalink }}
-              {{- else }}
-                {{- $link = relURL .url }}
-              {{- end }}
-            {{- end }}
-            <p class="mt-auto pt-3 mb-0">
-              <a
-                class="text-decoration-none"
-                href="{{ $link }}"
-                {{ if $url.Scheme }}target="_blank" rel="external"{{ end }}>
-                {{- $linkText -}}
-                {{ partial "icons/icon" (dict
-                  "vendor" "bootstrap"
-                  "name" "arrow-right"
-                  "className" "ms-1")
-                }}
-              </a>
-            </p>
           {{- end }}
-        </div>
+        {{- end }}
+        {{- if and $link (eq $linkText "") }}
+          <a
+            class="d-flex flex-column border rounded h-100 w-100 p-4 shadow text-decoration-none"
+            href="{{ $link }}"
+            {{ if $url.Scheme }}target="_blank" rel="external"{{ end }}>
+            <div class="fw-bold mb-2 fs-4 d-flex align-items-center">
+              {{- $icon -}}{{- .title -}}
+            </div>
+            <p class="mb-0 text-body-secondary">
+              {{ .description | markdownify }}
+            </p>
+          </a>
+        {{ else }}
+          <div class="d-flex flex-column border rounded h-100 w-100 p-4 shadow">
+            <div class="fw-bold mb-2 fs-4 d-flex align-items-center">
+              {{- $icon -}}{{- .title -}}
+            </div>
+            <p class="mb-0 text-body-secondary">
+              {{ .description | markdownify }}
+            </p>
+            {{- with $link }}
+              <p class="mt-auto pt-3 mb-0">
+                <a
+                  class="text-decoration-none"
+                  href="{{ . }}"
+                  {{ if $url.Scheme }}target="_blank" rel="external"{{ end }}>
+                  {{- $linkText -}}{{- $linkIcon -}}
+                </a>
+              </p>
+            {{- end }}
+          </div>
+        {{- end }}
       </div>
     {{- end }}
   </div>