Merge pull request #1041 from gethinode/develop

Develop

data/structures/card-group.yml

@@ -122,6 +122,13 @@ arguments:
       Enables horizontal scrolling of the cards. By default, the card group
       wraps any cards beyond the amount of defined columns to a new line. When
       `scroll` is set to true, a horizontal scroll bar is added instead.
+  spacer:
+    type: bool
+    optional: true
+    comment: >-
+      Inserts a spacer before the card.
+    release: v0.24.16
+    group: partial
   hook:
     type: string
     optional: true

data/structures/card.yml

@@ -90,6 +90,18 @@ arguments:
         - publication
         - tags
         - none
+  body:
+    type: select
+    optional: true
+    default: full
+    parent: cascade
+    release: v0.24.16
+    comment: >-
+      Body of the card. 
+    options:
+      values:
+        - full
+        - none
   footer:
     type: select
     optional: true
@@ -146,6 +158,16 @@ arguments:
         - 16x9
         - 21x9
     group: partial
+  portrait:
+    type: bool
+    parent: cascade
+    optional: true
+    default: false
+    release: v0.24.16
+    comment: >-
+      Flag to adjust the ratio from landscape to portrait. The image itself is
+      not rotated, only the crop area is adjusted. Not applicable to vector
+      graphics.
   alt:
     type: string
     optional: true

layouts/partials/assets/card-group.html

@@ -23,9 +23,11 @@
 {{- $color := .color -}}
 {{- $padding := .padding -}}
 {{- $header := .header -}}
+{{- $body := .body -}}
 {{- $footer := .footer -}}
 {{- $orientation := .orientation -}}
 {{- $ratio := .ratio -}}
+{{- $portrait := .portrait | default false -}}
 {{- $wrapper := .wrapper | default "p-0" -}}
 {{- $style := .style -}}
 {{- $align := .align -}}
@@ -36,7 +38,9 @@
 {{- $buttonType := .buttonType -}}
 {{- $iconRounded := .iconRounded }}
 {{- $scroll := .scroll | default false }}
+{{- $spacer := .spacer | default false }}
 {{- $hook := .hook | default "assets/card.html" }}
+{{- $cols := string .cols | default "3" -}}
 
 <!-- Override arguments -->
 {{ $isPages := in (slice "page.Pages" "resource.Resources") (printf "%T" $pages) }}
@@ -50,6 +54,13 @@
     {{ $pages = first $paginator.PageSize (after (mul (sub $paginator.PageNumber 1) $paginator.PageSize) $pages) }}
 {{ end }}
 
+{{ $cardWrapper := "" }}
+{{ if $scroll }}
+    {{ $cardWrapper = printf "card-block card-block-%d" (int $cols) }}
+{{ end }}
+
+{{ if not $spacer }}{{ $class = printf "%s h-100" $class }}{{ end }}
+
 {{ $list := slice }}
 {{ if $isPages }}
     {{ range $index, $element := $pages }}
@@ -79,13 +90,10 @@
 {{- $max := $count -}}
 {{- $max = math.Min (.max | default $count) $count -}}
 {{- $responsive := .responsive | default true -}}
-{{- $cols := string .cols | default "3" -}}
 
 {{- $sizes := "100vw" }}
 {{- $colGrid := "" -}}
-{{ if $scroll }}
+{{ if not $scroll }}
-    {{- $colGrid = (printf "card-block-%d" $cols) -}}
-{{ else }}
     {{ $colGrid = printf "row-cols-%s" $cols }}
     {{- if eq $cols "1" }}
         {{ $colGrid = "row-cols-1" -}}
@@ -120,18 +128,20 @@
 
 <!-- Main code -->
 <div class="container {{ $wrapper }} {{ if $scroll }}card-container-wrapper{{ end }}">
-    <div class="row g-{{ $gutter }} {{ if $scroll }}d-flex flex-row flex-nowrap card-container scrollbar-horizontal pb-4 w-100{{ else }}{{ $colGrid }}{{ end }}">
+    <div class="row g-{{ $gutter }} {{ if $scroll }}d-flex flex-row flex-nowrap card-container scrollbar-horizontal pb-4 w-100 {{ end  }} {{ $colGrid }}">
         {{ range $index, $element := $list }}
             {{- $params := (dict
-                "class" (printf "h-100 %s" $class)
+                "class" (printf " %s" $class)
                 "color" $color
                 "footer" $footer
+                "body" $body
                 "header" $header
                 "loading" $loading
                 "sizes" $sizes
                 "orientation" $orientation
                 "padding" $padding
                 "ratio" $ratio
+                "portrait" $portrait
                 "subtle" $subtle
                 "style" $style
                 "align" $align
@@ -142,7 +152,8 @@
             ) -}}
             {{- $params = merge $element $params }}
 
-            <div class="col">
+            <div class="{{ with $cardWrapper }}{{ . }}{{ else }}col{{ end }}">
+                {{ if $spacer }}<div class="spacer"></div>{{ end }}
                 {{- partial $hook $params -}}
             </div>
             {{- if and (lt $index (sub $max 1)) $separator -}}

layouts/partials/assets/card.html

@@ -15,6 +15,7 @@
 {{- $class := .class -}}
 {{- $color := .color -}}
 {{- $description := .description -}}
+{{- $body := .body | default "full" -}}
 {{- $footer := .footer | default "none" -}}
 {{- $gutter := .gutter | default "0" -}}
 {{- $header := .header | default "full" -}}
