diff --git a/modules/blox/layouts/_partials/functions/parse_block_v2.html b/modules/blox/layouts/_partials/functions/parse_block_v2.html deleted file mode 100644 index 7373e7f3..00000000 --- a/modules/blox/layouts/_partials/functions/parse_block_v2.html +++ /dev/null @@ -1,377 +0,0 @@ -{{/* Hugo Blox Parser v2 */}} -{{/* Documentation: https://hugoblox.com/blocks/ */}} -{{/* License: https://github.com/HugoBlox/kit/blob/main/LICENSE.md */}} - -{{ $page := .page }} -{{ $block := .block }} - -{{- $block_type := partial "hbx/resolve-block-param" (dict "config" $block "context" "content section") | default "markdown" -}} -{{ $block_type = lower $block_type }} -{{ range $r := site.Data.blox_aliases.renames }} - {{ $block_type = cond (eq $block_type $r.old) $r.new $block_type }} -{{ end }} -{{ $block_path := printf "hbx/blocks/%s/block.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 `%s`. Check the name of the block and ensure it exists in the blox/%s/ directory." $page.File.Path $block_type $block_type $block_path $block_type }} -{{ end }} - -{{/* Mermaid block: 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 }} - -{{/* Gallery block: Workaround to make Hugo's .Page.Store.Set cascade up from page blocks to the page context */}} -{{/* Unfortunately, `.HasShortcode "gallery"` won't accept string input, only page context - so irrelevant here */}} -{{/* Therefore, must do our own search for shortcodes within the `text` string */}} -{{ if (gt (len (findRE `\{\{< gallery` $block.content.text 1)) 0) }} - {{ $page.Page.Store.Set "has_gallery" true }} -{{ end }} - -{{/* Begin widget styling */}} -{{ $bg := $block.design.background }} -{{ $style := "" }} -{{ $style_bg := "" }} - -{{ if $bg.color }} - {{/* Check if color is a map/dict (light/dark structure) or a simple string */}} - {{ $color_type := printf "%T" $bg.color }} - {{ if eq $color_type "map[string]interface {}" }} - {{/* New nested light/dark structure */}} - {{ if and $bg.color.light $bg.color.dark }} - {{ $light_color := $bg.color.light }} - {{ $dark_color := $bg.color.dark }} - - {{/* Convert light color */}} - {{ if not (or (hasPrefix $light_color "var(") (hasPrefix $light_color "rgb(") (hasPrefix $light_color "#") (eq $light_color "transparent")) }} - {{ if hasPrefix $light_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $light_color }} - {{ $light_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $light_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $light_color }} - {{ $light_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $light_color "-" }} - {{ $parts := split $light_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $light_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{/* Convert dark color */}} - {{ if not (or (hasPrefix $dark_color "var(") (hasPrefix $dark_color "rgb(") (hasPrefix $dark_color "#") (eq $dark_color "transparent")) }} - {{ if hasPrefix $dark_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $dark_color }} - {{ $dark_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $dark_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $dark_color }} - {{ $dark_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $dark_color "-" }} - {{ $parts := split $dark_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $dark_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{ $style_bg = printf "background-color: %s;" $light_color }} - {{ $style_bg = printf "%s--dark-bg-color: %s;" $style_bg $dark_color }} - {{ else if $bg.color.light }} - {{ $light_color := $bg.color.light }} - - {{/* Convert light color */}} - {{ if not (or (hasPrefix $light_color "var(") (hasPrefix $light_color "rgb(") (hasPrefix $light_color "#") (eq $light_color "transparent")) }} - {{ if hasPrefix $light_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $light_color }} - {{ $light_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $light_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $light_color }} - {{ $light_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $light_color "-" }} - {{ $parts := split $light_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $light_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{ $style_bg = printf "background-color: %s;" $light_color }} - {{ else if $bg.color.dark }} - {{ $dark_color := $bg.color.dark }} - - {{/* Convert dark color */}} - {{ if not (or (hasPrefix $dark_color "var(") (hasPrefix $dark_color "rgb(") (hasPrefix $dark_color "#") (eq $dark_color "transparent")) }} - {{ if hasPrefix $dark_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $dark_color }} - {{ $dark_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $dark_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $dark_color }} - {{ $dark_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $dark_color "-" }} - {{ $parts := split $dark_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $dark_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{ $style_bg = printf "--dark-bg-color: %s; background-color: var(--dark-bg-color);" $dark_color }} - {{ end }} - {{ else }} - {{/* Legacy single color support - backwards compatible */}} - {{ $bg_color := $bg.color }} - - {{/* Convert single color */}} - {{ if not (or (hasPrefix $bg_color "var(") (hasPrefix $bg_color "rgb(") (hasPrefix $bg_color "#") (eq $bg_color "transparent")) }} - {{ if hasPrefix $bg_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $bg_color }} - {{ $bg_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $bg_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $bg_color }} - {{ $bg_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $bg_color "-" }} - {{ $parts := split $bg_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $bg_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{ $style_bg = printf "background-color: %s;" $bg_color }} - {{ end }} -{{ end }} - -{{/* Modern layered background support for 2025 glassmorphism */}} -{{ $background_layers := slice }} -{{ $gradient_layer := "" }} - -{{/* Process gradients first but don't add to layers yet */}} -{{/* Support legacy gradient syntax */}} -{{ if and $bg.gradient_start $bg.gradient_end }} - {{ $angle := string $bg.gradient_angle | default "90" }} - {{ $gradient_layer = printf "linear-gradient(%sdeg, %s, %s)" $angle $bg.gradient_start $bg.gradient_end }} -{{ end }} - -{{/* Support modern gradient syntax for 2025 */}} -{{ if and $bg.gradient.start $bg.gradient.end }} - {{ $angle := string $bg.gradient.direction | default "135" }} - {{ $start_color := $bg.gradient.start }} - {{ $end_color := $bg.gradient.end }} - - {{/* Convert Tailwind color names to CSS custom properties */}} - {{ if not (or (hasPrefix $start_color "var(") (hasPrefix $start_color "rgb(") (hasPrefix $start_color "#")) }} - {{ if hasPrefix $start_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $start_color }} - {{ $start_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $start_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $start_color }} - {{ $start_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $start_color "-" }} - {{ $parts := split $start_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $start_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{ if not (or (hasPrefix $end_color "var(") (hasPrefix $end_color "rgb(") (hasPrefix $end_color "#")) }} - {{ if hasPrefix $end_color "primary-" }} - {{ $shade := strings.TrimPrefix "primary-" $end_color }} - {{ $end_color = printf "var(--color-primary-%s)" $shade }} - {{ else if hasPrefix $end_color "secondary-" }} - {{ $shade := strings.TrimPrefix "secondary-" $end_color }} - {{ $end_color = printf "var(--color-secondary-%s)" $shade }} - {{ else if strings.Contains $end_color "-" }} - {{ $parts := split $end_color "-" }} - {{ if eq (len $parts) 2 }} - {{ $color := index $parts 0 }} - {{ $shade := index $parts 1 }} - {{ $end_color = printf "var(--color-%s-%s)" $color $shade }} - {{ end }} - {{ end }} - {{ end }} - - {{ $gradient_layer = printf "linear-gradient(%sdeg, %s, %s)" $angle $start_color $end_color }} -{{ end }} - -{{ $bg_video := "" }} -{{ $bg_video_class := "" }} -{{ if $bg.video.filename }} - {{ $bg_video = resources.Get (printf "media/%s" $bg.video.filename) }} - {{ if $bg.video.flip }} - {{ $bg_video_class = "flip" }} - {{ end }} -{{ 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 }} - - {{/* Add image layer to background layers for glassmorphism support */}} - {{ $image_layer := printf "url('%s')" $bg_img.Permalink }} - {{ $background_layers = $background_layers | append $image_layer }} - - {{/* Background properties will be set in the multi-layer section below */}} - {{ else }} - {{ errorf "Couldn't find `%s` in the `assets/media/` folder - please add it." $bg.image.filename }} - {{ end }} -{{ end }} - -{{/* Combine all background layers for 2025 glassmorphism effects */}} -{{/* Layer order: image (top) comes first, then gradient (bottom) */}} -{{ if or $background_layers $gradient_layer }} - {{ $all_layers := $background_layers }} - {{ if $gradient_layer }} - {{ $all_layers = $all_layers | append $gradient_layer }} - {{ end }} - {{ if $all_layers }} - {{ $combined_backgrounds := delimit $all_layers ", " }} - {{ $style_bg = printf "%sbackground-image: %s;" $style_bg $combined_backgrounds }} - - {{/* Build multi-layer background properties */}} - {{ $layer_count := len $all_layers }} - - {{/* Generate properties for each layer */}} - {{ if gt $layer_count 1 }} - {{/* Multiple layers: image + gradient */}} - {{ $img_size := $bg.image.size | default "100px" }} - {{ $img_position := $bg.image.position | default "center" }} - {{ $img_repeat := $bg.image.repeat | default "repeat" }} - - {{/* Handle 'repeat' in position */}} - {{ if eq $img_position "repeat" }} - {{ $img_repeat = "repeat" }} - {{ $img_position = "center" }} - {{ end }} - - {{/* Combine properties for both layers */}} - {{ $style_bg = printf "%sbackground-size: %s, cover !important;" $style_bg $img_size }} - {{ $style_bg = printf "%sbackground-position: %s, center !important;" $style_bg $img_position }} - {{ $style_bg = printf "%sbackground-repeat: %s, no-repeat !important;" $style_bg $img_repeat }} - {{ else }} - {{/* Single layer: apply properties normally */}} - {{ if $background_layers }} - {{ with $bg.image.size }} - {{ $style_bg = printf "%sbackground-size: %s !important;" $style_bg . }} - {{ end }} - {{ with $bg.image.position }} - {{ if eq . "repeat" }} - {{ $style_bg = printf "%sbackground-position: center !important;" $style_bg }} - {{ $style_bg = printf "%sbackground-repeat: repeat !important;" $style_bg }} - {{ else }} - {{ $style_bg = printf "%sbackground-position: %s !important;" $style_bg . }} - {{ end }} - {{ end }} - {{ end }} - {{ end }} - {{ 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 }} -{{ else }} - {{ with $page.Params.design.spacing }} - {{/* Fallback to default section spacing setting */}} - {{ $style_pad := printf "padding: %s 0 %s 0;" . . }} - {{ $style = print $style $style_pad }} - {{ end }} -{{ 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 }} - {{ $style = print $style . }} -{{ end }} - - - -{{/* Fix Hugo's ContentBaseName returning wrong file base name when page section is within a bundle. */}} -{{ $hash_id := $block.id | default (printf "section-%s" (replace $block_type "." "-")) }} - -{{ $widget_args := dict "wcPage" $page "wcBlock" $block "wcIdentifier" $hash_id }} -{{ $css_classes := $block.design.css_class | default "" }} -{{ $extra_attributes := "" }} -{{ $use_container := false }} -{{ $columns := $block.design.columns | default "1" }} -{{/* $use_cols := in (slice "collection" "experience" "accomplishments" "contact" "markdown" "tag_cloud" "portfolio" "skills") $block_type */}} -{{ $use_cols := false }} - -{{/* 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 "blox-%s" (replace (replace $block_type "." "-") "_" "-") }} - -{{/* Now loaded in `init.html` */}} -{{/* - {{ $widget_config_file := printf "blox/%s/config.html" $block_type }} - {{ if templates.Exists (printf "_partials/%s" $widget_config_file) }} - {{ $cfg := partial $widget_config_file $widget_args }} - {{ with $cfg.use_container }}{{ $use_container = . }}{{ end }} - {{ with $cfg.inject_section_heading }}{{ $use_cols = . }}{{ end }} - {{end}} -*/}} - -{{/* Extract background-specific CSS classes */}} -{{ $bg_css_classes := $bg.css_class | default "" }} - -{{/* Dedicated child div for bg prevents parallax 100% height issue within new CSS grid page wrapper. */}} -
-
- {{with $bg_video}}{{end}} -
- {{if $use_container}}
{{end}} - - {{if $use_cols}} -
- {{ if $block.content.title }} - {{ if eq $columns "1" }} -
- {{ with $block.content.title }}

{{ . | markdownify | emojify }}

{{ end }} - {{ with $block.content.subtitle }}

{{ . | markdownify | emojify }}

{{ end }} -
- {{else}} -
- {{ with $block.content.title }}

{{ . | markdownify | emojify }}

{{ end }} - {{ with $block.content.subtitle }}

{{ . | markdownify | emojify }}

{{ end }} -
- {{end}} - {{end}} - {{end}} - - {{ partial $block_path $widget_args }} - - {{if $use_cols}} -
- {{end}} - - {{if $use_container}}
{{end}} -
diff --git a/modules/blox/layouts/_partials/functions/parse_block_v3.html b/modules/blox/layouts/_partials/functions/parse_block_v3.html index 97a82f7b..fce5c81a 100644 --- a/modules/blox/layouts/_partials/functions/parse_block_v3.html +++ b/modules/blox/layouts/_partials/functions/parse_block_v3.html @@ -179,6 +179,8 @@ {{ end }} {{ $image_layer := printf "url('%s')" $bg_img.RelPermalink }} {{ $background_layers = $background_layers | append $image_layer }} + {{ else }} + {{ errorf "Couldn't find `%s` in the `assets/media/` folder - please add it." $bg.image.filename }} {{ end }} {{ end }} @@ -190,6 +192,60 @@ {{ if $all_layers }} {{ $combined_backgrounds := delimit $all_layers ", " }} {{ $style_bg = printf "%sbackground-image: %s;" $style_bg $combined_backgrounds }} + + {{/* Background image size/position/repeat properties */}} + {{ $layer_count := len $all_layers }} + {{ if gt $layer_count 1 }} + {{/* Multiple layers: image + gradient */}} + {{ $img_size := $bg.image.size | default "cover" }} + {{ $img_position := $bg.image.position | default "center" }} + {{ $img_repeat := $bg.image.repeat | default "no-repeat" }} + {{ if eq $img_position "repeat" }} + {{ $img_repeat = "repeat" }} + {{ $img_position = "center" }} + {{ end }} + {{ $style_bg = printf "%sbackground-size: %s, cover;" $style_bg $img_size }} + {{ $style_bg = printf "%sbackground-position: %s, center;" $style_bg $img_position }} + {{ $style_bg = printf "%sbackground-repeat: %s, no-repeat;" $style_bg $img_repeat }} + {{ else }} + {{/* Single layer */}} + {{ if $background_layers }} + {{ with $bg.image.size }} + {{ $style_bg = printf "%sbackground-size: %s;" $style_bg . }} + {{ end }} + {{ with $bg.image.position }} + {{ if eq . "repeat" }} + {{ $style_bg = printf "%sbackground-position: center;" $style_bg }} + {{ $style_bg = printf "%sbackground-repeat: repeat;" $style_bg }} + {{ else }} + {{ $style_bg = printf "%sbackground-position: %s;" $style_bg . }} + {{ end }} + {{ end }} + {{ end }} + {{ end }} + {{ end }} +{{ end }} + +{{/* Background image filters: brightness, blur, contrast, saturate, grayscale */}} +{{ with $bg.image.filters }} + {{ $filter_parts := slice }} + {{ with .brightness }} + {{ $filter_parts = $filter_parts | append (printf "brightness(%s)" (string .)) }} + {{ end }} + {{ with .blur }} + {{ $filter_parts = $filter_parts | append (printf "blur(%s)" (string .)) }} + {{ end }} + {{ with .contrast }} + {{ $filter_parts = $filter_parts | append (printf "contrast(%s)" (string .)) }} + {{ end }} + {{ with .saturate }} + {{ $filter_parts = $filter_parts | append (printf "saturate(%s)" (string .)) }} + {{ end }} + {{ with .grayscale }} + {{ $filter_parts = $filter_parts | append (printf "grayscale(%s)" (string .)) }} + {{ end }} + {{ if $filter_parts }} + {{ $style_bg = printf "%sfilter: %s;" $style_bg (delimit $filter_parts " ") }} {{ end }} {{ end }} @@ -202,17 +258,25 @@ {{ $style = print $style . }} {{ end }} +{{/* Support for clip path (design.clip_path) */}} +{{ with $block.design.clip_path }} + {{ $style = printf "%sclip-path: %s;" $style . }} +{{ end }} + {{ $hash_id := $block.id | default (printf "section-%s" (replace $block_type "." "-")) }} {{ $css_classes := $block.design.css_class | default "" }} {{ $widget_class := printf "blox-%s" (replace (replace $block_type "." "-") "_" "-") }} +{{/* Extract background-specific CSS classes */}} +{{ $bg_css_classes := $bg.css_class | default "" }} + {{/* Route to appropriate handler */}} {{ if $is_preact }} {{/* Render Preact block with styling wrapper */}}
{{/* Gradient Mesh Background */}} {{ if $has_gradient_mesh }}{{ $gradient_mesh_html }}{{ end }} -
+
{{with $bg_video}}{{end}}
{{/* Use generic Preact wrapper for content */}} @@ -240,7 +304,7 @@
{{/* Gradient Mesh Background */}} {{ if $has_gradient_mesh }}{{ $gradient_mesh_html }}{{ end }} -
+
{{with $bg_video}}{{end}}
{{ partial $block_path $widget_args }}