blob: 19fc941e7622485194e09795c8ce782d8f3d0928 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
<!--
HACK
For some reason, Chrome will ignore some elements when using TAB
(while Firefox will not). Since Chrome is used by the majority,
I feel like I need to "fix" this.
For now, I'll be using "tabindex=0" (even if it makes Firefox
complain about accessibility).
I'm also taking this as an opportunity to fix other minor details
like i18n and responsiveness.
Hopefully, most of the mess below can be removed in the future
as Hugo evolves and more render hooks are implemented. (I remember
about adding anchor links to headings with replaceRE before
render hooks were available.)
-->
<!-- i18n -->
{{ $references := `(<section class="footnotes" role="doc-endnotes">)` }}
{{ $seeFootnotes := `(class="footnote-ref")` }}
{{ $returnToText := `(class="footnote-backref")` }}
{{ $translatedReferences := printf `${1}<h2>%s</h2>` (T "references") }}
{{ $translatedSeeFootnotes := printf `${1} title="%s"` (T "seeFootnotes") }}
{{ $translatedReturnToText := printf `${1} title="%s"` (T "returnToText") }}
<!-- More i18n and also a11y, kind of -->
{{ $highlightCodeBlock := `(<div class="highlight"><(?:pre|div) class="chroma")(>)` }}
{{ $indentedCodeBlock := `(<pre)>(<code>)` }}
{{ $labeledHighlightCodeBlock := printf `${1} aria-label="%s" tabindex=0${2}` (T "boxContainingCode") }}
{{ $labeledIndentedCodeBlock := printf `${1} aria-label="%s" tabindex=0>${2}` (T "boxContainingCode") }}
<!-- Wrap tables to make use of overflow-x property (plus the tabindex thing) -->
{{ $table := `(<table>(?:.|\n)+?</table>)` }}
{{ $improvedTable := printf `<section class="scroll" tabindex="0"> ${1} </section>` }}
<!-- Replace the inline "padding:0" present if using the default Chroma -->
{{ $highlightPadding := `(?:(<div class="highlight">(?:.|\n)+?<table (?:.*?))(?:padding:0))` }}
{{ $tweakedHighlightPadding := printf "${1}padding: var(--il-pad)" }}
<!-- Replace the footnote return links with a text label -->
{{ $footnoteReturnLink := `(<a (?:.*) class="footnote-backref" (?:.*)>)(?:.*)(</a>)` }}
{{ $improvedFootnoteReturnLink := printf `${1}%s${2}` (T "return") }}
<!-- OR replace the footnote return links with a SVG icon -->
{{ if .Site.Params.Style.hasIconAsFootnoteReturnLink }}
{{ $improvedFootnoteReturnLink = printf `${1}<svg transform="rotate(180) translate(0 -1)" aria-hidden="true"><use xlink:href="#caret-down"/></svg>${2}` }}
{{ end }}
<!--
This is doing 5 things right now (or is it):
* Adding "tabindex=0" to native table and code fences;
* Making tables scrollable;
* Localizing some text;
* Adding a "h2" to footnotes;
* Changing the default inline style for default Chroma.
-->
{{ .Content | replaceRE $table $improvedTable | replaceRE $highlightCodeBlock $labeledHighlightCodeBlock | replaceRE $indentedCodeBlock $labeledIndentedCodeBlock | replaceRE $seeFootnotes $translatedSeeFootnotes | replaceRE $returnToText $translatedReturnToText | replaceRE $references $translatedReferences | replaceRE $footnoteReturnLink $improvedFootnoteReturnLink | replaceRE $highlightPadding $tweakedHighlightPadding | safeHTML }}
|