Landing: Added extra doc to exampleSite

Author: lamATnginx

exampleSite/content/test-product/_index.md

@@ -4,10 +4,13 @@ title: Test pages
 weight: 100
 hasCustomContent: true
 ---
+<!-- <card-layout> - Available params: title (required: string)-->
 {{< card-layout >}}
+  <!-- <card-section> - Available params: title (required: string), showAsCards (optional: boolean, default false) -->
   <!-- If there is no "title" for <card-section>, it is implied it is the main content section and not a new content section -->
   {{< card-section >}}
     {{< card title="Call Out usages" >}}
+      <!-- <card> - Available params: title (required: string), titleUrl (optional: string, relative path or absolute URL (e.g. https://google.com)) -->
       Examples for call-out shortcode
     {{</ card >}}
     {{< card title="Code Block usages" >}}

layouts/shortcodes/card-section.html

@@ -1,24 +1,24 @@
-{{- /* Handle different versions of booleans */ -}}
-{{ $showAsCards := .Get 0 | default (.Get "showAsCards") | default "false"}}
+{{ $title := .Get "title" }}
+{{ $showAsCards := .Get "showAsCards" | default "false"}}
 {{- /* Validate the parameter strictly */ -}}
 {{ if not (in (slice "true" "false") $showAsCards) }}
   {{ warnf "The '<card-section>' Shortcode parameter 'showAsCards' must be 'true' or 'false', but got: '%s'. This will now default to 'false'" $showAsCards}}
 {{ end }}
 {{- $current := .Page.Scratch.Get "showAsCards" | default (dict) -}}
-{{- $newShowAsCards := dict (.Get "title" | default "main") ($showAsCards) -}}
+{{- $newShowAsCards := dict ($title | default "main") ($showAsCards) -}}
 {{- .Page.Scratch.Set "showAsCards" (merge $current ($newShowAsCards)) -}}
 {{ $class := "card-grid wide"}}
 {{- /* Validate that the parent is card-layout */ -}}
 {{ if eq .Parent.Name "card-layout"}}
   <div class="card-section" data-mf="true" style="display: none;">
-    {{- if .Get "title" -}}
-      <strong class="card-section-title">{{- .Get "title" -}}</strong>
+    {{- if $title -}}
+      <strong class="card-section-title">{{- $title -}}</strong>
       <div class="card-section-content{{ if eq $showAsCards "true" }} {{ $class }} {{ end }}">{{- .Inner -}}</div>    
     {{ end }}
   </div>
   <div class="row" data-mf="false">
-    {{- if .Get "title" -}}
-        <strong class="card-section-title">{{- .Get "title" -}}</strong>
+    {{- if $title -}}
+        <strong class="card-section-title">{{- $title -}}</strong>
         <div class="card-section-content{{ if eq $showAsCards "true" }} {{ $class }} {{ end }} card-deck">{{- .Inner -}}</div>    
     {{ end }}
   </div>

layouts/shortcodes/card.html

@@ -1,29 +1,38 @@
+{{- $title := .Get "title" -}}
+{{- $titleUrl := .Get "titleUrl" | default "/" -}} 
+{{- $icon := .Get "icon" | default "NGINX-product-icon" -}}
 {{- $current := .Page.Scratch.Get "cards" | default (slice) -}}
-{{- $newCard := dict "title" (.Get "title") "content" (.Inner) -}}
+{{- $newCard := dict "title" ($title) "content" (.Inner) -}}
 {{- .Page.Scratch.Set "cards" ($current | append $newCard) -}}
 {{- /* Validate that the parent is card-section */ -}}
-{{ if eq .Parent.Name "card-section"}}
+{{- if eq .Parent.Name "card-section" -}}
   <div class="card-container" style="display: none;" data-mf="true">
-    {{- if .Get "title" -}}
-      {{- if .Get "titleUrl" -}}
-        <h2 class="card-title"><a href="{{- .Get "titleUrl" -}}">{{- .Get "title" -}}</a></h2>
+    {{- if $title -}}
+      {{- if $titleUrl -}}
+        <h2 class="card-title"><a href="{{- $titleUrl -}}">{{- $title -}}</a></h2>
       {{- else -}}
-        <h2 class="card-title">{{- .Get "title" -}}</h2>
+        <h2 class="card-title">{{- $title -}}</h2>
       {{- end -}}
-    {{ end }}
+    {{- else -}}
+      {{ errorf "Mainframe: Missing param 'title'" }}
+    {{- end -}}
     <p>{{- .Inner -}}</p>
   </div>
   <div class="col-md-5 card" data-mf="false">
     <div class="card-body">
       <h3 class="card-title" style="display: flex; align-items: center; gap: 5px;">
-        {{- if .Get "icon" -}}
-          <img class="card-img-top" src="{{ .Site.BaseURL }}/images/icons/{{ .Get "icon" }}.png"/>
+        {{- if $icon -}}
+          <img class="card-img-top" src="{{ .Site.BaseURL }}/images/icons/{{ $icon }}.png"/>
+        {{- end -}}
+        {{- if ($title) -}}
+          <a href="{{- $titleUrl -}}">{{- $title -}}</a>
+        {{- else -}}
+          {{ errorf "Old theme: Missing param 'title'" }}
         {{- end -}}
-        <a href="{{- .Get "titleUrl" -}}">{{- .Get "title" -}}</a>
       </h3>
       <p>{{- .Inner -}}</p>
     </div>
   </div>
-{{ else }}
+{{- else -}}
   {{ errorf "The '<card>' must be nested directly inside the shortcode '<card-section>'. Please see the exampleSite for an example of usage." }}
-{{ end }}
+{{- end -}}