Compare commits

..

4 Commits

Author SHA1 Message Date
fce3db4812 Merge 27a70e4c12 into 655148f329 2024-12-24 09:24:51 +03:30
27a70e4c12 Cleanup 2024-04-15 18:53:50 -06:00
aeb0cad979 Special case for Chinese 2024-04-15 18:53:10 -06:00
fd38dd116f Update giscus.html 2024-04-15 15:40:30 -06:00
6 changed files with 33 additions and 47 deletions

View File

@ -119,7 +119,6 @@ The following classes can be used to customize various parts of the theme.
#### Footer #### Footer
- `hextra-footer` - The footer element - `hextra-footer` - The footer element
- `hextra-custom-footer` - The custom footer section container
#### Search #### Search
@ -185,21 +184,6 @@ You may add custom scripts to the end of the head for every page by adding the f
layouts/partials/custom/head-end.html layouts/partials/custom/head-end.html
``` ```
## Custom Footer Section
You can add a custom section the footer between the language/theme buttons and the "Copyright"/"Powered By" section by creating a file `layouts/partials/custom/footer.html` in your site.
```html {filename="layouts/partials/custom/footer.html"}
<!-- Your footer element here -->
```
Available variables in the footer section are:
- `.switchesVisible`: `true` if the language/theme button(s) are visible above the footer along with a horizontal separator.
- `.copyrightVisible`: `true` if the "Copyright" and "Powered By" text are visible at the bottom of 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 ## Custom Layouts
The layouts of the theme can be overridden by creating a file with the same name in the `layouts` directory of your site. The layouts of the theme can be overridden by creating a file with the same name in the `layouts` directory of your site.

View File

@ -173,4 +173,3 @@ params:
# emitMetadata: 0 # emitMetadata: 0
# inputPosition: top # inputPosition: top
# lang: en # lang: en
# theme: noborder_dark

View File

@ -228,7 +228,6 @@
"hextra-code-block", "hextra-code-block",
"hextra-code-copy-btn", "hextra-code-copy-btn",
"hextra-code-copy-btn-container", "hextra-code-copy-btn-container",
"hextra-custom-footer",
"hextra-feature-card", "hextra-feature-card",
"hextra-feature-grid", "hextra-feature-grid",
"hextra-filetree", "hextra-filetree",

View File

@ -1,4 +1,26 @@
{{- $lang := site.Language.LanguageCode | default `en` -}} {{ $default_chinese := "zh-CN" }}
{{ $sl := site.Language }}
{{ $giscus_lang := $sl.Lang | default `en` }}
{{/*
Special case for Chinese.
Giscus uses the geophraphical language code for these.
See: https://github.com/giscus/giscus/tree/main/locales
*/}}
{{ if eq $giscus_lang "zh" }}
{{/* Create a code formatted for Giscus: zh-CN or zn-TW. */}}
{{ $code := lower $sl.LanguageCode }}
{{ if (hasSuffix $code "-cn") }}
{{ $giscus_lang = "zh-CN" }}
{{ else if (hasSuffix $code "-tw") }}
{{ $giscus_lang = "zh-TW" }}
{{ else }}
{{ $giscus_lang = $default_chinese }}
{{ end }}
{{ end }}
{{- with site.Params.comments.giscus -}} {{- with site.Params.comments.giscus -}}
<script> <script>
@ -8,17 +30,8 @@
* This solution was created with reference to: * This solution was created with reference to:
* https://github.com/giscus/giscus/issues/336#issuecomment-1214366281 * https://github.com/giscus/giscus/issues/336#issuecomment-1214366281
*/ */
function getHugoTheme() {
return localStorage.getItem("color-theme");
}
function getGiscusTheme() { function getGiscusTheme() {
let giscusTheme = "{{ (string .theme) | default `light` }}"; return localStorage.getItem("color-theme");
if(getHugoTheme() == 'light') {
return giscusTheme.replace('dark', 'light');
} else {
return giscusTheme.replace('light', 'dark');
}
} }
function setGiscusTheme() { function setGiscusTheme() {
@ -47,7 +60,7 @@
"data-emit-metadata": "{{ (string .emitMetadata) | default 0 }}", "data-emit-metadata": "{{ (string .emitMetadata) | default 0 }}",
"data-input-position": "{{ .inputPosition | default `top` }}", "data-input-position": "{{ .inputPosition | default `top` }}",
"data-theme": getGiscusTheme(), "data-theme": getGiscusTheme(),
"data-lang": "{{ .lang | default $lang }}", "data-lang": "{{ .lang | default $giscus_lang }}",
"crossorigin": "anonymous", "crossorigin": "anonymous",
"async": "", "async": "",
}; };

View File

@ -1,7 +1,5 @@
{{- $enableFooterSwitches := .Scratch.Get "enableFooterSwitches" | default false -}} {{- $enableFooterSwitches := .Scratch.Get "enableFooterSwitches" | default false -}}
{{- $displayThemeToggle := site.Params.theme.displayToggle | default true -}} {{- $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." -}} {{- $copyright := (T "copyright") | default "© 2024 Hextra." -}}
{{- $poweredBy := (T "poweredBy") | default "Powered by Hextra" -}} {{- $poweredBy := (T "poweredBy") | default "Powered by Hextra" -}}
@ -17,7 +15,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"> <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 $footerSwitchesVisible -}} {{- if and $enableFooterSwitches (or hugo.IsMultilingual $displayThemeToggle) -}}
<div class="hx-mx-auto hx-flex hx-gap-2 hx-py-2 hx-px-4 {{ $footerWidth }}"> <div class="hx-mx-auto hx-flex hx-gap-2 hx-py-2 hx-px-4 {{ $footerWidth }}">
{{- partial "language-switch.html" (dict "context" .) -}} {{- partial "language-switch.html" (dict "context" .) -}}
{{- with $displayThemeToggle }}{{ partial "theme-toggle.html" }}{{ end -}} {{- with $displayThemeToggle }}{{ partial "theme-toggle.html" }}{{ end -}}
@ -26,21 +24,14 @@
<hr class="dark:hx-border-neutral-800" /> <hr class="dark:hx-border-neutral-800" />
{{- end -}} {{- end -}}
{{- end -}} {{- end -}}
<div
class="hextra-custom-footer {{ $footerWidth }} 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"
>
{{- partial "custom/footer.html" (dict "context" . "switchesVisible" $footerSwitchesVisible "copyrightVisible" $copyrightSectionVisible) -}}
</div>
{{- if $copyrightSectionVisible -}}
<div <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" 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"
> >
<div class="hx-flex hx-w-full hx-flex-col hx-items-center sm:hx-items-start"> <div class="hx-flex hx-w-full hx-flex-col hx-items-center sm:hx-items-start">
{{- if (.Site.Params.footer.displayPoweredBy | default true) }}<div class="hx-font-semibold">{{ template "theme-credit" $poweredBy }}</div>{{- end -}} {{- if (.Site.Params.footer.displayPoweredBy | default true) }}<div class="hx-font-semibold">{{ template "theme-credit" $poweredBy }}</div>{{ end }}
{{- if .Site.Params.footer.displayCopyright }}<div class="hx-mt-6 hx-text-xs">{{ $copyright | markdownify }}</div>{{- end -}} {{- if .Site.Params.footer.displayCopyright }}<div class="hx-mt-6 hx-text-xs">{{ $copyright | markdownify }}</div>{{ end }}
</div> </div>
</div> </div>
{{- end -}}
</footer> </footer>
{{- define "theme-credit" -}} {{- define "theme-credit" -}}