mirror of
https://github.com/gethinode/hinode.git
synced 2025-10-16 14:33:10 +00:00
Compare commits
11 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
f4d59a0324 | ||
|
|
6c068898a3 | ||
|
|
eec6697ff6 | ||
|
|
26402fb5be | ||
|
|
e08aebf928 | ||
|
|
787ad2eb91 | ||
|
|
8f137b0c54 | ||
|
|
a979dd8d58 | ||
|
|
b77a125485 | ||
|
|
004da99765 | ||
|
|
907c8ac800 |
@@ -27,6 +27,8 @@ blueprint:
|
||||
more:
|
||||
title:
|
||||
link:
|
||||
icon-rounded:
|
||||
icon-style:
|
||||
cols:
|
||||
padding:
|
||||
limit:
|
||||
|
||||
@@ -73,6 +73,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 +97,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"
|
||||
|
||||
@@ -17,6 +17,7 @@ blueprint:
|
||||
width:
|
||||
cols:
|
||||
icon-rounded:
|
||||
icon-style:
|
||||
padding:
|
||||
background:
|
||||
backdrop:
|
||||
@@ -32,3 +33,4 @@ blueprint:
|
||||
class:
|
||||
width:
|
||||
justify:
|
||||
align:
|
||||
|
||||
@@ -40,15 +40,15 @@
|
||||
{{- 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 d-%s-none %s" $breakpoint.prev (or $args.class ""))
|
||||
"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"
|
||||
) -}}
|
||||
@@ -56,15 +56,15 @@
|
||||
{{- 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 d-none d-%s-block %s" $breakpoint.prev (or $args.class ""))
|
||||
"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"
|
||||
) -}}
|
||||
|
||||
@@ -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:
|
||||
|
||||
@@ -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:
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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
|
||||
---
|
||||
|
||||
@@ -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 -->
|
||||
@@ -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",
|
||||
@@ -144,6 +144,7 @@
|
||||
"card-icon-primary",
|
||||
"card-icon-secondary",
|
||||
"card-img-bg",
|
||||
"card-img-h100",
|
||||
"card-img-top",
|
||||
"card-img-wrap",
|
||||
"card-text",
|
||||
@@ -172,6 +173,7 @@
|
||||
"col-6",
|
||||
"col-8",
|
||||
"col-9",
|
||||
"col-auto",
|
||||
"col-lg-2",
|
||||
"col-lg-4",
|
||||
"col-lg-8",
|
||||
@@ -230,9 +232,13 @@
|
||||
"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",
|
||||
@@ -277,6 +283,7 @@
|
||||
"fa-whatsapp",
|
||||
"fa-wrapper",
|
||||
"fa-x-twitter",
|
||||
"fa-xs",
|
||||
"fab",
|
||||
"fade",
|
||||
"faq",
|
||||
@@ -352,10 +359,12 @@
|
||||
"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 +374,7 @@
|
||||
"ms-3",
|
||||
"ms-auto",
|
||||
"ms-md-3",
|
||||
"mt-1",
|
||||
"mt-2",
|
||||
"mt-3",
|
||||
"mt-4",
|
||||
@@ -446,6 +456,7 @@
|
||||
"ptw-sm-4",
|
||||
"px-%!d(string=0)",
|
||||
"px-2",
|
||||
"px-3",
|
||||
"px-4",
|
||||
"px-xxl-0",
|
||||
"py-%!d(string=0)",
|
||||
@@ -462,6 +473,7 @@
|
||||
"rounded-5",
|
||||
"rounded-bottom",
|
||||
"rounded-pill",
|
||||
"rounded-start",
|
||||
"rounded-top",
|
||||
"row",
|
||||
"row-cols-1",
|
||||
@@ -619,11 +631,16 @@
|
||||
"docs",
|
||||
"documentation",
|
||||
"dropdown-nav-0",
|
||||
"dropdown-panel-0c581a31b41dc3a66978850c49104d94",
|
||||
"dropdown-panel-48654ebd7a32e1fd1bb0564bc97480fc",
|
||||
"dropdown-panel-8875c06848ca8f8df24e77f669dce510",
|
||||
"dropdown-panel-8f19332bfc71bfa2d83acc6b314006b1",
|
||||
"dropdown-panel-a65659e3a01257b5212052a702486379",
|
||||
"dropdown-panel-238964a04aea6f8244486a01aed3980e",
|
||||
"dropdown-panel-2e7f06bd7d5712159e2b7e5ac229ee72",
|
||||
"dropdown-panel-4ebb6a36beb73ac83f451cd6ec26838d",
|
||||
"dropdown-panel-4fdf233f48f3ac0b803d8f61d31061f8",
|
||||
"dropdown-panel-614a2684d4bdf8e5fe22a20d7d9c0a35",
|
||||
"dropdown-panel-6d6a7601d2a9e04ae94f19b456563e16",
|
||||
"dropdown-panel-741ce6efb5ef84856ecec7bb8244f44d",
|
||||
"dropdown-panel-81fe53c7c723ca3d94d01401dc7e00c0",
|
||||
"dropdown-panel-a446e03ac74b582fa6a24fefbc8dd1bf",
|
||||
"dropdown-panel-c652a97140bc598c5580e01bdc444e65",
|
||||
"elements-type",
|
||||
"entity-relationship-diagram",
|
||||
"example",
|
||||
@@ -641,16 +658,24 @@
|
||||
"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-7533b3556b81a10b7e52b91bbf81d758",
|
||||
"faq-7533b3556b81a10b7e52b91bbf81d758-heading-faq-7533b3556b81a10b7e52b91bbf81d758",
|
||||
"faq-7533b3556b81a10b7e52b91bbf81d758-item-0",
|
||||
"faq-7533b3556b81a10b7e52b91bbf81d758-item-1",
|
||||
"faq-7533b3556b81a10b7e52b91bbf81d758-item-2",
|
||||
"faq-f9bb3b20a95e205fbad9e433c2899cbe",
|
||||
"faq-f9bb3b20a95e205fbad9e433c2899cbe-heading-faq-f9bb3b20a95e205fbad9e433c2899cbe",
|
||||
"faq-f9bb3b20a95e205fbad9e433c2899cbe-item-0",
|
||||
"faq-f9bb3b20a95e205fbad9e433c2899cbe-item-1",
|
||||
"faq-f9bb3b20a95e205fbad9e433c2899cbe-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-chevron-right",
|
||||
@@ -694,6 +719,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",
|
||||
@@ -732,11 +759,16 @@
|
||||
"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-238964a04aea6f8244486a01aed3980e",
|
||||
"nav-panel-2e7f06bd7d5712159e2b7e5ac229ee72",
|
||||
"nav-panel-4ebb6a36beb73ac83f451cd6ec26838d",
|
||||
"nav-panel-4fdf233f48f3ac0b803d8f61d31061f8",
|
||||
"nav-panel-614a2684d4bdf8e5fe22a20d7d9c0a35",
|
||||
"nav-panel-6d6a7601d2a9e04ae94f19b456563e16",
|
||||
"nav-panel-741ce6efb5ef84856ecec7bb8244f44d",
|
||||
"nav-panel-81fe53c7c723ca3d94d01401dc7e00c0",
|
||||
"nav-panel-a446e03ac74b582fa6a24fefbc8dd1bf",
|
||||
"nav-panel-c652a97140bc598c5580e01bdc444e65",
|
||||
"navbar",
|
||||
"navbar-0-collapse",
|
||||
"navbar-mode",
|
||||
@@ -745,36 +777,66 @@
|
||||
"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-238964a04aea6f8244486a01aed3980e-0",
|
||||
"panel-238964a04aea6f8244486a01aed3980e-1",
|
||||
"panel-238964a04aea6f8244486a01aed3980e-2",
|
||||
"panel-238964a04aea6f8244486a01aed3980e-btn-0",
|
||||
"panel-238964a04aea6f8244486a01aed3980e-btn-1",
|
||||
"panel-238964a04aea6f8244486a01aed3980e-btn-2",
|
||||
"panel-2e7f06bd7d5712159e2b7e5ac229ee72-0",
|
||||
"panel-2e7f06bd7d5712159e2b7e5ac229ee72-1",
|
||||
"panel-2e7f06bd7d5712159e2b7e5ac229ee72-2",
|
||||
"panel-2e7f06bd7d5712159e2b7e5ac229ee72-btn-0",
|
||||
"panel-2e7f06bd7d5712159e2b7e5ac229ee72-btn-1",
|
||||
"panel-2e7f06bd7d5712159e2b7e5ac229ee72-btn-2",
|
||||
"panel-4ebb6a36beb73ac83f451cd6ec26838d-0",
|
||||
"panel-4ebb6a36beb73ac83f451cd6ec26838d-1",
|
||||
"panel-4ebb6a36beb73ac83f451cd6ec26838d-2",
|
||||
"panel-4ebb6a36beb73ac83f451cd6ec26838d-btn-0",
|
||||
"panel-4ebb6a36beb73ac83f451cd6ec26838d-btn-1",
|
||||
"panel-4ebb6a36beb73ac83f451cd6ec26838d-btn-2",
|
||||
"panel-4fdf233f48f3ac0b803d8f61d31061f8-0",
|
||||
"panel-4fdf233f48f3ac0b803d8f61d31061f8-1",
|
||||
"panel-4fdf233f48f3ac0b803d8f61d31061f8-2",
|
||||
"panel-4fdf233f48f3ac0b803d8f61d31061f8-btn-0",
|
||||
"panel-4fdf233f48f3ac0b803d8f61d31061f8-btn-1",
|
||||
"panel-4fdf233f48f3ac0b803d8f61d31061f8-btn-2",
|
||||
"panel-614a2684d4bdf8e5fe22a20d7d9c0a35-0",
|
||||
"panel-614a2684d4bdf8e5fe22a20d7d9c0a35-1",
|
||||
"panel-614a2684d4bdf8e5fe22a20d7d9c0a35-2",
|
||||
"panel-614a2684d4bdf8e5fe22a20d7d9c0a35-btn-0",
|
||||
"panel-614a2684d4bdf8e5fe22a20d7d9c0a35-btn-1",
|
||||
"panel-614a2684d4bdf8e5fe22a20d7d9c0a35-btn-2",
|
||||
"panel-6d6a7601d2a9e04ae94f19b456563e16-0",
|
||||
"panel-6d6a7601d2a9e04ae94f19b456563e16-1",
|
||||
"panel-6d6a7601d2a9e04ae94f19b456563e16-2",
|
||||
"panel-6d6a7601d2a9e04ae94f19b456563e16-btn-0",
|
||||
"panel-6d6a7601d2a9e04ae94f19b456563e16-btn-1",
|
||||
"panel-6d6a7601d2a9e04ae94f19b456563e16-btn-2",
|
||||
"panel-741ce6efb5ef84856ecec7bb8244f44d-0",
|
||||
"panel-741ce6efb5ef84856ecec7bb8244f44d-1",
|
||||
"panel-741ce6efb5ef84856ecec7bb8244f44d-2",
|
||||
"panel-741ce6efb5ef84856ecec7bb8244f44d-btn-0",
|
||||
"panel-741ce6efb5ef84856ecec7bb8244f44d-btn-1",
|
||||
"panel-741ce6efb5ef84856ecec7bb8244f44d-btn-2",
|
||||
"panel-81fe53c7c723ca3d94d01401dc7e00c0-0",
|
||||
"panel-81fe53c7c723ca3d94d01401dc7e00c0-1",
|
||||
"panel-81fe53c7c723ca3d94d01401dc7e00c0-2",
|
||||
"panel-81fe53c7c723ca3d94d01401dc7e00c0-btn-0",
|
||||
"panel-81fe53c7c723ca3d94d01401dc7e00c0-btn-1",
|
||||
"panel-81fe53c7c723ca3d94d01401dc7e00c0-btn-2",
|
||||
"panel-a446e03ac74b582fa6a24fefbc8dd1bf-0",
|
||||
"panel-a446e03ac74b582fa6a24fefbc8dd1bf-1",
|
||||
"panel-a446e03ac74b582fa6a24fefbc8dd1bf-2",
|
||||
"panel-a446e03ac74b582fa6a24fefbc8dd1bf-btn-0",
|
||||
"panel-a446e03ac74b582fa6a24fefbc8dd1bf-btn-1",
|
||||
"panel-a446e03ac74b582fa6a24fefbc8dd1bf-btn-2",
|
||||
"panel-c652a97140bc598c5580e01bdc444e65-0",
|
||||
"panel-c652a97140bc598c5580e01bdc444e65-1",
|
||||
"panel-c652a97140bc598c5580e01bdc444e65-2",
|
||||
"panel-c652a97140bc598c5580e01bdc444e65-btn-0",
|
||||
"panel-c652a97140bc598c5580e01bdc444e65-btn-1",
|
||||
"panel-c652a97140bc598c5580e01bdc444e65-btn-2",
|
||||
"persona",
|
||||
"pie-chart",
|
||||
"pills",
|
||||
@@ -791,6 +853,8 @@
|
||||
"security",
|
||||
"sequence-diagram",
|
||||
"spinner",
|
||||
"stacked-cards-with-an-icon",
|
||||
"stacked-cards-with-an-image",
|
||||
"state-diagram",
|
||||
"sub",
|
||||
"sup",
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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" -}}
|
||||
|
||||
Reference in New Issue
Block a user