blogs/FixIt
1
0
Fork 0
mirror of https://github.com/hugo-fixit/FixIt.git synced 2026-08-24 15:28:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

🐛 Fix: add a option "Responsive" for plugin image fixed #369

Browse Source
This commit is contained in:
Cell
2023-11-04 23:59:00 +08:00
parent 6682d38af2
commit 4fb9711fa6
6 changed files with 52 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/_page/_single.scss
+1 -1
View File
@@ -290,7 +290,7 @@
height: auto;
}
&:is([loading='lazy']):not([data-lazyloaded]) {
&[loading='lazy'][srcset]:not([data-lazyloaded]) {
&:not(.suffix-invalid__small) {
width: var(--width-small, var(--width));
aspect-ratio: var(--aspect-ratio-small, var(--aspect-ratio));
docs
+1 -1
Submodule docs updated: 8a9b75a1c1...2f0c65c6b5
layouts/_default/_markup/render-image.html
+2 -2
View File
@@ -1,11 +1,11 @@
{{- if .Title | and .Text -}}
<figure>
{{- dict "Src" .Destination "Alt" .Text "Caption" .Text "Title" .Title "Linked" true "Resources" .Page.Resources "Params" .Page.Params | partial "plugin/image.html" -}}
{{- dict "Src" .Destination "Alt" .Text "Caption" .Text "Title" .Title "Linked" true "Resources" .Page.Resources "Params" .Page.Params "Responsive" true | partial "plugin/image.html" -}}
<figcaption class="image-caption">
{{- .Text | safeHTML -}}
</figcaption>
</figure>
{{- else -}}
{{- $linked := (eq .Page.Site.Params.page.lightgallery "force") | or (eq .Page.Params.lightgallery "force") | or (ne .Title "") -}}
{{- dict "Src" .Destination "Alt" .Text "Title" .Title "Linked" $linked "Resources" .Page.Resources "Params" .Page.Params | partial "plugin/image.html" -}}
{{- dict "Src" .Destination "Alt" .Text "Title" .Title "Linked" $linked "Resources" .Page.Resources "Params" .Page.Params "Responsive" true | partial "plugin/image.html" -}}
{{- end -}}
layouts/friends/single.html
+1 -1
View File
@@ -16,7 +16,7 @@
{{ range $index, $friend := .Site.Data.friends }}
<a class="friend-link" title="{{ $friend.description }}" href="{{ $friend.url | safeURL }}" rel="external noopener noreferrer" target="_blank">
{{ if $friend.avatar }}
{{- dict "Src" $friend.avatar "Alt" $friend.nickname "Class" "friend-avatar" "Resources" $.Resources | partial "plugin/image.html" -}}
{{- dict "Src" $friend.avatar "Alt" $friend.nickname "Class" "friend-avatar" "Resources" $.Resources "Params" $.Params | partial "plugin/image.html" -}}
{{ else }}
<svg class="friend-avatar" aria-hidden="true">
<use xlink:href="#icon-{{ add 1 $index }}"></use>
layouts/partials/plugin/image.html
+46 -39
View File
@@ -15,46 +15,57 @@
{{- $src = .RelPermalink -}}
{{- end -}}
{{- /* only available for image resources that are raster images */ -}}
{{- if (eq .ResourceType "image") | and $suffixValid -}}
{{- if (eq .ResourceType "image") | and $suffixValid | and $.Responsive -}}
{{- $style = printf "--width: %vpx;--aspect-ratio: %v / %v;" .Width .Width .Height | safeHTMLAttr -}}
{{- end -}}
{{- end -}}
{{- /* handle for small size image */ -}}
{{- $srcSmall := .SrcSmall | default $src -}}
{{- $suffixValidSmall := dict "Path" $srcSmall "Suffixes" $suffixList | partial "function/suffix-validation.html" -}}
{{- with dict "Path" .SrcSmall "Resources" .Resources "CacheRemoteImages" $cacheRemoteImages.enable | partial "function/resource.html" -}}
{{- $url := urls.Parse $.SrcSmall -}}
{{- if not $url.Host | or $cacheRemoteImages.replace -}}
{{- $srcSmall = .RelPermalink -}}
{{- end -}}
{{- if (eq .ResourceType "image") | and $suffixValidSmall -}}
{{- $style = printf "%v--width-small: %vpx;--aspect-ratio-small: %v / %v;" $style .Width .Width .Height | safeHTMLAttr -}}
{{- end -}}
{{- end -}}
{{- /* handle for large size image */ -}}
{{- $srcMedium := $src -}}
{{- $srcLarge := .SrcLarge | default $src -}}
{{- $suffixValidLarge := dict "Path" $srcLarge "Suffixes" $suffixList | partial "function/suffix-validation.html" -}}
{{- with dict "Path" .SrcLarge "Resources" .Resources "CacheRemoteImages" $cacheRemoteImages.enable | partial "function/resource.html" -}}
{{- $url := urls.Parse $.SrcLarge -}}
{{- if not $url.Host | or $cacheRemoteImages.replace -}}
{{- $srcLarge = .RelPermalink -}}
{{- end -}}
{{- if (eq .ResourceType "image") | and $suffixValidLarge -}}
{{- $style = printf "%v--width-large: %vpx;--aspect-ratio-large: %v / %v;" $style .Width .Width .Height | safeHTMLAttr -}}
{{- end -}}
{{- end -}}
{{- /* handle for invalid suffix */ -}}
{{- if not $suffixValid | and $src -}}
{{- $class = printf "%v suffix-invalid" $class -}}
{{- end -}}
{{- if not $suffixValidSmall | and $srcSmall -}}
{{- $class = printf "%v suffix-invalid__small" $class -}}
{{- end -}}
{{- if not $suffixValidLarge | and $srcLarge -}}
{{- $class = printf "%v suffix-invalid__large" $class -}}
{{- if .Responsive }}
{{- /* handle for small size image */ -}}
{{- $suffixValidSmall := dict "Path" $srcSmall "Suffixes" $suffixList | partial "function/suffix-validation.html" -}}
{{- with dict "Path" .SrcSmall "Resources" .Resources "CacheRemoteImages" $cacheRemoteImages.enable | partial "function/resource.html" -}}
{{- $url := urls.Parse $.SrcSmall -}}
{{- if not $url.Host | or $cacheRemoteImages.replace -}}
{{- $srcSmall = .RelPermalink -}}
{{- end -}}
{{- if (eq .ResourceType "image") | and $suffixValidSmall -}}
{{- $style = printf "%v--width-small: %vpx;--aspect-ratio-small: %v / %v;" $style .Width .Width .Height | safeHTMLAttr -}}
{{- end -}}
{{- end -}}
{{- /* handle for large size image */ -}}
{{- $suffixValidLarge := dict "Path" $srcLarge "Suffixes" $suffixList | partial "function/suffix-validation.html" -}}
{{- with dict "Path" .SrcLarge "Resources" .Resources "CacheRemoteImages" $cacheRemoteImages.enable | partial "function/resource.html" -}}
{{- $url := urls.Parse $.SrcLarge -}}
{{- if not $url.Host | or $cacheRemoteImages.replace -}}
{{- $srcLarge = .RelPermalink -}}
{{- end -}}
{{- if (eq .ResourceType "image") | and $suffixValidLarge -}}
{{- $style = printf "%v--width-large: %vpx;--aspect-ratio-large: %v / %v;" $style .Width .Width .Height | safeHTMLAttr -}}
{{- end -}}
{{- end -}}
{{- /* handle for invalid suffix */ -}}
{{- if not $suffixValid | and $src -}}
{{- $class = printf "%v suffix-invalid" $class -}}
{{- end -}}
{{- if not $suffixValidSmall | and $srcSmall -}}
{{- $class = printf "%v suffix-invalid__small" $class -}}
{{- end -}}
{{- if not $suffixValidLarge | and $srcLarge -}}
{{- $class = printf "%v suffix-invalid__large" $class -}}
{{- end -}}
{{- /* set image srcset */ -}}
{{- if (eq $src $srcSmall) | and (eq $src $srcLarge) -}}
{{- $srcSmall = printf (cond (strings.Contains $srcSmall "?") "%v&size=small" "%v?size=small") $srcSmall -}}
{{- $srcMedium = printf (cond (strings.Contains $srcMedium "?") "%v&size=medium" "%v?size=medium") $srcMedium -}}
{{- $srcLarge = printf (cond (strings.Contains $srcLarge "?") "%v&size=large" "%v?size=large") $srcLarge -}}
{{- end -}}
{{- end -}}
{{- /* set image alt and caption */ -}}
@@ -71,16 +82,12 @@
{{- $style = printf " style=\"%vbackground: url(%v) no-repeat center;\"" $style (resources.Get "svg/loading.svg" | minify).RelPermalink | safeHTMLAttr -}}
{{- end -}}
{{- /* set image srcset */ -}}
{{- $srcSmall = printf (cond (strings.Contains $srcSmall "?") "%v&size=small" "%v?size=small") $srcSmall -}}
{{- $srcMedium := printf (cond (strings.Contains $src "?") "%v&size=medium" "%v?size=medium") $src -}}
{{- $srcLarge = printf (cond (strings.Contains $srcLarge "?") "%v&size=large" "%v?size=large") $srcLarge -}}
{{- /* structure of lightgallery or img */ -}}
{{- if .Linked -}}
<a class="lightgallery" href="{{ $srcLarge | safeURL }}" data-thumbnail="{{ $srcSmall | safeURL }}"{{ with $caption }} data-sub-html="<h2>{{ . }}</h2>{{ with $.Title }}<p>{{ . }}</p>{{ end }}"{{ end }}{{ with .Rel }} rel="{{ . }}"{{ end }}>
{{- end -}}
<img loading="{{ $loading }}" src="{{ $src | safeURL }}" srcset="{{ $srcSmall | safeURL }}, {{ $srcMedium | safeURL }} 1.5x, {{ $srcLarge | safeURL }} 2x" sizes="auto"
<img loading="{{ $loading }}" src="{{ $src | safeURL }}"
{{- if .Responsive }} srcset="{{ $srcSmall | safeURL }}, {{ $srcMedium | safeURL }} 1.5x, {{ $srcLarge | safeURL }} 2x" sizes="auto"{{- end -}}
{{- if eq $loading "lazy" }} data-title="{{ .Title | default $alt }}" data-alt="{{ $alt }}"
{{- else }} title="{{ .Title | default $alt }}" alt="{{ $alt }}"{{- end -}}
{{- with .Width }} width="{{ . }}"{{- end -}}
layouts/shortcodes/image.html
+1 -1
View File
@@ -16,7 +16,7 @@
{{- $options = cond $caption true false | dict "Linked" | merge $options -}}
{{- end -}}
{{- $options = dict "Resources" .Page.Resources "Params" .Page.Params | merge $options -}}
{{- $options = dict "Resources" .Page.Resources "Params" .Page.Params "Responsive" true | merge $options -}}
{{- with $caption -}}
<figure{{ with cond $.IsNamedParams ($.Get "class") "" }} class="{{ . }}"{{ end }}>