demo article in English: stack overview and redesigned architecture diagrams

This commit is contained in:
2026-09-11 13:58:49 +02:00
parent 43e2bb4061
commit 9ca89f3e40
13 changed files with 573 additions and 524 deletions
+54
View File
@@ -0,0 +1,54 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 620 600" role="img" aria-label="Five steps from a save in the editor to a published page: save, commit, change detected, site build, published">
<defs>
<filter id="soft2" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="2" stdDeviation="5" flood-color="#00004a" flood-opacity="0.10"/>
</filter>
<style>
.t { font-family: Inter, "Segoe UI", Arial, sans-serif; }
.ttl { font-weight: 700; font-size: 18px; fill: #00004a; }
.cap { font-size: 15px; fill: #46536a; }
.num { font-weight: 800; font-size: 16px; fill: #00004a; }
.pill { fill: #f5f5f5; stroke: #e2e5ee; }
.pilltxt { font-size: 14px; fill: #101228; }
</style>
</defs>
<!-- rail -->
<line x1="60" y1="70" x2="60" y2="470" stroke="#c7cde9" stroke-width="2"/>
<!-- step 1 -->
<circle cx="60" cy="70" r="20" fill="#00e4d8"/>
<text class="t num" x="60" y="76" text-anchor="middle">1</text>
<text class="t ttl" x="100" y="66">Save in the editor</text>
<text class="t cap" x="100" y="92">Sveltia, visual editing with a preview that matches the page</text>
<!-- step 2 -->
<circle cx="60" cy="170" r="20" fill="#00e4d8"/>
<text class="t num" x="60" y="176" text-anchor="middle">2</text>
<text class="t ttl" x="100" y="166">Commit in the repository</text>
<text class="t cap" x="100" y="192">Gitea signs the editor in; each save becomes one commit</text>
<!-- step 3 -->
<circle cx="60" cy="270" r="20" fill="#00e4d8"/>
<text class="t num" x="60" y="276" text-anchor="middle">3</text>
<text class="t ttl" x="100" y="266">Change detected</text>
<text class="t cap" x="100" y="292">a systemd timer checks both repositories every 10 seconds</text>
<!-- step 4 -->
<circle cx="60" cy="370" r="20" fill="#00e4d8"/>
<text class="t num" x="60" y="376" text-anchor="middle">4</text>
<text class="t ttl" x="100" y="366">Site build</text>
<text class="t cap" x="100" y="392">a one-shot container runs Astro: Markdown becomes static HTML</text>
<!-- step 5 -->
<circle cx="60" cy="470" r="20" fill="#00e4d8"/>
<text class="t num" x="60" y="476" text-anchor="middle">5</text>
<text class="t ttl" x="100" y="466">Published</text>
<text class="t cap" x="100" y="492">an atomic symlink swap; nginx serves the new version at once</text>
<!-- reassurance -->
<rect class="pill" x="40" y="524" width="310" height="46" rx="23"/>
<text class="t pilltxt" x="195" y="552" text-anchor="middle">a failed build leaves the old version up</text>
<rect class="pill" x="370" y="524" width="220" height="46" rx="23"/>
<text class="t pilltxt" x="480" y="552" text-anchor="middle">rollback is one git revert</text>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB