feat: add landing pages (aka widget pages v2)

Closes #2049

modules/wowchemy/layouts/index.html

@@ -18,8 +18,10 @@
 {{/* Generate homepage. */}}
 {{ if eq .Type "book" }}
   {{ partial "book_layout.html" . }}
-{{ else }}
+{{ else if eq .Type "widget_page" }}
   {{ partial "widget_page.html" . }}
+{{ else }}
+  {{ partial "landing_page.html" . }}
 {{ end }}
 
 {{- end -}}

modules/wowchemy/layouts/landing/single.html

@@ -0,0 +1,3 @@
+{{- define "main" -}}
+  {{ partial "landing_page.html" . }}
+{{- end -}}

modules/wowchemy/layouts/partials/blocks/about.avatar.html

@@ -10,7 +10,7 @@
 {{ if .author }}
   {{ $author = .author }}
 {{ else }}
-  {{ $author = $block.Params.author }}
+  {{ $author = $block.Params.author | default $block.content.username }}
 {{end}}
 
 {{ $person_page_path := (printf "/authors/%s" $author) }}
@@ -82,7 +82,7 @@
     {{ end }}
   </ul>
 
-  {{ with $block.Content }}
+  {{ with $block.Content | default ($block.content.text | emojify | markdownify) }}
   <div class="article-style pt-1">
     {{ . }}
   </div>

modules/wowchemy/layouts/partials/blocks/markdown.html

@@ -5,14 +5,15 @@
 {{/* Initialise */}}
 {{ $page := .wcPage }}
 {{ $block := .wcBlock }}
-{{ $columns := $block.Params.design.columns | default "2" }}
+{{ $columns := $block.Params.design.columns | default $block.design.columns | default "2" }}
+{{ $text := $block.Content | default ($block.content.text | emojify | markdownify) }}
 
 {{ if ne $columns "1" }}
   <div class="col-12 col-lg-8">
-    {{ $block.Content }}
+    {{ $text }}
   </div>
 {{ else }}
   <div class="col-12">
-    {{ $block.Content }}
+    {{ $text }}
   </div>
 {{ end }}

modules/wowchemy/layouts/partials/functions/parse_block_v2.html

@@ -0,0 +1,140 @@
+{{/* Wowchemy Block Parser */}}
+{{/* Documentation: https://wowchemy.com/blocks/ */}}
+{{/* License: https://github.com/wowchemy/wowchemy-hugo-themes/blob/main/LICENSE.md */}}
+
+{{ $page := .page }}
+{{ $block := .block }}
+
+{{ $block_type := lower $block.block | default "markdown" }}
+{{ $block_path := printf "blocks/%s.html" $block_type }}
+{{ if not (templates.Exists (printf "partials/%s" $block_path)) }}
+  {{ errorf "%s uses a `%s` block but the `%s` block was not found at `layouts/partials/%s`" $block.File.Path $block_type $block_type $block_path }}
+{{ end }}
+
+{{/* Workaround to make Hugo's .Page.Store.Set cascade up to the parent of headless pages */}}
+{{ if $block.Page.Store.Get "has_mermaid" }}
+  {{ $page.Page.Store.Set "has_mermaid" true }}
+{{ end }}
+
+{{/* Begin widget styling */}}
+{{ $bg := $block.design.background }}
+{{ $style := "" }}
+{{ $style_bg := "" }}
+
+{{ if $bg.color }}
+  {{ $style_bg = printf "background-color: %s;" ($bg.color | default "transparent") }}
+{{ end }}
+
+{{ if and $bg.gradient_start $bg.gradient_end }}
+  {{ $angle := string $bg.gradient_angle | default "90" }}
+  {{ $style_bg = printf "%sbackground-image: linear-gradient(%sdeg, %s, %s);" $style_bg $angle $bg.gradient_start $bg.gradient_end }}
+{{ end }}
+
+{{ $bg_video := "" }}
+{{ if $bg.video.path }}
+  {{ $bg_video = resources.Get (printf "media/%s" $bg.video.path) }}
+{{ end }}
+{{ $bg_video_class := "" }}
+{{ if $bg.video.flip }}
+  {{ $bg_video_class = "flip" }}
+{{ end }}
+
+{{ if $bg.image.filename }}
+  {{/* See Hugo note on linking assets in styles: https://github.com/gohugoio/hugoThemes#common-permalink-issues */}}
+  {{ $bg_img := resources.Get (printf "media/%s" $bg.image.filename) }}
+  {{ if $bg_img }}
+    {{/* Exception for SVG as Hugo doesn't yet support image processing on SVG. */}}
+    {{ if ne $bg_img.MediaType.SubType "svg" }}
+      {{ $bg_img = $bg_img.Fit "1920x1920 webp" }}
+    {{ end }}
+    {{ $style_bg = printf "%sbackground-image: url('%s');" $style_bg $bg_img.Permalink }}
+  {{ else }}
+    {{ errorf "Couldn't find `%s` in the `assets/media/` folder - please add it." $bg.image }}
+  {{ end }}
+  {{ with $bg.image.size }}
+    {{/* Allow sizes: actual, cover, and contain. */}}
+    {{ $style_bg = printf "%sbackground-size: %s;" $style_bg (replace . "actual" "auto") }}
+  {{ end }}
+  {{ with $bg.image.position }}
+    {{/* Allow valid CSS positions including left, center, and right. */}}
+    {{ $style_bg = printf "%sbackground-position: %s;" $style_bg . }}
+  {{ end }}
+{{ end }}
+
+{{ with $bg.image.filters.brightness }}
+  {{ $style_bg = printf "%sfilter: brightness(%s);" $style_bg (string .) }}
+{{ end }}
+
+{{ with $block.design.spacing.padding }}
+  {{ $style_pad := printf "padding: %s;" (delimit . " ") }}
+  {{ $style = print $style $style_pad }}
+{{ end }}
+
+{{/* Support for clip path (design.clip_path) */}}
+{{ with $block.design.clip_path }}
+  {{ $style_clip_path := printf "clip-path: %s;" . }}
+  {{ $style = print $style $style_clip_path }}
+{{ end }}
+
+{{ with ($block.design.css_style | default $block.Params.advanced.css_style) }}
+  {{ $style = print $style . }}
+{{ end }}
+
+{{/* Fix Hugo's ContentBaseName returning wrong file base name when page section is within a bundle. */}}
+{{ $hash_id := replace $block.File.ContentBaseName "index" (path.Base .File.Dir) }}
+
+{{ $widget_args := dict "wcPage" $page "wcBlock" $block "wcIdentifier" $hash_id }}
+{{ $css_classes := $block.design.css_class | default $block.Params.advanced.css_class | default "" }}
+{{ $extra_attributes := "" }}
+{{ $use_container := true }}
+
+{{/* Special case: Slider widget. */}}
+{{ if in (slice "slider") $block_type }}
+  {{ $css_classes = print $css_classes " carousel slide" }}
+  {{ $extra_attributes = printf "data-ride=\"carousel\" data-interval=\"%s\"" (cond ($block.design.loop | default true) (string $block.design.interval | default "3000") "false") }}
+  {{ $use_container = false }}
+{{ end }}
+
+{{ $widget_class := printf "wg-%s" (replace (replace $block_type "." "-") "_" "-") }}
+
+{{ $widget_config_file := printf "blocks/%s-config.html" $block_type }}
+{{ if templates.Exists $widget_config_file }}
+  {{ $cfg := partial $widget_config_file $widget_args }}
+  {{ $use_container = $cfg.use_container }}
+{{end}}
+
+{{ $columns := $block.design.columns | default "2" }}
+{{ $use_cols := in (slice "collection" "experience" "accomplishments" "contact" "markdown" "tag_cloud" "portfolio") $block_type }}
+
+{{/* Dedicated child div for bg prevents parallax 100% height issue within new CSS grid page wrapper. */}}
+<section id="{{$hash_id}}" class="home-section {{$widget_class}} {{if $bg.text_color_light}}dark{{else if (eq $bg.text_color_light false)}}light{{end}} {{with $css_classes}}{{.}}{{end}}" {{with $style}}style="{{. | safeCSS}}"{{end}} {{print $extra_attributes | safeHTMLAttr}}>
+ <div class="home-section-bg {{if $bg.image}} bg-image{{if ($bg.image.parallax | default true) }} parallax{{end}}{{end}}" {{with $style_bg}}style="{{. | safeCSS}}"{{end}}>
+   {{with $bg_video}}<video class="bg-video {{$bg_video_class}}" playsinline="" preload="auto" loop="" muted autoplay="" tabindex="-1" width="100%" height="100%" src="{{.RelPermalink}}" style="width: 100%; height: 100%; object-fit: cover; object-position: center center; opacity: 1;"></video>{{end}}
+ </div>
+  {{if $use_container}}<div class="container">{{end}}
+
+  {{if $use_cols}}
+    <div class="row  {{if not $block.Title | or (eq $columns "1") }}justify-content-center{{end}}">
+    {{ if $block.Title }}
+      {{ if eq $columns "1" }}
+        <div class="section-heading col-12 mb-3 text-center">
+          {{ with $block.Title }}<h1 class="mb-0">{{ . | markdownify | emojify }}</h1>{{ end }}
+          {{ with $block.Params.subtitle }}<p class="mt-1">{{ . | markdownify | emojify }}</p>{{ end }}
+        </div>
+      {{else}}
+        <div class="section-heading col-12 col-lg-4 mb-3 mb-lg-0 d-flex flex-column align-items-center align-items-lg-start">
+          {{ with $block.Title }}<h1 class="mb-0">{{ . | markdownify | emojify }}</h1>{{ end }}
+          {{ with $block.Params.subtitle }}<p class="mt-1">{{ . | markdownify | emojify }}</p>{{ end }}
+        </div>
+      {{end}}
+    {{end}}
+  {{end}}
+
+    {{ partial $block_path $widget_args }}
+
+  {{if $use_cols}}
+    </div>
+  {{end}}
+
+  {{if $use_container}}</div>{{end}}
+</section>

