seirdy.one/layouts/shortcodes/transcribed-image-transcript.html

<details>
	{{ with .Parent -}}
		{{- $type := "image" -}}
		{{- with .Get "type" -}}
			{{- $type = . -}}
		{{- end -}}
	<summary><span id="btn-{{ .Get "id" }}">{{ $type | humanize }} <span itemprop="accessibilityFeature">transcript</span></span></summary>
	<div id="transcript-{{ .Get "id" }}" aria-labelledby="btn-{{ .Get "id" }}">
		{{- end -}}
		<div itemprop="embeddedTextCaption">
			{{ .Inner | markdownify | safeHTML }}
</div>
</div>
</details>
Make transcript the description of the image. 2022-04-22 18:48:22 +00:00			`<details>`
Microdata: fix relative urls, add a11y metadata - Add a11y metadata to transcribed images to communicate the presence of a transcript - Fix relative urls in navigation: make them absolute urls, so that the parsed navigation elements have the correct destinations. This also switches image transcripts from a section with a heading to a div with an ARIA label. That should reduce duplication between the <summary> content and the heading while still being semantically sound. 2022-06-30 00:54:51 +00:00			`{{ with .Parent -}}`
			`{{- $type := "image" -}}`
			`{{- with .Get "type" -}}`
			`{{- $type = . -}}`
			`{{- end -}}`
			`<summary><span id="btn-{{ .Get "id" }}">{{ $type \| humanize }} <span itemprop="accessibilityFeature">transcript</span></span></summary>`
			`<div id="transcript-{{ .Get "id" }}" aria-labelledby="btn-{{ .Get "id" }}">`
			`{{- end -}}`
			`<div itemprop="embeddedTextCaption">`
			`{{ .Inner \| markdownify \| safeHTML }}`
			`</div>`
Re-do my approach to image transcripts. Way better now. Also introduce a way to emphasize some keywords in code blocks without going full syntax-highlighting. 2022-04-21 00:55:13 +00:00			`</div>`
			`</details>`