Callouts: Fixed partially styled call-outs

Author: lamATnginx

exampleSite/_banners/test-product-intro.md

@@ -0,0 +1,6 @@
+{{<banner "caution" "Under development">}}
+  <br>
+  This product on our example site is under development and changes are being added frequently. 
+  <br>
+  Please reach out to <strong>#friends-of-the-docs</strong> on Slack to ask questions.
+{{</banner>}}

exampleSite/content/test-product/_index.md

@@ -3,6 +3,11 @@ description: Test pages for nginx-hugo-theme
 title: Test pages
 weight: 100
 nd-landing-page: true
+cascade:
+  nd-banner:
+    enabled: true
+    start-date: 2025-01-01
+    md: /_banners/test-product-intro.md
 ---
 {{<card-layout>}}
   {{<card-section showAsCards="true">}}

layouts/partials/callout.html

@@ -34,31 +34,30 @@
 
 
 {{/*  Render a different block, if "loud" callouts are used  */}}
+{{ $type := (index (split $class " ") 0) | strings.FirstUpper }}
 {{ $specialTitles := slice "Caution" "Warning" "Deprecated" "Important" }}
 {{ $specialTitleIcons := dict
   "Caution"    "alert-triangle"
   "Warning"    "alert-octagon"
   "Deprecated" "alert-octagon"
   "Important"  "arrow-right-circle"
 }}
-{{ $icon := index $specialTitleIcons $title | default "" }}
+{{ $icon := index $specialTitleIcons $type | default "" }}
 
-{{ $isSpecialTitle := in $specialTitles $title }}
+{{ $isSpecialTitle := in $specialTitles $type }}
 {{ if $isSpecialTitle }}
-  {{/*  Loud callouts  */}}
+{{/*  Loud callouts  */}}
+<blockquote class="{{ $class }}" data-mf="true" style="display: none;">
   <div>
-  <blockquote class="{{ $class }}" data-mf="true" style="display: none;">
-    <div>
-      <div class="call-out-type">
-        {{ partial "feather" (dict "context" . "icon" $icon) .}}
-       {{ $title }}
-      </div>
-      <div class="callout-content">
-        {{ .content | markdownify }}
-      </div>
+    <div class="call-out-type">
+      {{ partial "feather" (dict "context" . "icon" $icon) .}}
+      {{ $title }}
     </div>
-  </blockquote>
-</div>
+    <div class="callout-content">
+      {{ .content | markdownify }}
+    </div>
+  </div>
+</blockquote>
 
 {{ else }}
 

layouts/shortcodes/banner.html

@@ -1,9 +1,10 @@
 {{- $type := .Get 0 | default (.Get "type") | default "" -}}
 {{- $title := .Get 1 | default (.Get "title") | default "" -}}
 {{ partial "callout.html" (dict
-    "class" $type
+    "class" (printf "%s %s" $type "call-out")
     "title" $title
     "icon"  "fa-solid fa-triangle-exclamation"
     "inline" true
+    "type" ($type | strings.FirstUpper)
     "content" .Inner
 ) }}

layouts/shortcodes/call-out.html

@@ -25,21 +25,10 @@
   {{ warnf "The '<call-out>' Shortcode parameter 'inline' must be 'true' or 'false', but got: '%s'. This will now default to 'false'" $inlineParam}}
 {{ end }}
 
-{{ $inline := eq $inlineParam "true" }}
-
-{{ $sideOption := "side-callout" }}
-{{ $inlineOption := "inline-callout" }}
-
-{{ if $inline }}
-  {{ $class = printf "%s %s" $class $inlineOption }}
-{{ else }}
-  {{ $class = printf "%s %s" $class $sideOption }}
-{{ end }}
-
 {{ partial "callout.html" (dict
-    "class" $class
+    "class" (printf "%s %s" $class "call-out")
     "title" $title
     "icon"  $icon
-    "inline" $inline
+    "inline" $inlineParam
     "content" .Inner
 ) }}