modules/wowchemy/layouts/partials/landing_page.html

@@ -0,0 +1,8 @@
+{{/* Notify JS that this is a widget page */}}
+<!-- TODO: use data attribute on <body> instead if this is still required -->
+<span class="js-widget-page d-none"></span>
+
+{{/* Load Wowchemy blocks */}}
+{{ range $index, $block := .Params.sections }}
+  {{ partial "functions/parse_block_v2" (dict "page" $ "block" $block) }}
+{{ end }}

starters/notes/content/_index.md

@@ -1,32 +0,0 @@
----
-title: ✍️ Notes
-type: book # Do not modify.
-toc: false
-
-cover:
-  image: covers/nasa-Q1p7bh3SHj8-unsplash.jpg
-  caption: NASA
----
-
-Welcome to the _Notes_ template!
-
-The **Notes** starter template empowers you to easily create  **personal notes** and **knowledge bases** in a future-proof way.
-
-- It is your second brain 🧠, stored in future-proof Markdown files 
-- Supports audio, video, images, math, code, [Mermaid](https://mermaid.live/) diagrams, and [much more](https://wowchemy.com/docs/content/writing-markdown-latex/)
-- Edit your notes online in GitHub, or any Git-connected Markdown app such as [Obsidian](https://obsidian.md/) or [Visual Studio Code](https://vscode.dev/)
-
-## Public vs Private Second Brain
-
-Choose between **publishing and sharing your knowledge online or creating a private second brain**.
-
-To create an **open second brain**, share your notes as a website [by deploying the Note template](https://wowchemy.com/hugo-themes/).
-
-To create a **private second brain** either:
-
-- After deploying your Notes site above, [password protect your online second brain](https://docs.netlify.com/visitor-access/password-protection/) and configure your GitHub repo as **private**
-- [Download this template](https://github.com/wowchemy/hugo-notes-theme) and [run the tool locally](https://wowchemy.com/docs/getting-started/install-hugo-extended/)
-
-## Example notebook
-
-{{< cta cta_text="👉 Check out the Machine Learning notebook" cta_link="machine-learning" >}}