demo article in English: stack overview and redesigned architecture diagrams
This commit is contained in:
@@ -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 |
Reference in New Issue
Block a user