Update render-image.html

Author: Liudon

layouts/_default/_markup/render-image.html

@@ -1,4 +1,4 @@
-{{- $respSizes := slice 480 720 1080 -}}
+{{- $respSizes := slice 720 1080 -}}
 {{- $dataSzes := "(min-width: 768px) 1080px, 100vw" -}}
 
 {{- $holder := "GIP" -}}
@@ -14,15 +14,15 @@
 {{ with $src := .Page.Resources.GetMatch .Destination }}
 	{{- if $responsiveImages -}}
 		<picture>
+			{{- $imageTypes := slice $src.MediaType.SubType -}}
 			{{- if and hugo.IsExtended (ne $src.MediaType.Type "image/webp") -}}
-			<source type="image/webp" srcset="
-			{{- with $respSizes -}}
-				{{- range $i, $e := . -}}
-					{{- if $i }}, {{ end -}}{{- ($src.Resize (print . "x webp " $hint " " $filter) ).RelPermalink | absURL }} {{ . }}w
-				{{- end -}}
-			{{- end -}}" sizes="{{ $dataSzes }}" />
+				{{- $imageTypes = append $imageTypes "webp" -}}
 			{{- end -}}
-			<source type="{{ $src.MediaType.Type }}" srcset="
+			{{- if gt (index $respSizes 0) $src.Width -}}
+				{{- $respSizes = slice $src.Width -}}
+			{{- end -}}
+			{{- range $imageType := $imageTypes -}}
+			<source type="{{ $imageType }}" srcset="
 			{{- with $respSizes -}}
 				{{- range $i, $e := . -}}
 					{{- if ge $src.Width . -}}
@@ -31,8 +31,9 @@
 				{{- end -}}
 			{{- end -}}, {{$src.Permalink }} {{printf "%dw" ($src.Width)}}" sizes="{{ $dataSzes }}" />
 			<img src="{{ $Destination | safeURL }}" width="{{ .Width }}" height="{{ .Height }}" alt="{{ $Text }}" title="{{ $Title }}" loading="lazy" />
+			{{- end -}}
 		</picture>
 	{{- else }}
 		<img src="{{ $Destination | safeURL }}" width="{{ $src.Width }}" height="{{ $src.Height }}" alt="{{ $Text }}" title="{{ $Title }}" loading="lazy" />
 	{{- end }}
-{{ end }}
+{{ end }}