1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-09-20 04:12:09 +00:00

Give code figures both a label and description

This commit is contained in:
Rohan Kumar 2022-04-20 17:56:06 -07:00
parent 120232a403
commit d89de5db68
No known key found for this signature in database
GPG key ID: 1E892DB2A5F84479
2 changed files with 21 additions and 4 deletions

View file

@ -1,6 +1,14 @@
{{ $codeIndex := (.Page.Scratch.Get "codeIndex") }} {{- $codeIndex := (.Page.Scratch.Get "codeIndex") -}}
<figcaption> {{- $id := (printf `code-%d` $codeIndex) -}}
<strong itemprop="name" id="{{ if .Get "id" }}{{.Get "id"}}{{else}}code-{{ $codeIndex }}{{end}}"> <span itemprop="codeSampleType">Code snippet</span> {{ $codeIndex }}</strong>{{with .Get "lang"}} (<span itemprop="programmingLanguage">{{ . }}</span>){{end}}: {{ with .Parent }}
{{- with .Get "id" -}}
{{- $id = . -}}
{{- end -}}
{{- end -}}
<figcaption id="{{ $id }}-caption">
<span id="{{ $id }}">
<strong itemprop="name"> <span itemprop="codeSampleType">Code snippet</span> {{ $codeIndex }}</strong>{{with .Get "lang"}} (<span itemprop="programmingLanguage">{{ . }}</span>){{ end -}}
</span>:
{{ .Inner | markdownify | safeHTML }} {{ .Inner | markdownify | safeHTML }}
</figcaption> </figcaption>
{{- .Page.Scratch.Set "codeIndex" (add 1 $codeIndex) -}} {{- .Page.Scratch.Set "codeIndex" (add 1 $codeIndex) -}}

View file

@ -1,3 +1,12 @@
<figure itemscope itemtype="https://schema.org/SoftwareSourceCode"> {{- $codeIndex := (.Page.Scratch.Get "codeIndex") -}}
{{- $id := (printf `code-%d` (sub $codeIndex 1)) -}}
{{- with .Get "id" -}}
{{- $id = . -}}
{{- end -}}
<!--
The full caption is too long for an aria-label;
just use the beginning for the label and the full thing for the aria description.
-->
<figure aria-labelledby="{{ $id }}" aria-describedby="{{ $id }}-caption" itemscope itemtype="https://schema.org/SoftwareSourceCode">
{{ .Inner | markdownify }} {{ .Inner | markdownify }}
</figure> </figure>