Added necessary variables for correct styling of the custom footer in some cases

This commit is contained in:
Attila Greguss 2024-12-18 14:40:29 +00:00
parent 1a5a34b00c
commit e3d29ca81a
2 changed files with 10 additions and 3 deletions

View File

@ -70,6 +70,11 @@ You can add a custom section the footer between the language/theme buttons and t
<!-- Your footer element here -->
```
Available variables in the footer section are:
- `.aboveVisible`: `true` if the Language or Theme button(s) are visible above the footer along with a horizontal separator.
- `.belowVisible`: `true` if the Copyright or PoweredBy text are visible below the footer.
_Note: The custom footer inherits the default footer background color text color and the `width` setting in `hugo.yaml#footer` section._
## Custom Layouts

View File

@ -1,5 +1,7 @@
{{- $enableFooterSwitches := .Scratch.Get "enableFooterSwitches" | default false -}}
{{- $displayThemeToggle := site.Params.theme.displayToggle | default true -}}
{{- $footerSwitchesVisible := and $enableFooterSwitches (or hugo.IsMultilingual $displayThemeToggle) -}}
{{- $copyrightSectionVisible := or (.Site.Params.footer.displayPoweredBy | default true) .Site.Params.footer.displayCopyright -}}
{{- $copyright := (T "copyright") | default "© 2024 Hextra." -}}
{{- $poweredBy := (T "poweredBy") | default "Powered by Hextra" -}}
@ -15,7 +17,7 @@
<footer class="hextra-footer hx-bg-gray-100 hx-pb-[env(safe-area-inset-bottom)] dark:hx-bg-neutral-900 print:hx-bg-transparent">
{{- if and $enableFooterSwitches (or hugo.IsMultilingual $displayThemeToggle) -}}
{{- if $footerSwitchesVisible -}}
<div class="hx-mx-auto hx-flex hx-gap-2 hx-py-2 hx-px-4 {{ $footerWidth }}">
{{- partial "language-switch.html" (dict "context" .) -}}
{{- with $displayThemeToggle }}{{ partial "theme-toggle.html" }}{{ end -}}
@ -27,9 +29,9 @@
<div
class="{{ $footerWidth }} hx-pl-[max(env(safe-area-inset-left),0rem)] hx-pr-[max(env(safe-area-inset-right),0rem)] hx-text-gray-600 dark:hx-text-gray-400"
>
{{ partial "custom/footer.html" . }}
{{ partial "custom/footer.html" (dict "context" . "aboveVisible" $footerSwitchesVisible "belowVisible" $copyrightSectionVisible ) }}
</div>
{{- if or (.Site.Params.footer.displayPoweredBy | default true) .Site.Params.footer.displayCopyright}}
{{- if $copyrightSectionVisible -}}
<div
class="{{ $footerWidth }} hx-mx-auto hx-flex hx-justify-center hx-py-12 hx-pl-[max(env(safe-area-inset-left),1.5rem)] hx-pr-[max(env(safe-area-inset-right),1.5rem)] hx-text-gray-600 dark:hx-text-gray-400 md:hx-justify-start"
>