dbrun/blowfish
1
0
Fork 0
mirror of https://github.com/nunocoracao/blowfish.git synced 2026-01-30 15:31:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: hide image in a11y mode

Browse Source
This commit is contained in:
ZhenShuo Leo
2025-07-21 16:33:47 +08:00
parent edbace7be0
commit dc778836f1
4 changed files with 73 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
layouts/partials/hero/thumbAndBackground.html
+25 -24
View File
@@ -58,30 +58,29 @@
{{- with $background -}}
{{ if or $disableImageOptimization (strings.HasSuffix . ".svg") }}
{{ with . }}
<div
class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
style="background-image:url({{ .RelPermalink }});">
<div
class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal"></div>
<div
class="absolute inset-0 opacity-30 dark:opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral dark:to-neutral-800 mix-blend-normal"></div>
</div>
<div class="single_hero_background nozoom fixed inset-x-0 top-0 h-[800px]">
{{ if or $disableImageOptimization (strings.HasSuffix . ".svg") }}
{{ with . }}
<img
id="background-image-main"
src="{{ .RelPermalink }}"
alt="Background Image"
class="absolute inset-0 h-full w-full object-cover">
{{ end }}
{{ else }}
{{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
<img
id="background-image-main"
src="{{ .RelPermalink }}"
alt="Background Image"
class="absolute inset-0 h-full w-full object-cover">
{{ end }}
{{ end }}
{{ else }}
{{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
<div
class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
style="background-image:url({{ .RelPermalink }});">
<div
class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal"></div>
<div
class="absolute inset-0 opacity-30 dark:opacity-60 bg-gradient-to-t from-neutral dark:from-neutral-800 to-neutral dark:to-neutral-800 mix-blend-normal"></div>
</div>
{{ end }}
{{ end }}
<div
class="from-neutral absolute inset-0 bg-gradient-to-t to-transparent mix-blend-normal dark:from-neutral-800"></div>
<div
class="from-neutral to-neutral absolute inset-0 bg-gradient-to-t opacity-30 mix-blend-normal dark:from-neutral-800 dark:to-neutral-800 dark:opacity-60"></div>
</div>
{{- end -}}
{{ if $shouldBlur | default false }}
@@ -94,5 +93,7 @@
type="text/javascript"
src="{{ $backgroundBlur.RelPermalink }}"
integrity="{{ $backgroundBlur.Data.Integrity }}"
data-target-id="background-blur"></script>
data-target-id="background-blur"
data-image-id="background-image-main"
{{ with $background }}data-image-url="{{ .RelPermalink }}"{{ end }}></script>
{{ end }}