Move all the figure shortcodes to /layouts/shortcodes/figures; center all of them

layouts/shortcodes/figures/image.html

@@ -0,0 +1,14 @@
+{{ $img := (.Page.Resources.GetMatch (.Get "name")) }}
+{{ $resized_img := $img.Fit "1000x1000" }}
+<div class="centered">
+    <figure>
+        <a href="{{ $img.RelPermalink }}">
+            <img src="{{ $resized_img.RelPermalink }}" />
+        </a>
+        {{ if $img.Title }}
+        <figcaption>
+            <p>{{ $img.Title }}</p>
+        </figcaption>
+        {{ end }}
+    </figure>
+</div>

layouts/shortcodes/figures/p5.html

@@ -0,0 +1,5 @@
+{{ $id := .Get "id" }}
+{{ .Page.Scratch.Set "includes_p5_sketch" true }}
+<div class="centered">
+    <figure class="p5-sketch {{ with .Get "bordered" }}bordered{{ end }}" id="{{ $id }}"></figure>
+</div>

layouts/shortcodes/figures/railroad.html

@@ -0,0 +1,11 @@
+{{ $id := .Get "id" }}
+{{ .Page.Scratch.Set "includes_railroad_diagram" true }}
+<div class="centered">
+    <figure class="railroad-diagram" {{ if $id }}id="{{ $id }}"{{ end }}></figure>
+</div>
+<script defer type="module">
+    import { railroadDiagram } from {{ `/scripts/railroad-utils.js` | relURL }};
+    railroadDiagram(rr => {
+        {{ .Inner | safeJS }}
+    }, "{{ $id }}");
+</script>

layouts/shortcodes/figures/youtube.html

@@ -0,0 +1,14 @@
+{{- $pc := .Page.Site.Config.Privacy.YouTube -}}
+{{- if not $pc.Disable -}}
+{{- $ytHost := cond $pc.PrivacyEnhanced  "www.youtube-nocookie.com" "www.youtube.com" -}}
+{{- $id := .Get "id" | default (.Get 0) -}}
+{{- $class := .Get "class" | default (.Get 1) -}}
+{{- $title := .Get "title" | default "YouTube Video" }}
+<div class="centered">
+    <figure>
+        <div class="youtube">
+            <iframe src="https://{{ $ytHost }}/embed/{{ $id }}{{ with .Get "autoplay" }}{{ if eq . "true" }}?autoplay=1{{ end }}{{ end }}" allowfullscreen frameborder=0 title="{{ $title }}"></iframe>
+        </div>
+    </figure>
+</div>
+{{ end -}}