@@ -29,6 +30,7 @@
 {{- $orientation := .orientation | default "stacked" -}}
 {{- $padding := (string .padding) | default "auto" -}}
 {{- $ratio := .ratio -}}
+{{- $portrait := .portrait | default false -}}
 {{- $thumbnail := .thumbnail -}}
 {{- $title := .title -}}
 {{- $subtle := .subtle -}}
@@ -58,6 +60,9 @@
     {{- if not $href }}{{ $href = .RelPermalink  }}{{ end -}}
     {{- if not $description }}{{ $description = partial "utilities/GetDescription.html" (dict "page" .) }}{{ end -}}
     {{- if not $thumbnail }}{{ $thumbnail = (or (and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.url) .Params.Thumbnail) }}{{ end -}}
+    {{ if not $ratio }}
+        {{- if and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.ratio }}{{ $ratio = .Params.Thumbnail.ratio }}{{ end -}}
+    {{ end }}
     {{- if not $icon }}{{ $icon = .Params.icon }}{{ end -}}
 {{- end -}}
 
@@ -69,6 +74,7 @@
 {{ end }}
 
 {{- if eq $orientation "none" }}{{ $thumbnail = "" }}{{ $icon = "" }}{{ end -}}
+{{- if eq $body "none" }}{{ $description = "" }}{{ end -}}
 
 <!-- Inline partial to render the card's body -->
 {{- define "partials/card-body.html" -}}
@@ -161,7 +167,7 @@
         <div class="row g-0 row-cols-2 h-100{{ if $button }} pb-5{{ end }}">
             {{- if $thumbnail -}}
                 <div class="{{ $col1 }}">
-                    {{- partial $hook (dict "url" $thumbnail "ratio" (or $ratio "1x1") "sizes" $sizes "wrapper" "h-100 card-img-wrap" "class" "rounded-start card-img-h100 card-img-bg" "title" $title "loading" $loading) -}}
+                    {{- partial $hook (dict "url" $thumbnail "ratio" (or $ratio "1x1") "portrait" $portrait "sizes" $sizes "wrapper" "h-100 card-img-wrap" "class" "rounded-start card-img-h100 card-img-bg" "title" $title "loading" $loading) -}}
                 </div>
             {{- else if $icon -}}
                 <div class="{{ $col1 }} p-{{ $padding }}">
@@ -206,7 +212,7 @@
     <!-- Render stacked / default card -->
     <div class="card {{ $colorStyle }} {{ $class }} text-{{ $align }}">
         {{- if $thumbnail -}}
-            {{- partial $hook (dict "url" $thumbnail "ratio" (or $ratio "16x9") "sizes" $sizes "wrapper" "card-img-wrap" "class" "card-img-top card-img-bg" "title" (or $alt $title) "loading" $loading) -}}
+            {{- partial $hook (dict "url" $thumbnail "ratio" (or $ratio "16x9") "portrait" $portrait "sizes" $sizes "wrapper" "card-img-wrap" "class" "card-img-top card-img-bg" "title" (or $alt $title) "loading" $loading) -}}
         {{- else if $icon -}}
             <div class="card-icon p-{{ $padding }} {{ $iconStyle }} text-{{ $align }} {{ if $iconRounded }}fa-stack {{ $stack }}{{ end }} w-100">
                 {{ if $iconRounded }}

package-lock.json

@@ -1,19 +1,19 @@
 {
   "name": "@gethinode/hinode",
-  "version": "0.24.15",
+  "version": "0.24.16",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@gethinode/hinode",
-      "version": "0.24.14",
+      "version": "0.24.16",
       "license": "MIT",
       "dependencies": {
         "@fullhuman/postcss-purgecss": "^6.0.0",
         "autoprefixer": "^10.4.19",
         "cssnano": "^7.0.4",
         "cssnano-preset-advanced": "^7.0.4",
-        "hugo-bin": "0.125.2",
+        "hugo-bin": "0.126.0",
         "purgecss-whitelister": "^2.4.0"
       },
       "devDependencies": {
@@ -3313,9 +3313,9 @@
       }
     },
     "node_modules/hugo-bin": {
-      "version": "0.125.2",
+      "version": "0.126.0",
-      "resolved": "https://registry.npmjs.org/hugo-bin/-/hugo-bin-0.125.2.tgz",
+      "resolved": "https://registry.npmjs.org/hugo-bin/-/hugo-bin-0.126.0.tgz",
-      "integrity": "sha512-JNjhuoGFBwJo6qDOeYUiXSoD7rPbwY36wyHJaqbRe9APNY1nPGO1Yy/Ut7rLcriKTBWKPZrh5Hz+9PzGnLV5Lw==",
+      "integrity": "sha512-tncBaQ1Gku3eVKB7PUiubj1VGXdTVB7OCYgrRqwlxxYMaIte9weg+uvEkZLJZJItNMv2wV2GpfIXblS5mLlvvg==",
       "funding": [
         {
           "type": "github",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gethinode/hinode",
-  "version": "0.24.15",
+  "version": "0.24.16",
   "description": "Hinode is a clean documentation and blog theme for Hugo, an open-source static site generator",
   "keywords": [
     "hugo",
@@ -71,7 +71,7 @@
     "autoprefixer": "^10.4.19",
     "cssnano": "^7.0.4",
     "cssnano-preset-advanced": "^7.0.4",
-    "hugo-bin": "0.125.2",
+    "hugo-bin": "0.126.0",
     "purgecss-whitelister": "^2.4.0"
   },
   "devDependencies": {