images: ignore empty <p>s generated by Hugo #576

This commit is contained in:
Sören Weber 2023-08-25 23:51:18 +02:00
parent 250bacfdfc
commit 9de73221c4
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
2 changed files with 33 additions and 29 deletions

View file

@ -53,10 +53,10 @@
{{- end }}
{{- end }}
{{- with $dest_url.Query.Get "height" }}
{{ $height = . }}
{{- $height = . }}
{{- end }}
{{- with $dest_url.Query.Get "width" }}
{{ $width = . }}
{{- $width = . }}
{{- end }}
{{- end }}
{{- $classes := slice }}
@ -65,13 +65,11 @@
{{- $classes = $classes | append $c }}
{{- end }}
{{- $id := cond (or (eq .id nil) (eq .id "")) (partial "make-random-md5.hugo" $page) .id }}
{{- if $effects.lightbox }}
{{- if $effects.lightbox -}}
<a href="#image-{{ $id }}" class="lightbox-link">
{{- end }}
<img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }}{{ if len ($classes) }} class="{{ delimit $classes " " }}"{{ end }} style="height: {{ $height }}; width: {{ $width }};" loading="lazy">
{{- if $effects.lightbox }}
</a>
<a href="javascript:history.back();" class="lightbox-back" id="image-{{ $id }}">
<img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="lightbox-image" loading="lazy">
{{- end -}}
<img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="figure-image {{ delimit $classes " " }}" style="height: {{ $height }}; width: {{ $width }};" loading="lazy">
{{- if $effects.lightbox -}}
</a>
<a href="javascript:history.back();" class="lightbox-back" id="image-{{ $id }}"><img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="lightbox-image" loading="lazy"></a>
{{- end }}

View file

@ -563,33 +563,39 @@ div.box > .box-content {
padding-right: 1rem;
}
#body table th > :first-child,
#body table th > :first-child :first-child,
#body table td > :first-child,
#body table td > :first-child :first-child,
#body div.box > .box-content > :first-child,
#body div.box > .box-content > :first-child :first-child,
#body div.expand > .expand-content-text > :first-child,
#body div.expand > .expand-content-text > :first-child :first-child,
#body div.tab-content > .tab-content-text > :first-child,
#body div.tab-content > .tab-content-text > :first-child :first-child {
p:empty {
/* in case of image render hook, Hugo may generate empty <p>s that we want to ignore */
display: none;
}
/* in case of image render hook, Hugo may generate empty <p>s that we want to ignore aswell, so a simple :first-child or :last-child is not enough */
#body table th > :nth-child(1 of :not(:empty)),
#body table th > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body table td > :nth-child(1 of :not(:empty)),
#body table td > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body div.box > .box-content > :nth-child(1 of :not(:empty)),
#body div.box > .box-content > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > :nth-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > :nth-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)) {
margin-top: 0;
}
#body table th > :last-child,
#body table th > :last-child :last-child,
#body table th > :nth-last-child(1 of :not(:empty)),
#body table th > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body table th > div.highlight:last-child pre,
#body table td > :last-child,
#body table td > :last-child :last-child,
#body table td > :nth-last-child(1 of :not(:empty)),
#body table td > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body table td > div:last-child pre,
#body div.box > .box-content > :last-child,
#body div.box > .box-content > :last-child :last-child,
#body div.box > .box-content > :nth-last-child(1 of :not(:empty)),
#body div.box > .box-content > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body div.box > .box-content > div:last-child pre,
#body div.expand > .expand-content-text > :last-child,
#body div.expand > .expand-content-text > :last-child :last-child,
#body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > div:last-child pre,
#body div.tab-content > .tab-content-text > :last-child,
#body div.tab-content > .tab-content-text > :last-child :last-child,
#body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > div:last-child pre {
margin-bottom: 0;
}