Merge pull request #1504 from gethinode/develop

Develop

README.md

@@ -15,9 +15,6 @@
     <a href="https://gethinode.com">
         <img src="https://img.shields.io/badge/theme-hinode-blue" alt="Hinode theme">
     </a>
-    <a href="https://www.npmjs.com/package/%40gethinode/hinode">
-        <img src="https://img.shields.io/npm/v/%40gethinode/hinode" alt="npm package">
-    </a>
     <a href="https://app.netlify.com/sites/gethinode-demo/deploys">
         <img src="https://img.shields.io/netlify/0ad42e3e-fdfa-4d37-8e26-58badd429a67"  alt="Netlify Status">
     </a>

component-library/components/articles/articles.bookshop.yml

@@ -27,6 +27,8 @@ blueprint:
   more:
     title:
     link:
+  icon-rounded:
+  icon-style:
   cols:
   padding:
   limit:

component-library/components/articles/articles.hugo.html

@@ -19,6 +19,10 @@
     {{ $error = $args.err }}
 {{ end }}
 
+{{/* Initialize global arguments */}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
+
+{{/* Initialize local variables */}}
 {{ $pages := slice }}
 {{ $result := partial "assets/live-pages.html" (dict 
 	"page"       $args.page
@@ -60,10 +64,14 @@
 	{{ $paginate = false }}
 {{ end }}
 
-<!-- Main code -->
+{{/* Main code */}}
 {{ if not $error }}
 	{{ if or (gt (len $pages) 0) (not $args.hideEmpty) }}
-		{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+		{{- partial "assets/section-title.html" (dict
+			"heading" $args.heading
+			"justify" $args.justify
+			"class" (printf "pb-%d" $padding.y))
+		-}}
 
 		{{ $partial := "assets/card-group.html" }}
 		{{ $params := dict }}
@@ -73,6 +81,7 @@
 			"limit"        $args.limit
 			"cols"         $args.cols
 			"icon-rounded" $args.iconRounded
+			"icon-style"   $args.iconStyle
 			"href"         (cond $moreButton $moreLink "")
 			"href-title"   (cond $moreButton $moreTitle "")
 			"href-force"   (gt $result.total (len $result.pages))
@@ -96,7 +105,6 @@
 				"footer-style" $args.footerStyle
 				"padding"      $args.padding
 				"class"        (or $args.class "border-0")
-				"icon-style"   "fa-2x"
 				"align"        "start"
 				"orientation"  $args.orientation
 				"hook"         "assets/live-card.html"
@@ -107,7 +115,6 @@
 		{{ if gt (len $pages) 0 }}
 			{{ partial $partial $params }}
 		{{ else }}
-			{{- $padding := partial "utilities/GetPadding.html" -}}
 			<p class="pt-{{ $padding.y }}">{{- T "emptyList" }}.</p>
 		{{ end }}
 	{{ end }}

component-library/components/cards/cards.bookshop.yml

@@ -17,6 +17,7 @@ blueprint:
     width:
   cols:
   icon-rounded:
+  icon-style:
   padding:
   background:
     backdrop:
@@ -32,3 +33,4 @@ blueprint:
   class:
   width:
   justify:
+  align:

component-library/components/cards/cards.hugo.html

@@ -21,6 +21,7 @@
 
 {{/* Initialize global arguments */}}
 {{- $breakpoint := partial "utilities/GetBreakpoint.html" -}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
 
 {{/* Initialize local variables */}}
 {{ $list := slice }}
@@ -34,37 +35,46 @@
 	) }}
 {{ end}}
 
+{{/* Main code */}}
 {{ if not $error }}
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
+	{{/* Layout for small screens */}}
 	{{- partial "assets/card-group.html" (dict 
 		"page"         page
 		"list"         $list
-		"class"        (printf "border-0 card-icon-primary d-%s-none %s" $breakpoint.prev $args.class)
+		"class"        (printf "border-0 card-icon-primary %s" (or $args.class ""))
+		"wrapper"      (printf "d-%s-none" $breakpoint.prev)
 		"cols"         $args.cols
 		"gutter"       "4"
 		"padding"      $args.padding
 		"header-style" "none"
 		"footer-style" "none"
 		"icon-rounded" $args.iconRounded
-		"icon-style"   "fa-2x"
-		"align"        "start"
+		"icon-style"   (or $args.iconStyle "fa-2x")
+		"align"        $args.align
 		"orientation"  ($args.orientation | default "horizontal-sm")
 		"hook"         "assets/live-card.html"
 	) -}}
 
+	{{/* Layout for regular screens */}}
 	{{- partial "assets/card-group.html" (dict 
 		"page"         page
 		"list"         $list
-		"class"        (printf "border-0 card-icon-primary d-none d-%s-block %s" $breakpoint.prev $args.class)
+		"class"        (printf "border-0 card-icon-primary %s" (or $args.class ""))
+		"wrapper"      (printf "d-none d-%s-block" $breakpoint.prev)
 		"cols"         $args.cols
 		"gutter"       "4"
 		"padding"      $args.padding
 		"header-style" "none"
 		"footer-style" "none"
 		"icon-rounded" $args.iconRounded
-		"icon-style"   "fa-2x"
-		"align"        "start"
+		"icon-style"   (or $args.iconStyle "fa-2x")
+		"align"        $args.align
 		"orientation"  ($args.orientation | default "stacked")
 		"hook"         "assets/live-card.html"
 	) -}}

component-library/components/faq/faq.hugo.html

@@ -16,15 +16,24 @@
     )}}
 {{ end }}
 
+{{/* Initialize global arguments */}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
+
+{{/* Main code */}}
 {{ if not $args.err }}
 	{{ $color := "" }}
 	{{ if $args.contrast }}{{ $color = "white" }}{{ end }}
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "color" $color "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
 	{{ $class := "" }}
 	{{ $id := printf "faq-%s" (md5 (delimit (slice . now) "-")) }}
 
-	<div id="{{ $id }}" class="accordion accordion-faq {{ if $args.contrast }}accordion-faq-contrast text-white {{ end }}accordion-flush mb-3{{ with $class }} {{ . }}{{ end }} col-12 col-md-6 mx-auto">
+	<div id="{{ $id }}" class="accordion accordion-faq {{ if $args.contrast }}accordion-faq-contrast text-white {{ end -}}
+		accordion-flush{{ with $class }} {{ . }}{{ end }} col-12 col-md-6 mx-auto">
 		{{ range $index, $item := $args.items }}
 			<div class="accordion-item">
 				{{- with $item.title -}}

component-library/components/panels/panels.bookshop.yml

@@ -16,7 +16,6 @@ blueprint:
     align:
     width:
   cols:
-  icon-rounded:
   padding:
   background:
     backdrop:
@@ -30,6 +29,7 @@ blueprint:
       content:
   tab-type:
   ratio:
+  responsive:
   class:
   width:
   justify:

component-library/components/panels/panels.hugo.html

@@ -21,6 +21,7 @@
 
 {{/* Initialize global arguments */}}
 {{- $breakpoint := partial "utilities/GetBreakpoint.html" -}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
 
 {{/* Initialize local variables */}}
 {{ $list := slice }}
@@ -60,8 +61,13 @@
 	{{ $titles = $titles | append $element.title }}
 {{ end}}
 
+{{/* Main code */}}
 {{ if not $error }}
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
 	{{- partial "assets/nav.html" (dict 
         "id"           (or $args.id $parentID)

component-library/components/video-message/video-message.bookshop.yml

@@ -24,6 +24,7 @@ blueprint:
   link-type:
   orientation:
   icon-rounded:
+  icon-style:
   video:
     provider:
     account:

component-library/components/video-message/video-message.hugo.html

@@ -16,6 +16,7 @@
     )}}
 {{ end }}
 
+{{/* Initialize global variables */}}
 {{- $breakpoint := partial "utilities/GetBreakpoint.html" -}}
 {{- $padding := partial "utilities/GetPadding.html" -}}
 
@@ -59,6 +60,7 @@
 	{{ $cols := .cols }}
 	{{ $type := .type }}
 	{{ $iconRounded := .iconRounded }}
+	{{ $iconStyle := .iconStyle }}
 
 	{{- partial "assets/card-group.html" (dict 
 		"page"         page
@@ -75,9 +77,11 @@
 		"button"       true
 		"link-type"    $type
 		"icon-rounded" $iconRounded
+		"icon-style"   $iconStyle
 	) -}}
 {{ end }}
 
+{{/* Main code */}}
 {{ if not $args.err }}
 	{{ $list := slice }}
 
@@ -96,10 +100,14 @@
 		) }}
 	{{ end}}
 
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
 	{{ if eq $args.orientation "stacked" }}
