hugo-book
Code Issues

Review and update whitespaces in mermaid and KaTeX to improve shortcode nesting

Browse Source
This commit is contained in:
Alex Shpak
2025-09-26 17:28:08 +02:00
parent 5ffdf5bfaf
commit 915477e527
8 changed files with 91 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files
exampleSite/content.en/docs/shortcodes/mermaid.md
+44 -52
View File
@@ -11,63 +11,55 @@ create a `mermaid.json` file in your `assets` folder!
## Example ## Example
{{% columns %}} {{% columns %}}
- ````tpl
```mermaid
stateDiagram-v2
State1: The state with a note
note right of State1
Important information! You can write
notes.
end note
State1 --> State2
note left of State2 : This is the note to the left.
```
````
````tpl - ```mermaid
```mermaid stateDiagram-v2
stateDiagram-v2 State1: The state with a note
State1: The state with a note note right of State1
note right of State1 Important information! You can write
Important information! You can write notes.
notes. end note
end note State1 --> State2
State1 --> State2 note left of State2 : This is the note to the left.
note left of State2 : This is the note to the left. ```
```
````
<--->
```mermaid
stateDiagram-v2
State1: The state with a note
note right of State1
Important information! You can write
notes.
end note
State1 --> State2
note left of State2 : This is the note to the left.
```
{{% /columns %}} {{% /columns %}}
{{% columns %}} {{% columns %}}
- ```tpl
{{</* mermaid [class="..."] >}}
stateDiagram-v2
State1: The state with a note
note right of State1
Important information! You can write
notes.
end note
State1 --> State2
note left of State2 : This is the note to the left.
{{< /mermaid */>}}
```
```tpl - {{< mermaid >}}
{{</* mermaid [class="..."] >}} stateDiagram-v2
stateDiagram-v2 State1: The state with a note
State1: The state with a note note right of State1
note right of State1 Important information! You can write
Important information! You can write notes.
notes. end note
end note State1 --> State2
State1 --> State2 note left of State2 : This is the note to the left.
note left of State2 : This is the note to the left. {{< /mermaid >}}
{{< /mermaid */>}}
```
<--->
{{< mermaid >}}
stateDiagram-v2
State1: The state with a note
note right of State1
Important information! You can write
notes.
end note
State1 --> State2
note left of State2 : This is the note to the left.
{{< /mermaid >}}
{{% /columns %}} {{% /columns %}}
## Diagrams ## Diagrams
layouts/_markup/render-blockquote.html
+6 -6
View File
@@ -1,9 +1,9 @@
{{- $attributes := .Attributes }} {{- $attributes := .Attributes -}}
{{- $class := printf "book-hint %s" ($.AlertType | lower) }} {{- $class := printf "book-hint %s" ($.AlertType | lower) -}}
{{- if isset $attributes "class" }} {{- if isset $attributes "class" -}}
{{ $class = printf "%s %s" $class (index $attributes "class") }} {{- $class = printf "%s %s" $class (index $attributes "class") -}}
{{ end -}} {{ end -}}
{{- $attributes = merge $attributes (dict "class" $class) }} {{- $attributes = merge $attributes (dict "class" $class) -}}
<blockquote {{ range $key, $value := $attributes }}{{printf "%s='%s'" $key $value | safeHTMLAttr}}{{ end }}> <blockquote {{ range $key, $value := $attributes }}{{printf "%s='%s'" $key $value | safeHTMLAttr}}{{ end }}>
{{ .Text }} {{ .Text -}}
</blockquote> </blockquote>
layouts/_markup/render-codeblock-katex.html
+12 -12
View File
@@ -1,13 +1,13 @@
{{- if not (.Page.Store.Get "katex") -}} {{- with .Inner -}}
<!-- Include katex only first time -->
<link rel="stylesheet" href="{{ "katex/katex.min.css" | relURL }}" />
<script defer src="{{ "katex/katex.min.js" | relURL }}"></script>
{{ with resources.Get "katex.json" }}
<script defer src="{{ "katex/auto-render.min.js" | relURL }}" onload="renderMathInElement(document.body, {{ .Content | safeJS }});"></script>
{{ end }}
{{- .Page.Store.Set "katex" true -}}
{{- end -}}
{{- with .Inner }}
<span>\[ {{ .| htmlEscape | safeHTML }} \]</span> <span>\[ {{ .| htmlEscape | safeHTML }} \]</span>
{{ end -}} {{- end -}}
{{- if not (.Page.Store.Get "katex") -}}
{{- /* Include katex only first time */ -}}
<link rel="stylesheet" href="{{ "katex/katex.min.css" | relURL }}" />
{{- /* remove whitespaces */ -}}
<script defer src="{{ "katex/katex.min.js" | relURL }}"></script>
{{- with resources.Get "katex.json" | minify -}}
<script defer src="{{ "katex/auto-render.min.js" | relURL }}" onload="renderMathInElement(document.body, {{ .Content | safeJS }});"></script>
{{- end -}}
{{- .Page.Store.Set "katex" true -}}
{{- end -}}
layouts/_markup/render-codeblock-mermaid.html
+10 -12
View File
@@ -1,12 +1,10 @@
{{ if not (.Page.Store.Get "mermaid") }} {{- /* remove whitespaces */ -}}
<!-- Include mermaid only first time --> <pre class="mermaid">{{ .Inner | htmlEscape | safeHTML -}}</pre>
<script src="{{ "mermaid.min.js" | relURL }}"></script> {{- if not (.Page.Store.Get "mermaid") -}}
{{ with resources.Get "mermaid.json" }} {{- /* Include mermaid only first time */ -}}
<script>mermaid.initialize({{ .Content | safeJS }})</script> <script src="{{ "mermaid.min.js" | relURL }}"></script>
{{ end }} {{- with resources.Get "mermaid.json" | minify -}}
{{ .Page.Store.Set "mermaid" true }} <script>mermaid.initialize({{ .Content | safeJS }})</script>
{{ end }} {{- end -}}
{{- .Page.Store.Set "mermaid" true -}}
<pre class="mermaid"> {{- end -}}
{{- .Inner -}}
</pre>
layouts/_partials/docs/languages.html
-1
View File
@@ -1,4 +1,3 @@
<!-- Merge home and current page translations -->
{{ $bookTranslatedOnly := default false .Site.Params.BookTranslatedOnly }} {{ $bookTranslatedOnly := default false .Site.Params.BookTranslatedOnly }}
{{ $translations := dict }} {{ $translations := dict }}
{{ if (eq $bookTranslatedOnly false ) }} {{ if (eq $bookTranslatedOnly false ) }}
layouts/_shortcodes/asciinema.html
+1 -2
View File
@@ -1,6 +1,5 @@
{{- if not (.Page.Store.Get "asciinema") -}} {{- if not (.Page.Store.Get "asciinema") -}}
<!-- Include asciinema player only first time --> {{- /* Include asciinema player only first time */ -}}
{{- /* remove whitespaces */ -}}
<link rel="stylesheet" href="{{ "asciinema/asciinema-player.css" | relURL }}" /> <link rel="stylesheet" href="{{ "asciinema/asciinema-player.css" | relURL }}" />
{{- /* remove whitespaces */ -}} {{- /* remove whitespaces */ -}}
<script defer src="{{ "asciinema/asciinema-player.min.js" | relURL }}"></script> <script defer src="{{ "asciinema/asciinema-player.min.js" | relURL }}"></script>
layouts/_shortcodes/katex.html
+10 -14
View File
@@ -1,21 +1,17 @@
{{- if .Inner -}}
{{- if .Get "display" -}}
<div>{{ printf "\\[ %s \\]" .Inner }}</div>
{{- else -}}
<span>{{ printf "\\( %s \\)" .Inner }}</span>
{{- end -}}
{{- end -}}
{{- if not (.Page.Store.Get "katex") -}} {{- if not (.Page.Store.Get "katex") -}}
<!-- Include katex only first time --> {{- /* Include katex only first time */ -}}
{{- /* remove whitespaces */ -}}
<link rel="stylesheet" href="{{ "katex/katex.min.css" | relURL }}" /> <link rel="stylesheet" href="{{ "katex/katex.min.css" | relURL }}" />
{{- /* remove whitespaces */ -}} {{- /* remove whitespaces */ -}}
<script defer src="{{ "katex/katex.min.js" | relURL }}"></script> <script defer src="{{ "katex/katex.min.js" | relURL }}"></script>
{{- with resources.Get "katex.json" -}} {{- with resources.Get "katex.json" | minify -}}
<script defer src="{{ "katex/auto-render.min.js" | relURL }}" onload="renderMathInElement(document.body, {{ . | minify }});"></script> <script defer src="{{ "katex/auto-render.min.js" | relURL }}" onload="renderMathInElement(document.body, {{ .Content | safeJS }});"></script>
{{- end -}} {{- end -}}
{{- .Page.Store.Set "katex" true -}} {{- .Page.Store.Set "katex" true -}}
{{- end -}} {{- end -}}
{{- if .Inner -}}
<span>
{{- if .Get "display" -}}
\[ {{ .Inner }} \]
{{- else -}}
\( {{ .Inner }} \)
{{- end -}}
</span>
{{- end -}}
layouts/_shortcodes/mermaid.html
+8 -11
View File
@@ -1,14 +1,11 @@
{{- /* remove whitespaces */ -}}
<pre class="mermaid{{ with .Get "class" }} {{ . }}{{ end }}">
{{- .Inner | htmlEscape | safeHTML -}}
</pre>
{{- if not (.Page.Store.Get "mermaid") -}} {{- if not (.Page.Store.Get "mermaid") -}}
<!-- Include mermaid only first time --> {{- /* Include mermaid only first time */ -}}
{{- /* remove whitespaces */ -}} {{- with resources.Get "mermaid.json" | minify -}}
<script src="{{ "mermaid.min.js" | relURL }}"></script> <script src="{{ "mermaid.min.js" | relURL }}" onload="mermaid.initialize({{ .Content | safeJS }})"></script>
{{- with resources.Get "mermaid.json" -}}
<script>mermaid.initialize({{ .Content | safeJS }})</script>
{{- end -}} {{- end -}}
{{- .Page.Store.Set "mermaid" true -}} {{- .Page.Store.Set "mermaid" true -}}
{{- end -}} {{- end -}}
<pre class="mermaid{{ with .Get "class" }} {{ . }}{{ end }}">
{{- .Inner | htmlEscape | safeHTML -}}
</pre>
{{- /* remove whitespaces */ -}}