ananke/layouts/partials/site-header.html
Cyrill Raccaud 5a1776455f
complete the feature for the cover dimming class in page (#732)
- feature already present for site
- add info for the param to the example

Like https://github.com/theNewDynamic/gohugo-theme-ananke/pull/702, this
PR wants to add the cover class to the page as well, but adds also the
documentation to the example and allows both for page params and site
params.

Solves https://github.com/theNewDynamic/gohugo-theme-ananke/issues/696
in a proper way for site and page with fallback and documentation in the
example.

Default:

<img width="1512" alt="Bildschirmfoto 2024-10-12 um 14 47 12"
src="https://github.com/user-attachments/assets/fbbec618-2045-4be7-94d7-09169a253a96">

Same as default `cover_dimming_class = bg-black-60`:

<img width="1512" alt="Bildschirmfoto 2024-10-12 um 14 47 12"
src="https://github.com/user-attachments/assets/fbbec618-2045-4be7-94d7-09169a253a96">

`cover_dimming_class = bg-black-20`:

<img width="1512" alt="Bildschirmfoto 2024-10-12 um 14 47 20"
src="https://github.com/user-attachments/assets/7bf64564-4f6d-42c9-bed1-83b426d487ae">

`cover_dimming_class = bg-black-90`:

<img width="1512" alt="Bildschirmfoto 2024-10-12 um 14 47 34"
src="https://github.com/user-attachments/assets/354a0e49-7446-46d7-adc1-f8e4ecee3831">


**Closing issues**

closes #702
closes #696

---------

Signed-off-by: Patrick Kollitsch <patrick@davids-neighbour.com>
Co-authored-by: Patrick Kollitsch <patrick@davids-neighbour.com>
2024-10-21 15:48:03 +07:00

38 lines
1.5 KiB
HTML

{{ $featured_image := partial "func/GetFeaturedImage.html" . }}
{{ if $featured_image }}
{{/* Trimming the slash and adding absURL make sure the image works no matter where our site lives */}}
{{ $featured_image_class := site.Params.featured_image_class | default "cover bg-top" }}
<header class="{{ $featured_image_class }}" style="background-image: url('{{ $featured_image }}');">
{{ $cover_dimming_class := site.Params.cover_dimming_class | default "bg-black-60" }}
<div class="{{ $cover_dimming_class }}">
{{ partial "site-navigation.html" .}}
<div class="tc-l pv4 pv6-l ph3 ph4-ns">
<h1 class="f2 f-subheadline-l fw2 white-90 mb0 lh-title">
{{ .Title | default .Site.Title }}
</h1>
{{ with .Params.description }}
<h2 class="fw1 f5 f3-l white-80 measure-wide-l center mt3">
{{ . }}
</h2>
{{ end }}
</div>
</div>
</header>
{{ else }}
<header>
<div class="pb3-m pb6-l {{ .Site.Params.background_color_class | default "bg-black" }}">
{{ partial "site-navigation.html" . }}
<div class="tc-l pv3 ph3 ph4-ns">
<h1 class="f2 f-subheadline-l fw2 light-silver mb0 lh-title">
{{ .Title | default .Site.Title }}
</h1>
{{ with .Params.description }}
<h2 class="fw1 f5 f3-l white-80 measure-wide-l center lh-copy mt3 mb4">
{{ . }}
</h2>
{{ end }}
</div>
</div>
</header>
{{ end }}