Eryn Wells
9ffa94f8af
- Include railroad.js from http://tabatkins.github.io/railroad-diagrams/ - Include railroad.css from the same, and tweak it to match my style a bit better - Add a railroad-utils.js file that declares a railroadDiagram function. It takes a builder function and an element ID, calls the builder and adds the resulting diagram to the element with the given ID. - Add a railroad_diagram shortcode that wraps that all up so you can write a diagram inline with a post. - Add script includes if the railroad_diagram shortcode is used. The shortcut sets a variable in the page's .Scratch that is looked up in the head partial template to determine whether to include these scripts.
9 lines
358 B
HTML
9 lines
358 B
HTML
{{ $id := .Get "id" }}
|
|
{{ .Page.Scratch.Set "includes_railroad_diagram" true }}
|
|
<figure class="railroad-diagram" {{ if $id }}id="{{ $id }}"{{ end }}></figure>
|
|
<script defer type="module">
|
|
import { railroadDiagram } from {{ `/scripts/railroad-utils.js` | relURL }};
|
|
railroadDiagram(rr => {
|
|
{{ .Inner | safeJS }}
|
|
}, "{{ $id }}");
|
|
</script>
|