-		<div class="col-{{ $breakpoint.current }}-{{ $args.width }} mx-auto pb-{{ $padding.y }}">
+		<div class="col-{{ $breakpoint.current }}-{{ $args.width }} mx-auto">
 		{{ with $args.video }}
 			{{- partial "inline/video.html" (dict
 				"provider"   .provider
@@ -112,11 +120,17 @@
 			) -}}
 		{{ end }}
 		</div>
-		<div class="mt-{{ $padding.y }} pb-{{ $padding.y }}">
-			{{- partial "inline/messages.html" (dict "list" $list "cols" $args.cols "type" $args.type "iconRounded" $args.iconRounded) -}}
+		<div class="mt-{{ $padding.y }}">
+			{{- partial "inline/messages.html" (dict
+				"list"        $list
+				"cols"        $args.cols
+				"type"        $args.type
+				"iconRounded" $args.iconRounded
+				"iconStyle"   $args.iconStyle
+			) -}}
 		</div>
 	{{ else }}
-		<div class="container grid gap-4 pb-{{ $padding.y }}">
+		<div class="container grid gap-{{ $padding.x }}">
 			<div class="row row-cols-1 row-cols-{{ $breakpoint.current }}-2">
 				<div class="col col-{{ $breakpoint.current }}-{{ $args.width }} p-0">
 					{{ with $args.video }}
@@ -132,7 +146,13 @@
 					{{ end }}
 				</div>
 				<div class="col col-{{ $breakpoint.current }}-{{ sub 12 $args.width }} mt-{{ $padding.y }} mt-{{ $breakpoint.current }}-0">
-					{{- partial "inline/messages.html" (dict "list" $list "cols" 1 "type" $args.type "iconRounded" $args.iconRounded) -}}
+					{{- partial "inline/messages.html" (dict
+						"list"        $list
+						"cols"        1
+						"type"        $args.type
+						"iconRounded" $args.iconRounded
+						"iconStyle"   $args.iconStyle
+					) -}}
 				</div>
 			</div>
 		</div>

data/structures/card-group.yml

@@ -12,6 +12,7 @@ arguments:
   class:
   color:
   padding:
+    default: 3
   gutter:
     release: v0.19.0
   header-style:
@@ -43,6 +44,7 @@ arguments:
   icon-rounded:
     release: v1.0.0
   align:
+    default: start
   wrapper:
     default: p-0
   responsive:

data/structures/card.yml

@@ -15,6 +15,7 @@ arguments:
     parent: cascade
   padding:
     parent: cascade
+    default: 3
   gutter:
     default: 0
     parent: cascade
@@ -45,6 +46,7 @@ arguments:
   icon-rounded:
     release: v1.0.0
   align:
+    default: start
     parent: cascade
     release: v0.23.0
   scroll:

exampleSite/content/en/_index.md

@@ -56,6 +56,7 @@ content_blocks:
     cols: 1
     padding: 4
     limit: 2
+    icon-style: fa-5x
     header-style: none
     footer-style: tags
     orientation: horizontal-sm

exampleSite/content/en/blocks/_index.md

@@ -25,9 +25,10 @@ content_blocks:
     more:
       title: More Posts
     cols: 3
-    padding: 0
+    padding: 3
     limit: 9
     paginate: true
     cover: false
     header-style: none
+    class: border-1
 ---

exampleSite/content/en/blocks/cards.md

@@ -24,14 +24,19 @@ The `cards` content block renders a group of content cards.
     subtle: true
   orientation: stacked
   icon-rounded: true
-  class: text-center
+  icon-style: fa-xs
+  padding: 0
+  align: start
   elements:
     - title: First Card
       icon: fas 1
+      content: Content of the first card
     - title: Second Card
       icon: fas 2
+      content: Content of the second card
     - title: Third Card
       icon: fas 3
