fmaury/seirdy.one
1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-12-24 01:42:10 +00:00
Code Issues Projects Releases Wiki Activity

Give code figures both a label and description

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

14
layouts/shortcodes/codecaption.html
View file

@ -1,6 +1,14 @@
{{ $codeIndex := (.Page.Scratch.Get "codeIndex") }}
<figcaption>
<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}}:
{{- $codeIndex := (.Page.Scratch.Get "codeIndex") -}}
{{- $id := (printf `code-%d` $codeIndex) -}}
{{ 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 }}
</figcaption>
{{- .Page.Scratch.Set "codeIndex" (add 1 $codeIndex) -}}

11
layouts/shortcodes/codefigure.html
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 }}
</figure>