feat: add landing layout and harden rendering

This commit is contained in:
Friday authored and Nuno C. committed 2026-08-17 20:19:02 +01:00
1 parent 405c905754
commit 345f806d80
24 files changed
+353 -193

No files matched your search

@@ -9,7 +9,7 @@ series: ["Documentation"]
series_order: 5
---
Blowfish provides a fully flexible homepage layout. There are two main templates to choose from with additional settings to adjust the design. Alternatively, you can also provide your own template and have complete control over the homepage content.
Blowfish provides flexible homepage layouts with settings to adjust each design. Alternatively, you can also provide your own template and have complete control over the homepage content.
The layout of the homepage is controlled by the `homepage.layout` setting in the `params.toml` configuration file. Additionally, all layouts have the option to include a listing of [recent articles](#recent-articles).
@@ -57,6 +57,12 @@ The card layout is an extension of the page layout. It provides the same level o
To enable the Card layout, set `homepage.layout = "card"` and `homepage.homepageImage` in the `params.toml` configuration file.
## Landing layout
The Landing layout is designed for product sites, documentation hubs, and personal sites that need a stronger opening statement. It gives homepage content a spacious, editorial hero treatment while still rendering standard Markdown and Blowfish shortcodes, so the full page stays portable and easy to maintain.
To enable the Landing layout, set `homepage.layout = "landing"` in the `params.toml` configuration file. Use `content/_index.md` for the title, lead, calls to action, feature grids, and other content.
## Custom layout
@@ -68,7 +74,7 @@ With the configuration value set, create a new `custom.html` file and place it i
To include [recent articles](#recent-articles) on the custom layout, use the `recent-articles/main.html` partial.
As an example, the [homepage]({{< ref "/" >}}) on this site uses the custom layout to allow toggling between the profile and page layouts. Visit the [GitHub repo](https://github.com/nunocoracao/blowfish/blob/main/exampleSite/layouts/partials/home/custom.html) to see how it works.
The included example site uses the built-in Landing layout and standard content shortcodes. Visit the [GitHub repo](https://github.com/nunocoracao/blowfish/tree/main/exampleSite) to see how it is configured.
## Recent articles
+29 -3
View File
@@ -936,7 +936,7 @@ The `tabs` shortcode is commonly used to present different variants of a particu
| `default` | **Optional.** Label of the tab to be active by default. If not set, the first tab will be active. |
| `label` | **Required.** The text label displayed on the tab button. |
| `icon` | **Optional.** Icon name to display before the label. |
| `md` | **Optional.** Render tab content as Markdown (default `true`). Set `md=false` to allow nested shortcodes inside tab content. |
| `md` | **Optional.** Render tab content as Markdown (default `true`). Use `md=false` when the content is already HTML. |
**Example 1: Basic Usage**
@@ -963,7 +963,7 @@ The `tabs` shortcode is commonly used to present different variants of a particu
```
{{</* /tab */>}}
{{</* tab label="Linux" md=false */>}}
{{</* tab label="Linux" */>}}
{{</* alert */>}}See [documentation](https://code.visualstudio.com/docs/setup/linux#_install-vs-code-on-linux).{{</* /alert */>}}
{{</* /tab */>}}
@@ -994,12 +994,38 @@ The `tabs` shortcode is commonly used to present different variants of a particu
```
{{< /tab >}}
{{< tab label="Linux" md=false >}}
{{< tab label="Linux" >}}
{{< alert >}}See [documentation](https://code.visualstudio.com/docs/setup/linux#_install-vs-code-on-linux).{{< /alert >}}
{{< /tab >}}
{{< /tabs >}}
Nested shortcodes are supported with the default Markdown behaviour. For example, an accordion can live inside a tab without its generated HTML being rendered as Markdown a second time:
`````md
{{</* tabs */>}}
{{</* tab label="Details" */>}}
{{</* accordion mode="open" */>}}
{{</* accordionItem title="What is included?" */>}}
- Responsive behaviour
- Accessible markup
{{</* /accordionItem */>}}
{{</* /accordion */>}}
{{</* /tab */>}}
{{</* /tabs */>}}
`````
{{< tabs >}}
{{< tab label="Details" >}}
{{< accordion mode="open" >}}
{{< accordionItem title="What is included?" >}}
- Responsive behaviour
- Accessible markup
{{< /accordionItem >}}
{{< /accordion >}}
{{< /tab >}}
{{< /tabs >}}
**Example 2: With Group, Default, and Icon**
`````md