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/background.html
+14 -11
View File
@@ -35,17 +35,16 @@
<div id="hero" class="h-[150px] md:h-[200px]"></div>
{{ end }}
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom"
style="background-image:url({{ .RelPermalink }});">
<div class="fixed inset-x-0 top-0 h-[800px] single_hero_background nozoom">
{{ if or $disableImageOptimization (strings.HasSuffix $featured ".svg")}}
{{ with . }}
<img id="background-image" src="{{ .RelPermalink }}" alt="Background Image" class="absolute inset-0 w-full h-full object-cover">
{{ end }}
{{ else }}
{{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
<img id="background-image" src="{{ .RelPermalink }}" alt="Background Image" class="absolute inset-0 w-full h-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 }});">
{{ end }}
{{ end }}
<div class="absolute inset-0 bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal">
</div>
@@ -57,6 +56,10 @@
<div id="background-blur" class="fixed opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl"></div>
{{ $backgroundBlur := resources.Get "js/background-blur.js" }}
{{ $backgroundBlur = $backgroundBlur | resources.Minify | resources.Fingerprint ($.Site.Params.fingerprintAlgorithm | default "sha512") }}
<script type="text/javascript" src="{{ $backgroundBlur.RelPermalink }}" integrity="{{ $backgroundBlur.Data.Integrity }}" data-target-id="background-blur"></script>
<script type="text/javascript" src="{{ $backgroundBlur.RelPermalink }}" integrity="{{ $backgroundBlur.Data.Integrity }}"
data-target-id="background-blur"
data-image-id="background-image"
data-image-url="{{ .RelPermalink }}"
></script>
{{ end }}
{{- end -}}