+      content: Content of the third card
 ```
 
 {{< /example-bookshop >}}
@@ -42,3 +47,145 @@ The `cards` content block renders a group of content cards.
 The content block supports the following arguments:
 
 {{< args bookshop-cards >}}
+
+## Examples
+
+### Stacked cards with an image
+
+Set the `image` attribute of each `element` to an image asset to render illustrated cards.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: stacked
+  class: bg-body
+  align: center
+  elements:
+    - title: First Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+    - title: Second Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+    - title: Third Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Horizontal cards with an image
+
+Set the `orientation` attribute to `horizontal` to render horizontally oriented cards.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: horizontal
+  class: bg-body
+  align: center
+  elements:
+    - title: First Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: Content of the first card
+    - title: Second Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: Content of the second card
+    - title: Third Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: Content of the third card
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Stacked cards with an icon
+
+Set the `icon` attribute of each `element` to an icon to render illustrated cards. Adjust the icon's styling with `icon-rounded` and `icon-style`.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: stacked
+  icon-style: fa-xs text-primary
+  align: start
+  padding: 0
+  elements:
+    - title: First Card
+      icon: fas 1
+      content: Content of the first card
+    - title: Second Card
+      icon: fas 2
+      content: Content of the second card
+    - title: Third Card
+      icon: fas 3
+      content: Content of the third card
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Horizontal cards with an icon
+
+Set the `icon` attribute of each `element` to an icon to render illustrated cards. Adjust the icon's styling with `icon-rounded` and `icon-style`.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: horizontal
+  icon-rounded: true
+  icon-style: fa-2xs text-primary
+  align: start
+  padding: 0
+  elements:
+    - title: First Card
+      icon: fas 1
+      content: Content of the first card
+    - title: Second Card
+      icon: fas 2
+      content: Content of the second card
+    - title: Third Card
+      icon: fas 3
+      content: Content of the third card
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->

exampleSite/content/en/blocks/video-message.md

@@ -24,6 +24,7 @@ The `video` content block renders a horizontal line to separate sections. The se
     color: primary
     subtle: true
   orientation: horizontal
+  icon-style: fa-lg
   video:
     provider: vimeo
     media-id: "55073825"

exampleSite/hugo_stats.json

@@ -70,7 +70,6 @@
     ],
     "classes": [
       "%!s(<nil>)",
-      "%!s(MISSING)",
       "about",
       "accordion",
       "accordion-body",
@@ -90,6 +89,7 @@
       "align-middle",
       "align-self-center",
       "align-self-end",
+      "align-self-start",
       "anchor",
       "articles",
       "background-container",
@@ -104,6 +104,7 @@
       "bg-opacity-10",
       "bg-primary",
       "bg-primary-subtle",
+      "bg-secondary-subtle",
       "bi",
       "bi-activity",
       "border",
@@ -144,6 +145,7 @@
       "card-icon-primary",
       "card-icon-secondary",
       "card-img-bg",
+      "card-img-h100",
       "card-img-top",
       "card-img-wrap",
       "card-text",
@@ -172,6 +174,7 @@
       "col-6",
       "col-8",
       "col-9",
+      "col-auto",
       "col-lg-2",
       "col-lg-4",
       "col-lg-8",
@@ -230,12 +233,17 @@
       "fa-2xs",
       "fa-3",
       "fa-4x",
+      "fa-5x",
       "fa-activity",
       "fa-address-card",
       "fa-angle-left",
+      "fa-angle-right",
+      "fa-angles-left",
+      "fa-angles-right",
       "fa-arrow-left",
       "fa-arrow-right",
       "fa-bootstrap",
+      "fa-check",
       "fa-chevron-right",
       "fa-circle",
       "fa-circle-check",
@@ -258,6 +266,8 @@
       "fa-house",
       "fa-info",
       "fa-inverse",
+      "fa-lg",
+      "fa-li",
       "fa-link",
       "fa-linkedin",
       "fa-magnifying-glass",
@@ -273,10 +283,12 @@
       "fa-stack-2x",
       "fa-sun",
       "fa-timeline",
+      "fa-ul",
       "fa-up-right-from-square",
       "fa-whatsapp",
       "fa-wrapper",
       "fa-x-twitter",
+      "fa-xs",
       "fab",
       "fade",
       "faq",
@@ -332,6 +344,7 @@
       "justify-content-between",
       "justify-content-center",
       "justify-content-end",
+      "justify-content-md-end",
       "justify-content-md-start",
       "justify-content-start",
       "katex",
@@ -347,15 +360,16 @@
       "lottie-animation",
       "m-0",
       "m-auto",
-      "m-md-n4",
       "m-n1",
       "main",
       "main-nav-toggler",
       "mb-0",
+      "mb-1",
       "mb-3",
       "mb-4",
       "mb-5",
       "mb-lg-5",
+      "me-1",
       "me-3",
       "me-auto",
       "mermaid",
@@ -365,6 +379,7 @@
       "ms-3",
       "ms-auto",
       "ms-md-3",
+      "mt-1",
       "mt-2",
       "mt-3",
       "mt-4",
@@ -377,11 +392,13 @@
       "mx-auto",
       "mx-md-0",
       "mx-md-2",
+      "mx-md-n4",
       "my-2",
       "my-4",
       "my-auto",
       "my-md-0",
       "my-md-auto",
+      "my-md-n4",
       "nav",
       "nav-callout",
       "nav-item",
@@ -413,7 +430,6 @@
       "p-2",
       "p-3",
       "p-4",
-      "p-md-4",
       "page-item",
       "page-link",
       "pagination",
@@ -446,14 +462,18 @@
       "ptw-sm-4",
       "px-%!d(string=0)",
       "px-2",
+      "px-3",
       "px-4",
+      "px-md-4",
       "px-xxl-0",
       "py-%!d(string=0)",
+      "py-0",
       "py-1",
       "py-2",
       "py-3",
       "py-4",
       "py-md-1",
+      "py-md-4",
       "ratio",
       "ratio-16x9",
       "releases",
@@ -462,6 +482,7 @@
       "rounded-5",
       "rounded-bottom",
       "rounded-pill",
+      "rounded-start",
       "rounded-top",
       "row",
       "row-cols-1",
@@ -512,6 +533,7 @@
       "text-decoration-none",
       "text-end",
       "text-info",
+      "text-md-start",
       "text-muted",
       "text-nowrap",
       "text-primary",
@@ -568,6 +590,7 @@
     ],
     "ids": [
       "abbr",
+      "accelerate-your-data-products",
       "accordion",
       "accordion-0",
       "accordion-0-heading-0",
@@ -577,8 +600,10 @@
       "accordion-0-item-1",
       "accordion-0-item-2",
       "accordéon",
+      "ai",
       "alert",
       "alerte",
+      "analytics",
       "animatie",
       "animation",
       "args",
@@ -615,15 +640,37 @@
       "content-blocks",
       "cookies-etc",
       "custom-activity",
+      "data-quality",
       "data-tables",
       "docs",
       "documentation",
       "dropdown-nav-0",
-      "dropdown-panel-0c581a31b41dc3a66978850c49104d94",
-      "dropdown-panel-48654ebd7a32e1fd1bb0564bc97480fc",
-      "dropdown-panel-8875c06848ca8f8df24e77f669dce510",
-      "dropdown-panel-8f19332bfc71bfa2d83acc6b314006b1",
-      "dropdown-panel-a65659e3a01257b5212052a702486379",
+      "dropdown-panel-0003a7e46b53ac8b020223a04540efc8",
+      "dropdown-panel-02358324708687ef89134787c9eadce7",
+      "dropdown-panel-0677b5bd159b7a2205ce67fc212cdf72",
+      "dropdown-panel-08c46466be539808ec5eaf2ed62d3166",
+      "dropdown-panel-0f5114132df2eb59a34f6f483b45773d",
+      "dropdown-panel-1282863a3d9d4f48cfdda1b3453175d0",
+      "dropdown-panel-233df5925b1aa51036a810103e3fcfc6",
+      "dropdown-panel-23f997e089a48e0557e1a68a3be6043f",
+      "dropdown-panel-2e6adee768aeb134d99b4b0077bc5d76",
+      "dropdown-panel-3",
+      "dropdown-panel-30b828f349898a59c391cfe83a2350bf",
+      "dropdown-panel-3ca231df1d2631a41f47fe0c64823173",
+      "dropdown-panel-5bd81660a7d42d80ea90bee73987a17b",
+      "dropdown-panel-635223687ceb0a5a42f4fe8aaa1e2e09",
+      "dropdown-panel-66e392e711f61f0f07bb7f9d407e7f4e",
+      "dropdown-panel-6ac6891a8d9892b98c351eebe385a88b",
+      "dropdown-panel-7789f8d4670fad2c8db95b9a5f89f252",
+      "dropdown-panel-79b2dde83cf32fe92e42cea247760b04",
+      "dropdown-panel-89a824a8419fe1f598ea5f8b55eea69e",
+      "dropdown-panel-9939803751758151adc77a054c9daaae",
+      "dropdown-panel-99e7ec813ccca330fad770b5eec1b54d",
+      "dropdown-panel-9afbfdc48217f1d52d7fe73c9587db78",
+      "dropdown-panel-cda0496d191c21329f1434217fee97e3",
+      "dropdown-panel-de582d49a7906344482800b8f40cf92e",
+      "dropdown-panel-e1cfd380f19609648eea96372e782721",
+      "dropdown-panel-ea6ee5cd45b17dd87a7caa9d728a7b74",
       "elements-type",
       "entity-relationship-diagram",
       "example",
@@ -641,18 +688,42 @@
       "fab-medium",
       "fab-whatsapp",
       "fab-x-twitter",
-      "faq-848b28af09862da6902e356c675acfb1",
-      "faq-848b28af09862da6902e356c675acfb1-heading-faq-848b28af09862da6902e356c675acfb1",
-      "faq-848b28af09862da6902e356c675acfb1-item-0",
-      "faq-848b28af09862da6902e356c675acfb1-item-1",
-      "faq-848b28af09862da6902e356c675acfb1-item-2",
+      "faq-0643a9d9b5ef82c4c5932e5d08b4a284",
+      "faq-0643a9d9b5ef82c4c5932e5d08b4a284-heading-faq-0643a9d9b5ef82c4c5932e5d08b4a284",
+      "faq-0643a9d9b5ef82c4c5932e5d08b4a284-item-0",
+      "faq-0643a9d9b5ef82c4c5932e5d08b4a284-item-1",
+      "faq-0643a9d9b5ef82c4c5932e5d08b4a284-item-2",
+      "faq-98c2fd16c5ee30fca868cc0b7ec6f8d3",
+      "faq-98c2fd16c5ee30fca868cc0b7ec6f8d3-heading-faq-98c2fd16c5ee30fca868cc0b7ec6f8d3",
+      "faq-98c2fd16c5ee30fca868cc0b7ec6f8d3-item-0",
+      "faq-98c2fd16c5ee30fca868cc0b7ec6f8d3-item-1",
+      "faq-98c2fd16c5ee30fca868cc0b7ec6f8d3-item-2",
+      "faq-9f0fcbd7484fd2466bd8168f22a1e34a",
+      "faq-9f0fcbd7484fd2466bd8168f22a1e34a-heading-faq-9f0fcbd7484fd2466bd8168f22a1e34a",
+      "faq-9f0fcbd7484fd2466bd8168f22a1e34a-item-0",
+      "faq-9f0fcbd7484fd2466bd8168f22a1e34a-item-1",
+      "faq-9f0fcbd7484fd2466bd8168f22a1e34a-item-2",
+      "faq-a1e247a715831a939159c87d18645d93",
+      "faq-a1e247a715831a939159c87d18645d93-heading-faq-a1e247a715831a939159c87d18645d93",
+      "faq-a1e247a715831a939159c87d18645d93-item-0",
+      "faq-a1e247a715831a939159c87d18645d93-item-1",
+      "faq-a1e247a715831a939159c87d18645d93-item-2",
+      "faq-f92d187c10ff30fb242e84d9d19da695",
+      "faq-f92d187c10ff30fb242e84d9d19da695-heading-faq-f92d187c10ff30fb242e84d9d19da695",
+      "faq-f92d187c10ff30fb242e84d9d19da695-item-0",
+      "faq-f92d187c10ff30fb242e84d9d19da695-item-1",
+      "faq-f92d187c10ff30fb242e84d9d19da695-item-2",
       "fas-1",
       "fas-2",
       "fas-3",
       "fas-address-card",
       "fas-angle-left",
+      "fas-angle-right",
+      "fas-angles-left",
+      "fas-angles-right",
       "fas-arrow-left",
       "fas-arrow-right",
+      "fas-check",
       "fas-chevron-right",
       "fas-circle",
       "fas-circle-check",
@@ -694,6 +765,8 @@
       "gérer-les-préférences-des-cookies",
       "heading",
       "heading-type",
+      "horizontal-cards-with-an-icon",
+      "horizontal-cards-with-an-image",
       "how-do-we-use-cookies",
       "how-we-share-your-information",
       "icon",
@@ -710,6 +783,7 @@
       "items-type",
       "kaart",
       "kbd",
+      "kickstart-your-data-stack-without-coding",
       "language-selector",
       "leaflet-map-0",
       "lien",
@@ -724,6 +798,7 @@
       "messages-type",
       "mindmap",
       "more-type",
+      "move-your-data-into-action",
       "nav",
       "nav-0-0",
       "nav-0-1",
@@ -732,11 +807,32 @@
       "nav-0-btn-1",
       "nav-0-btn-2",
       "nav-nav-0",
-      "nav-panel-0c581a31b41dc3a66978850c49104d94",
-      "nav-panel-48654ebd7a32e1fd1bb0564bc97480fc",
-      "nav-panel-8875c06848ca8f8df24e77f669dce510",
-      "nav-panel-8f19332bfc71bfa2d83acc6b314006b1",
-      "nav-panel-a65659e3a01257b5212052a702486379",
+      "nav-panel-0003a7e46b53ac8b020223a04540efc8",
+      "nav-panel-02358324708687ef89134787c9eadce7",
+      "nav-panel-0677b5bd159b7a2205ce67fc212cdf72",
+      "nav-panel-08c46466be539808ec5eaf2ed62d3166",
+      "nav-panel-0f5114132df2eb59a34f6f483b45773d",
+      "nav-panel-1282863a3d9d4f48cfdda1b3453175d0",
+      "nav-panel-233df5925b1aa51036a810103e3fcfc6",
+      "nav-panel-23f997e089a48e0557e1a68a3be6043f",
+      "nav-panel-2e6adee768aeb134d99b4b0077bc5d76",
+      "nav-panel-3",
+      "nav-panel-30b828f349898a59c391cfe83a2350bf",
+      "nav-panel-3ca231df1d2631a41f47fe0c64823173",
+      "nav-panel-5bd81660a7d42d80ea90bee73987a17b",
+      "nav-panel-635223687ceb0a5a42f4fe8aaa1e2e09",
+      "nav-panel-66e392e711f61f0f07bb7f9d407e7f4e",
+      "nav-panel-6ac6891a8d9892b98c351eebe385a88b",
+      "nav-panel-7789f8d4670fad2c8db95b9a5f89f252",
+      "nav-panel-79b2dde83cf32fe92e42cea247760b04",
+      "nav-panel-89a824a8419fe1f598ea5f8b55eea69e",
+      "nav-panel-9939803751758151adc77a054c9daaae",
+      "nav-panel-99e7ec813ccca330fad770b5eec1b54d",
+      "nav-panel-9afbfdc48217f1d52d7fe73c9587db78",
+      "nav-panel-cda0496d191c21329f1434217fee97e3",
+      "nav-panel-de582d49a7906344482800b8f40cf92e",
+      "nav-panel-e1cfd380f19609648eea96372e782721",
+      "nav-panel-ea6ee5cd45b17dd87a7caa9d728a7b74",
       "navbar",
       "navbar-0-collapse",
       "navbar-mode",
@@ -745,36 +841,162 @@
       "navigation",
       "notification",
       "overview",
-      "panel-0c581a31b41dc3a66978850c49104d94-0",
-      "panel-0c581a31b41dc3a66978850c49104d94-1",
-      "panel-0c581a31b41dc3a66978850c49104d94-2",
-      "panel-0c581a31b41dc3a66978850c49104d94-btn-0",
-      "panel-0c581a31b41dc3a66978850c49104d94-btn-1",
-      "panel-0c581a31b41dc3a66978850c49104d94-btn-2",
-      "panel-48654ebd7a32e1fd1bb0564bc97480fc-0",
-      "panel-48654ebd7a32e1fd1bb0564bc97480fc-1",
-      "panel-48654ebd7a32e1fd1bb0564bc97480fc-2",
-      "panel-48654ebd7a32e1fd1bb0564bc97480fc-btn-0",
-      "panel-48654ebd7a32e1fd1bb0564bc97480fc-btn-1",
-      "panel-48654ebd7a32e1fd1bb0564bc97480fc-btn-2",
-      "panel-8875c06848ca8f8df24e77f669dce510-0",
-      "panel-8875c06848ca8f8df24e77f669dce510-1",
-      "panel-8875c06848ca8f8df24e77f669dce510-2",
-      "panel-8875c06848ca8f8df24e77f669dce510-btn-0",
-      "panel-8875c06848ca8f8df24e77f669dce510-btn-1",
-      "panel-8875c06848ca8f8df24e77f669dce510-btn-2",
-      "panel-8f19332bfc71bfa2d83acc6b314006b1-0",
-      "panel-8f19332bfc71bfa2d83acc6b314006b1-1",
-      "panel-8f19332bfc71bfa2d83acc6b314006b1-2",
-      "panel-8f19332bfc71bfa2d83acc6b314006b1-btn-0",
-      "panel-8f19332bfc71bfa2d83acc6b314006b1-btn-1",
-      "panel-8f19332bfc71bfa2d83acc6b314006b1-btn-2",
-      "panel-a65659e3a01257b5212052a702486379-0",
-      "panel-a65659e3a01257b5212052a702486379-1",
-      "panel-a65659e3a01257b5212052a702486379-2",
-      "panel-a65659e3a01257b5212052a702486379-btn-0",
-      "panel-a65659e3a01257b5212052a702486379-btn-1",
-      "panel-a65659e3a01257b5212052a702486379-btn-2",
+      "panel-0003a7e46b53ac8b020223a04540efc8-0",
+      "panel-0003a7e46b53ac8b020223a04540efc8-1",
+      "panel-0003a7e46b53ac8b020223a04540efc8-2",
+      "panel-0003a7e46b53ac8b020223a04540efc8-btn-0",
+      "panel-0003a7e46b53ac8b020223a04540efc8-btn-1",
+      "panel-0003a7e46b53ac8b020223a04540efc8-btn-2",
+      "panel-02358324708687ef89134787c9eadce7-0",
+      "panel-02358324708687ef89134787c9eadce7-1",
+      "panel-02358324708687ef89134787c9eadce7-2",
+      "panel-02358324708687ef89134787c9eadce7-btn-0",
+      "panel-02358324708687ef89134787c9eadce7-btn-1",
+      "panel-02358324708687ef89134787c9eadce7-btn-2",
+      "panel-0677b5bd159b7a2205ce67fc212cdf72-0",
+      "panel-0677b5bd159b7a2205ce67fc212cdf72-1",
+      "panel-0677b5bd159b7a2205ce67fc212cdf72-2",
+      "panel-0677b5bd159b7a2205ce67fc212cdf72-btn-0",
+      "panel-0677b5bd159b7a2205ce67fc212cdf72-btn-1",
+      "panel-0677b5bd159b7a2205ce67fc212cdf72-btn-2",
+      "panel-08c46466be539808ec5eaf2ed62d3166-0",
+      "panel-08c46466be539808ec5eaf2ed62d3166-1",
+      "panel-08c46466be539808ec5eaf2ed62d3166-2",
+      "panel-08c46466be539808ec5eaf2ed62d3166-btn-0",
+      "panel-08c46466be539808ec5eaf2ed62d3166-btn-1",
+      "panel-08c46466be539808ec5eaf2ed62d3166-btn-2",
+      "panel-0f5114132df2eb59a34f6f483b45773d-0",
+      "panel-0f5114132df2eb59a34f6f483b45773d-1",
+      "panel-0f5114132df2eb59a34f6f483b45773d-2",
+      "panel-0f5114132df2eb59a34f6f483b45773d-btn-0",
+      "panel-0f5114132df2eb59a34f6f483b45773d-btn-1",
+      "panel-0f5114132df2eb59a34f6f483b45773d-btn-2",
+      "panel-1282863a3d9d4f48cfdda1b3453175d0-0",
+      "panel-1282863a3d9d4f48cfdda1b3453175d0-1",
+      "panel-1282863a3d9d4f48cfdda1b3453175d0-2",
+      "panel-1282863a3d9d4f48cfdda1b3453175d0-btn-0",
+      "panel-1282863a3d9d4f48cfdda1b3453175d0-btn-1",
+      "panel-1282863a3d9d4f48cfdda1b3453175d0-btn-2",
+      "panel-233df5925b1aa51036a810103e3fcfc6-0",
+      "panel-233df5925b1aa51036a810103e3fcfc6-1",
+      "panel-233df5925b1aa51036a810103e3fcfc6-2",
+      "panel-233df5925b1aa51036a810103e3fcfc6-btn-0",
+      "panel-233df5925b1aa51036a810103e3fcfc6-btn-1",
+      "panel-233df5925b1aa51036a810103e3fcfc6-btn-2",
+      "panel-23f997e089a48e0557e1a68a3be6043f-0",
+      "panel-23f997e089a48e0557e1a68a3be6043f-1",
+      "panel-23f997e089a48e0557e1a68a3be6043f-2",
+      "panel-23f997e089a48e0557e1a68a3be6043f-btn-0",
+      "panel-23f997e089a48e0557e1a68a3be6043f-btn-1",
+      "panel-23f997e089a48e0557e1a68a3be6043f-btn-2",
+      "panel-2e6adee768aeb134d99b4b0077bc5d76-0",
+      "panel-2e6adee768aeb134d99b4b0077bc5d76-1",
+      "panel-2e6adee768aeb134d99b4b0077bc5d76-2",
+      "panel-2e6adee768aeb134d99b4b0077bc5d76-btn-0",
+      "panel-2e6adee768aeb134d99b4b0077bc5d76-btn-1",
+      "panel-2e6adee768aeb134d99b4b0077bc5d76-btn-2",
+      "panel-3-0",
+      "panel-3-1",
+      "panel-3-2",
+      "panel-3-btn-0",
+      "panel-3-btn-1",
+      "panel-3-btn-2",
+      "panel-30b828f349898a59c391cfe83a2350bf-0",
+      "panel-30b828f349898a59c391cfe83a2350bf-1",
+      "panel-30b828f349898a59c391cfe83a2350bf-2",
+      "panel-30b828f349898a59c391cfe83a2350bf-btn-0",
+      "panel-30b828f349898a59c391cfe83a2350bf-btn-1",
+      "panel-30b828f349898a59c391cfe83a2350bf-btn-2",
+      "panel-3ca231df1d2631a41f47fe0c64823173-0",
+      "panel-3ca231df1d2631a41f47fe0c64823173-1",
+      "panel-3ca231df1d2631a41f47fe0c64823173-2",
+      "panel-3ca231df1d2631a41f47fe0c64823173-btn-0",
+      "panel-3ca231df1d2631a41f47fe0c64823173-btn-1",
+      "panel-3ca231df1d2631a41f47fe0c64823173-btn-2",
+      "panel-5bd81660a7d42d80ea90bee73987a17b-0",
+      "panel-5bd81660a7d42d80ea90bee73987a17b-1",
+      "panel-5bd81660a7d42d80ea90bee73987a17b-2",
+      "panel-5bd81660a7d42d80ea90bee73987a17b-btn-0",
+      "panel-5bd81660a7d42d80ea90bee73987a17b-btn-1",
+      "panel-5bd81660a7d42d80ea90bee73987a17b-btn-2",
+      "panel-635223687ceb0a5a42f4fe8aaa1e2e09-0",
+      "panel-635223687ceb0a5a42f4fe8aaa1e2e09-1",
+      "panel-635223687ceb0a5a42f4fe8aaa1e2e09-2",
+      "panel-635223687ceb0a5a42f4fe8aaa1e2e09-btn-0",
+      "panel-635223687ceb0a5a42f4fe8aaa1e2e09-btn-1",
+      "panel-635223687ceb0a5a42f4fe8aaa1e2e09-btn-2",
+      "panel-66e392e711f61f0f07bb7f9d407e7f4e-0",
+      "panel-66e392e711f61f0f07bb7f9d407e7f4e-1",
+      "panel-66e392e711f61f0f07bb7f9d407e7f4e-2",
+      "panel-66e392e711f61f0f07bb7f9d407e7f4e-btn-0",
+      "panel-66e392e711f61f0f07bb7f9d407e7f4e-btn-1",
+      "panel-66e392e711f61f0f07bb7f9d407e7f4e-btn-2",
+      "panel-6ac6891a8d9892b98c351eebe385a88b-0",
+      "panel-6ac6891a8d9892b98c351eebe385a88b-1",
+      "panel-6ac6891a8d9892b98c351eebe385a88b-2",
+      "panel-6ac6891a8d9892b98c351eebe385a88b-btn-0",
+      "panel-6ac6891a8d9892b98c351eebe385a88b-btn-1",
+      "panel-6ac6891a8d9892b98c351eebe385a88b-btn-2",
+      "panel-7789f8d4670fad2c8db95b9a5f89f252-0",
+      "panel-7789f8d4670fad2c8db95b9a5f89f252-1",
+      "panel-7789f8d4670fad2c8db95b9a5f89f252-2",
+      "panel-7789f8d4670fad2c8db95b9a5f89f252-btn-0",
+      "panel-7789f8d4670fad2c8db95b9a5f89f252-btn-1",
+      "panel-7789f8d4670fad2c8db95b9a5f89f252-btn-2",
+      "panel-79b2dde83cf32fe92e42cea247760b04-0",
+      "panel-79b2dde83cf32fe92e42cea247760b04-1",
+      "panel-79b2dde83cf32fe92e42cea247760b04-2",
+      "panel-79b2dde83cf32fe92e42cea247760b04-btn-0",
+      "panel-79b2dde83cf32fe92e42cea247760b04-btn-1",
+      "panel-79b2dde83cf32fe92e42cea247760b04-btn-2",
+      "panel-89a824a8419fe1f598ea5f8b55eea69e-0",
+      "panel-89a824a8419fe1f598ea5f8b55eea69e-1",
+      "panel-89a824a8419fe1f598ea5f8b55eea69e-2",
+      "panel-89a824a8419fe1f598ea5f8b55eea69e-btn-0",
+      "panel-89a824a8419fe1f598ea5f8b55eea69e-btn-1",
+      "panel-89a824a8419fe1f598ea5f8b55eea69e-btn-2",
+      "panel-9939803751758151adc77a054c9daaae-0",
+      "panel-9939803751758151adc77a054c9daaae-1",
+      "panel-9939803751758151adc77a054c9daaae-2",
+      "panel-9939803751758151adc77a054c9daaae-btn-0",
+      "panel-9939803751758151adc77a054c9daaae-btn-1",
+      "panel-9939803751758151adc77a054c9daaae-btn-2",
+      "panel-99e7ec813ccca330fad770b5eec1b54d-0",
+      "panel-99e7ec813ccca330fad770b5eec1b54d-1",
+      "panel-99e7ec813ccca330fad770b5eec1b54d-2",
+      "panel-99e7ec813ccca330fad770b5eec1b54d-btn-0",
+      "panel-99e7ec813ccca330fad770b5eec1b54d-btn-1",
+      "panel-99e7ec813ccca330fad770b5eec1b54d-btn-2",
+      "panel-9afbfdc48217f1d52d7fe73c9587db78-0",
+      "panel-9afbfdc48217f1d52d7fe73c9587db78-1",
+      "panel-9afbfdc48217f1d52d7fe73c9587db78-2",
+      "panel-9afbfdc48217f1d52d7fe73c9587db78-btn-0",
+      "panel-9afbfdc48217f1d52d7fe73c9587db78-btn-1",
+      "panel-9afbfdc48217f1d52d7fe73c9587db78-btn-2",
+      "panel-cda0496d191c21329f1434217fee97e3-0",
+      "panel-cda0496d191c21329f1434217fee97e3-1",
+      "panel-cda0496d191c21329f1434217fee97e3-2",
+      "panel-cda0496d191c21329f1434217fee97e3-btn-0",
+      "panel-cda0496d191c21329f1434217fee97e3-btn-1",
+      "panel-cda0496d191c21329f1434217fee97e3-btn-2",
+      "panel-de582d49a7906344482800b8f40cf92e-0",
+      "panel-de582d49a7906344482800b8f40cf92e-1",
+      "panel-de582d49a7906344482800b8f40cf92e-2",
+      "panel-de582d49a7906344482800b8f40cf92e-btn-0",
+      "panel-de582d49a7906344482800b8f40cf92e-btn-1",
+      "panel-de582d49a7906344482800b8f40cf92e-btn-2",
+      "panel-e1cfd380f19609648eea96372e782721-0",
+      "panel-e1cfd380f19609648eea96372e782721-1",
+      "panel-e1cfd380f19609648eea96372e782721-2",
+      "panel-e1cfd380f19609648eea96372e782721-btn-0",
+      "panel-e1cfd380f19609648eea96372e782721-btn-1",
+      "panel-e1cfd380f19609648eea96372e782721-btn-2",
+      "panel-ea6ee5cd45b17dd87a7caa9d728a7b74-0",
+      "panel-ea6ee5cd45b17dd87a7caa9d728a7b74-1",
+      "panel-ea6ee5cd45b17dd87a7caa9d728a7b74-2",
+      "panel-ea6ee5cd45b17dd87a7caa9d728a7b74-btn-0",
+      "panel-ea6ee5cd45b17dd87a7caa9d728a7b74-btn-1",
+      "panel-ea6ee5cd45b17dd87a7caa9d728a7b74-btn-2",
       "persona",
       "pie-chart",
       "pills",
@@ -791,12 +1013,17 @@
       "security",
       "sequence-diagram",
       "spinner",
+      "stacked-cards-with-an-icon",
+      "stacked-cards-with-an-image",
+      "stacked-video-message",
+      "start-using-your-data-immediately",
       "state-diagram",
       "sub",
       "sup",
       "sécurité",
       "table",
       "tabs",
+      "tap-into-the-latest-thinking-from-infusal-and-stay-in-the-lead",
       "third-panel",
       "third-party-links--use-of-your-information",
       "timeline",
@@ -809,6 +1036,7 @@
       "toast-message-email-4",
       "toc-collapse",
       "tooltip",
+      "turn-boring-into-brilliant",
       "types-de-cookies-que-nous-utilisons",
       "types-of-cookies-we-use",
       "underline",
@@ -819,6 +1047,7 @@
       "vos-droits",
       "welcome-to-hinode",
       "what-are-cookies",
+      "works-seamlessly-with-your-current-tech-stack",
       "xy-chart",
       "your-rights"
     ]

go.mod

@@ -4,7 +4,7 @@ go 1.19
 
 require (
 	github.com/airbnb/lottie-web v5.12.2+incompatible // indirect
-	github.com/cloudcannon/bookshop/hugo/v3 v3.16.1 // indirect
+	github.com/cloudcannon/bookshop/hugo/v3 v3.16.3 // indirect
 	github.com/gethinode/mod-bootstrap v1.3.3 // indirect
 	github.com/gethinode/mod-csp v1.0.7 // indirect
 	github.com/gethinode/mod-flexsearch/v2 v2.1.1 // indirect

go.sum

@@ -6,6 +6,8 @@ github.com/cloudcannon/bookshop/hugo/v3 v3.16.0 h1:Fb76ABHqTyPl9Z2QqYJCwiMBKPySh
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.0/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.1 h1:WByz6rqg28h94VLVLscu77/CHhi2peig/LqrnVomX0Y=
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.1/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
+github.com/cloudcannon/bookshop/hugo/v3 v3.16.3 h1:/Z66xKILl1SNGQePHZCnxo6vFgED7AGI600OSPotXj4=
+github.com/cloudcannon/bookshop/hugo/v3 v3.16.3/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
 github.com/gethinode/mod-bootstrap v1.0.1 h1:NDZar+UEL42YHCvzzO+jVgqkZU5INA12BpjX3y6U4I4=
 github.com/gethinode/mod-bootstrap v1.0.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-bootstrap v1.1.0 h1:BbalsW8kmFhv+J+dcc41TGcjIlM/p69AB0h0oGhAXIU=

layouts/_partials/assets/card-group.html

@@ -156,7 +156,7 @@
                     "ratio"         (partial "inline/style.html" (dict "styles" $args.styles "index" $index "key" "ratio" "default" $args.ratio))
                     "portrait"      (partial "inline/style.html" (dict "styles" $args.styles "index" $index "key" "portrait" "default" $args.portrait))
                     "subtle"        $args.subtle
-                    "icon-style"    (or (index $element "$icon-style") $element.style)
+                    "icon-style"    (or (index $element "icon-style") $element.style $args.iconStyle)
                     "align"         $args.align
                     "button"        $args.button
                     "button-label"  (or (index $element "button-label") $element.buttonLabel)

layouts/_partials/assets/card.html

@@ -62,6 +62,26 @@
     </small></p>
 {{- end -}}
 
+{{/* Inline partial to render the card's icon */}}
+{{- define "_partials/inline/card-icon.html" -}}
+    {{ $padding := .padding }}
+    {{ $icon := .icon}}
+    {{ $rounded := .rounded }}
+    {{ $style := .style}}
+    {{ $stack := .stack }}
+    {{ $class := .class }}
+
+    <div class="card-icon{{ with $padding }} p-{{ . }}{{ end }}{{ if $rounded }} fa-stack {{ $style }} fa-fw {{ $stack }}{{ end }} {{ $class }}">
+        {{ if $rounded }}
+            {{- partial "assets/icon.html" (dict "icon" (printf "fas circle fa-stack-2x") "spacing" false) -}}
+            {{- partial "assets/icon.html" (dict "icon" (printf "%s fa-stack-1x fa-inverse" $icon) "spacing" false) -}}
+        {{ else }}
+            {{- partial "assets/icon.html" (dict "icon" (printf "%s %s fa-fw" $icon $style) "spacing" false) -}}
+        {{ end }}
+    </div>
+{{- end -}}
+
+
 {{/* Initialize global variables */}}
 {{- $padding := partial "utilities/GetPadding.html" -}}
 
@@ -110,7 +130,6 @@
 {{- $icon := $args.icon -}}
 {{- $iconStyle := "" -}}
 {{- $anchor := $args.anchor }}
-{{- $style := $args.style }}
 
 {{- with $page -}}
     {{- if not $args.title }}{{ $title = .Title }}{{ end -}}
@@ -126,10 +145,11 @@
     {{- if not $args.anchor }}{{ $anchor = (or (and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.anchor) "") }}{{ end -}}
 {{- end -}}
 
+{{- $style := $args.iconStyle }}
 {{ if (hasPrefix $args.orientation "horizontal") }}
-    {{ if not $args.style }}{{ $style = "fa-fluid fa-fw" }}{{ end }}
+    {{ if not $args.iconStyle }}{{ $style = "fa-fluid fa-fw" }}{{ end }}
 {{ else }}
-    {{ if not $args.style }}{{ $style = "fa-4x" }}{{ end }}
+    {{ if not $args.iconStyle }}{{ $style = "fa-4x" }}{{ end }}
     {{- $iconStyle = "pb-3" -}}
 {{ end }}
 
@@ -138,11 +158,19 @@
 {{- if eq $args.body "none" }}{{ $title = "" }}{{ $description = "" }}{{ end -}}
 {{ if site.Params.main.titleCase }}{{ $title = title $title }}{{ end }}
 
+{{- $thumbnailArgs := dict
+    "src"      $thumbnail
+    "portrait" $args.portrait
+    "anchor"   $anchor
+    "sizes"    $args.sizes
+    "title"    (or $args.alt $title)
+    "loading"  $args.loading
+-}}
 
 {{/* Main code */}}
-{{ if or (ne $args.gutter "0") ($args.wrapper) }}<div class="g-{{ $args.gutter }} {{ $args.wrapper }}">{{ end }}
+{{ if or (ne $args.gutter "0") ($args.wrapper) }}<div class="g-{{ $args.gutter }} {{ $args.wrapper }} h-100">{{ end }}
 
-{{ $stack := "fa-2x" }}
+{{ $stack := "" }}
 
 {{- if hasPrefix $args.orientation "horizontal" -}}
     {{ $col1 := "" }}
@@ -157,61 +185,44 @@
             {{ $col1 = "col-4 pe-0" }}
             {{ $col2 = "col-8" }}
         {{ end }}
-    {{ else if $icon }}
-        {{ if eq $args.orientation "horizontal-sm" }}
-            {{ $stack = "fa-1x" }}
-            {{ $col1 = "col-4 col-md-2 pe-0" }}
-            {{ $col2 = "col-8 col-md-10" }}
-        {{ else }}
-            {{ $col1 = "col-4 pe-0" }}
-            {{ $col2 = "col-8" }}
-        {{ end }}
-
     {{ end }}
 
     {{/* Render horizontal card */}}
     <div class="card {{ $colorStyle }}{{ $args.class }}">
-        <div class="row g-0 row-cols-2 h-100{{ if $args.button }} pb-{{ $padding.y }}{{ end }}">
+        <div class="{{ if $thumbnail }}row-cols-2 row {{ end }} g-0 h-100{{ if $args.button }} pb-{{ $padding.y }}{{ end }}">
             {{- if $thumbnail -}}
                 <div class="{{ $col1 }}">
                     {{ $fullHeight := "card-img-h100" }}
                     {{ $rounding := "rounded-start" }}
                     {{ if eq (lower (path.Ext $thumbnail)) ".svg" }}{{ $fullHeight = "" }}{{ $rounding = "" }}{{ end }}
-                    {{- partial $args.hook (dict 
-                        "src"      $thumbnail
-                        "ratio"    (or $ratio "auto")
-                        "portrait" $args.portrait
-                        "sizes"    $args.sizes
-                        "anchor"   $anchor
-                        "wrapper"  "h-100 card-img-wrap d-flex align-items-center"
+                    {{- partial $args.hook (merge $thumbnailArgs (dict 
+                        "wrapper"  "card-img-wrap h-100 d-flex align-items-center"
                         "class"    (printf "card-img-bg %s %s" $rounding $fullHeight)
-                        "title"    $title
-                        "loading"  $args.loading
-                    ) -}}
-                </div>
-            {{- else if $icon -}}
-                <div class="{{ $col1 }} p-{{ $args.padding }}">
-                    <div class="card-icon {{ if $args.iconRounded }}fa-stack {{ $args.stack }} mx-auto{{ else }}fa-wrapper h-100 {{ end }} d-flex align-items-{{ $args.align}} justify-content-center {{ $iconStyle }}">
-                        {{ if $args.iconRounded }}
-                            {{- partial "assets/icon.html" (dict "icon" "fas circle fa-stack-2x") -}}
-                            {{- partial "assets/icon.html" (dict "icon" (printf "%s fa-stack-1x fa-inverse" $icon)) -}}
-                        {{ else }}
-                            {{- partial "assets/icon.html" (dict "icon" (printf "%s %s" $icon $style)) -}}
-                        {{ end }}
-                    </div>
+                        "ratio"    (or $ratio "auto")
+                    )) -}}
                 </div>
             {{- end -}}
             <div class="{{ $col2 }}">
-                <div class="card-body d-flex p-{{ $args.padding }} flex-column h-100 flex-fill">
-                    {{ if $page }}
-                        <div>{{ partial "inline/card-caption.html" (dict
-                            "page"     $page
-                            "keywords" $args.headerStyle
-                            "color"    $args.color
-                            ) }}
-                        </div>
+                <div class="card-body p-{{ $args.padding }} h-100 hstack">
+                    {{ if $icon }}
+                        {{- partial "inline/card-icon.html" (dict
+                            "icon"     $icon
+                            "padding"  $args.padding
+                            "rounded"  $args.iconRounded
+                            "style"    $style
+                            "stack"    $args.stack
+                            "class"    (printf "align-self-%s me-1 mt-1 col-auto" $args.align)
+                        )}}
                     {{ end }}
-                    <div class="flex-fill">
+                    <div>
+                        {{ if $page }}
+                            <div>{{ partial "inline/card-caption.html" (dict
+                                "page"     $page
+                                "keywords" $args.headerStyle
+                                "color"    $args.color
+                                ) }}
+                            </div>
+                        {{ end }}
                         {{- partial "inline/card-body.html" (dict
                             "title"       $title
                             "href"        $href
@@ -219,25 +230,25 @@
                             "description" $description
                             "button"      $args.button
                         ) -}}
+                        {{ if $page }}<div>{{ partial "inline/card-caption.html" (dict "page" $page "keywords" $args.footerStyle "color" $args.color) }}</div>{{ end }}
+                        {{ if and $href $args.button }}
+                            {{ $label := (or $args.buttonLabel $title) | default (T "readMore") }}
+                            {{ $buttonClass := "card-button mb-n4" }}
+                            {{ $buttonType := (or $args.linkType $args.buttonType) }}
+                            {{ if eq $buttonType "link" }}{{ $buttonClass = "card-button card-button-link mb-n4" }}{{ end }}
+                            <div class="d-flex align-items-end">
+                                {{ partial "assets/button.html" (dict 
+                                    "title"       $label
+                                    "icon"        "fas chevron-right"
+                                    "href"        $href
+                                    "outline"     true
+                                    "button-size" "sm"
+                                    "class"       $buttonClass
+                                    "link-type"   $buttonType
+                                )}}
+                            </div>
+                        {{ end }}
                     </div>
-                    {{ if $page }}<div>{{ partial "inline/card-caption.html" (dict "page" $page "keywords" $args.footerStyle "color" $args.color) }}</div>{{ end }}
-                    {{ if and $href $args.button }}
-                        {{ $label := (or $args.buttonLabel $title) | default (T "readMore") }}
-                        {{ $buttonClass := "card-button mb-n4" }}
-                        {{ $buttonType := (or $args.linkType $args.buttonType) }}
-                        {{ if eq $buttonType "link" }}{{ $buttonClass = "card-button card-button-link mb-n4" }}{{ end }}
-                        <div class="d-flex align-items-end">
-                            {{ partial "assets/button.html" (dict 
-                                "title"       $label
-                                "icon"        "fas chevron-right"
-                                "href"        $href
-                                "outline"     true
-                                "button-size" "sm"
-                                "class"       $buttonClass
-                                "link-type"   $buttonType
-                            )}}
-                        </div>
-                    {{ end }}
                 </div>
             </div>
         </div>
@@ -245,30 +256,23 @@
 {{- else -}}
     {{/* Render stacked / default card */}}
     {{ $overlay := eq $args.orientation "overlay" }}
-    <div class="card {{ $colorStyle }} {{ $args.class }} text-{{ $args.align }}">
+    <div class="card {{ $colorStyle }} {{ $args.class }} text-{{ $args.align }}{{ if not $thumbnail }} p-{{ $args.padding }}{{ end }}">
         {{- if $thumbnail -}}
-            {{- partial $args.hook (dict
-                "src"      $thumbnail
-                "ratio"    (or $ratio "16x9")
-                "portrait" $args.portrait
-                "anchor"   $anchor
-                "sizes"    $args.sizes
+            {{- partial $args.hook (merge $thumbnailArgs (dict
                 "wrapper"  "card-img-wrap"
                 "class"    "card-img-top card-img-bg"
-                "title"    (or $args.alt $title)
-                "loading"  $args.loading
-            ) -}}
+                "ratio"    (or $ratio "16x9")
+            )) -}}
         {{- else if $icon -}}
-            <div class="card-icon p-{{ $args.padding }} {{ $iconStyle }} text-{{ $args.align }} {{ if $args.iconRounded }}fa-stack {{ $args.stack }}{{ end }} w-100">
-                {{ if $args.iconRounded }}
-                    {{- partial "assets/icon.html" (dict "icon" (printf "fas circle fa-stack-2x %s")) -}}
-                    {{- partial "assets/icon.html" (dict "icon" (printf "%s fa-stack-1x fa-inverse" $icon)) -}}
-                {{ else }}
-                    {{- partial "assets/icon.html" (dict "icon" (printf "%s %s" $icon $style)) -}}
-                {{ end }}
-            </div>
+            {{- partial "inline/card-icon.html" (dict
+                "icon"     $icon
+                "rounded"  $args.iconRounded
+                "style"    $style
+                "stack"    $args.stack
+                "class"    (printf "mb-1 m-0 text-%s" $args.align)
+            )}}
         {{- end -}}
-        <div class="card-body d-flex flex-column p-{{ $args.padding }} {{ if $overlay }}card-img-overlay card-overlay-gradient p-4{{ end }}" {{ if $overlay }}data-bs-theme="dark"{{ end }}>
+        <div class="card-body p-0 d-flex flex-column{{ if $thumbnail }} p-{{ $args.padding }}{{ end }}{{ if $overlay }}card-img-overlay card-overlay-gradient p-4{{ end }}" {{ if $overlay }}data-bs-theme="dark"{{ end }}>
             {{ if $args.overlay }}<div class="flex-grow-1"></div>{{ end }}
             {{ if $page }}{{- partial "inline/card-caption.html" (dict "page" $page "keywords" $args.headerStyle "color" $args.color) -}}{{ end }}
             {{- partial "inline/card-body.html" (dict "title" $title "href" $href "color" $args.color "description" $description) -}}
@@ -276,7 +280,7 @@
         </div>
         {{ if $args.button }}
             {{ $label := (or $args.buttonLabel $title) | default (T "readMore") }}
-            <div class="row p-{{ $args.padding }}" >
+            <div class="row" >
                 <div class="{{ if eq $args.orientation "horizontal-sm" }}col-4 col-md-2{{ else if eq $args.orientation "horizontal" }}col-4{{ end }}"></div>
                 <div class="col d-flex align-items-end {{ if eq $args.orientation "horizontal-sm" }}px-2{{ else if eq $args.orientation "horizontal"}}px-1 {{ else }}px-2 pt-1{{ end }}">
                     {{ $buttonClass := "card-button" }}
@@ -289,7 +293,7 @@
                         "button-size" "sm"
                         "class"       "card-button"
                         "class"       $buttonClass
-                        "link-type"   $args.buttonType
+                        "link-type"   $buttonType
                     )}}
                 </div>
             </div>

layouts/_partials/assets/section-title.html

@@ -85,8 +85,8 @@
     "mode"    $args.mode
 }}
 
-<!-- Main code -->
-<div class="text-{{ $args.heading.align }}{{ with $justify }} {{ . }}{{ end }}{{ with $args.class }} {{ . }}{{ end }}{{ with $width }} {{ . }}{{ end }} py-{{ $padding.y }}">
+{{/* Main code */}}
+<div class="text-{{ $args.heading.align }}{{ with $justify }} {{ . }}{{ end }}{{ with $args.class }} {{ . }}{{ end }}{{ with $width }} {{ . }}{{ end }}">
     {{ if and $preheading (eq $arrangement "first") }}
         <div class="container-fluid">
             <div class="row">

layouts/_partials/assets/timeline.html

@@ -22,6 +22,7 @@
 
 {{/* Initialize global variables */}}
 {{ $arrangement := site.Params.modules.bookshop.title.arrangement }}
+{{- $padding := partial "utilities/GetPadding.html" -}}
 
 {{/* Initialize local arguments */}}
 {{- $page := $args.page -}}
@@ -105,11 +106,12 @@
             "link-type"   (or $args.linkType $args.type)
             "arrangement" $arrangement
             "justify"     $args.justify
+		    "class"       (printf "pb-%d" $padding.y)
         ) }}
     {{ end }}
 
     {{/* Render default timeline */}}
-    <div class="container p-0 d-none d-md-block mb-5 {{ with $background }} timeline-{{ . }} {{ . }}{{ end }}{{ with $args.class }} {{ . }}{{ end }}">
+    <div class="container p-0 d-none d-md-block {{ with $background }} timeline-{{ . }} {{ . }}{{ end }}{{ with $args.class }} {{ . }}{{ end }}">
         {{ $title | safeHTML }}
         {{ range $index, $item := $data }}
             <div class="row timeline timeline-{{ $item.color }} timeline-dot g-0 ">

layouts/_shortcodes/card.html

@@ -31,12 +31,12 @@
 {{- $header := or (partial "utilities/GetArgParent" (dict "page" . "arg" "header-style")) (partial "utilities/GetArgParent" (dict "page" . "arg" "header"))  -}}
 {{- $icon := .Get "icon" -}}
 {{- $iconRounded := or (partial "utilities/GetArgParent" (dict "page" . "arg" "icon-rounded")) (partial "utilities/GetArgParent" (dict "page" . "arg" "iconRounded")) -}}
-{{- $align := partial "utilities/GetArgParent" (dict "page" . "arg" "align") -}}
+{{- $align := partial "utilities/GetArgParent" (dict "page" . "arg" "align") | default "start" -}}
 {{- $style := or (partial "utilities/GetArgParent" (dict "page" . "arg" "icon-style")) (partial "utilities/GetArgParent" (dict "page" . "arg" "style")) -}}
 {{- $subtle := partial "utilities/GetArgParent" (dict "page" . "arg" "subtle") -}}
 {{- $loading := .Get "loading" -}}
 {{- $orientation := partial "utilities/GetArgParent" (dict "page" . "arg" "orientation") -}}
-{{- $padding := partial "utilities/GetArgParent" (dict "page" . "arg" "padding") -}}
+{{- $padding := partial "utilities/GetArgParent" (dict "page" . "arg" "padding") | default 3 -}}
 {{- $ratio := partial "utilities/GetArgParent" (dict "page" . "arg" "ratio") -}}
 {{- $page := .Page -}}
 {{- $path := .Get "path" -}}

layouts/_shortcodes/example-bookshop.html

@@ -54,7 +54,13 @@
             {{ errorf "Expected '_bookshop_name': %s" .Position -}}
             {{ $error = true }}
         {{ else }}
-            {{ $partial = partial "_bookshop/helpers/component.html" (slice $component_name $data "p-1 p-md-4" "m-n1 m-md-n4") }}
+            {{- $padding := partial "utilities/GetPadding.html" -}}
+            {{ $partial = partial "_bookshop/helpers/component.html" (slice
+                $component_name
+                $data
+                (printf "p-1 px-md-%d py-md-%d" $padding.x $padding.y)
+                (printf "m-n1 mx-md-n%d my-md-n%d" $padding.x $padding.y)
+            ) }}
         {{ end }}
     {{ else }}
         {{ errorf "Expected frontmatter codeblock as input: %s" .Position -}}