mirror of
https://github.com/fabro-sh/fabro.git
synced 2026-10-08 03:10:26 +00:00
Fill in the human-tools/preview page documenting how preview URLs let users access running services in sandbox environments from their browser. Includes how it works, web UI and API usage, common use cases with an example workflow, and tips. Adds a graphviz-generated SVG of the BuildAndPreview workflow with dark mode support. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
90 lines
5.1 KiB
XML
90 lines
5.1 KiB
XML
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
|
|
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
<!-- Generated by graphviz version 14.1.2 (20260124.0452)
|
|
-->
|
|
<!-- Title: BuildAndPreview Pages: 1 -->
|
|
<svg width="697pt" height="79pt"
|
|
viewBox="0.00 0.00 697.00 79.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
<style>
|
|
@media (prefers-color-scheme: dark) {
|
|
[fill="#1a1a1a"] { fill: #e5e5e5; }
|
|
[fill="#666666"] { fill: #aaaaaa; }
|
|
[stroke="#666666"] { stroke: #aaaaaa; }
|
|
[stroke="#999999"] { stroke: #777777; }
|
|
}
|
|
</style>
|
|
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 75.12)">
|
|
<title>BuildAndPreview</title>
|
|
<!-- start -->
|
|
<g id="node1" class="node">
|
|
<title>start</title>
|
|
<polygon fill="none" stroke="#357f9e" points="35.26,-36.12 0,-18.13 35.26,-0.13 70.52,-18.12 35.26,-36.12"/>
|
|
<polyline fill="none" stroke="#357f9e" points="10.69,-23.58 10.69,-12.67"/>
|
|
<polyline fill="none" stroke="#357f9e" points="24.57,-5.58 45.95,-5.58"/>
|
|
<polyline fill="none" stroke="#357f9e" points="59.83,-12.67 59.83,-23.58"/>
|
|
<polyline fill="none" stroke="#357f9e" points="45.95,-30.67 24.57,-30.67"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="35.26" y="-13.1" font-family="Helvetica,sans-Serif" font-size="12.00" fill="#1a1a1a">Start</text>
|
|
</g>
|
|
<!-- build -->
|
|
<g id="node3" class="node">
|
|
<title>build</title>
|
|
<path fill="none" stroke="#357f9e" d="M163.27,-36.12C163.27,-36.12 119.52,-36.12 119.52,-36.12 113.52,-36.12 107.52,-30.12 107.52,-24.12 107.52,-24.12 107.52,-12.12 107.52,-12.12 107.52,-6.12 113.52,-0.12 119.52,-0.12 119.52,-0.12 163.27,-0.12 163.27,-0.12 169.27,-0.12 175.27,-6.12 175.27,-12.12 175.27,-12.12 175.27,-24.13 175.27,-24.13 175.27,-30.12 169.27,-36.12 163.27,-36.12"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="141.4" y="-13.1" font-family="Helvetica,sans-Serif" font-size="12.00" fill="#1a1a1a">Build Site</text>
|
|
</g>
|
|
<!-- start->build -->
|
|
<g id="edge1" class="edge">
|
|
<title>start->build</title>
|
|
<path fill="none" stroke="#666666" d="M71.52,-18.12C79.38,-18.12 87.81,-18.12 95.99,-18.12"/>
|
|
<polygon fill="#666666" stroke="#666666" points="95.77,-21.63 105.77,-18.13 95.77,-14.63 95.77,-21.63"/>
|
|
</g>
|
|
<!-- exit -->
|
|
<g id="node2" class="node">
|
|
<title>exit</title>
|
|
<polygon fill="none" stroke="#357f9e" points="689.22,-36.25 652.97,-36.25 652.97,0 689.22,0 689.22,-36.25"/>
|
|
<polyline fill="none" stroke="#357f9e" points="664.97,-36.25 652.97,-24.25"/>
|
|
<polyline fill="none" stroke="#357f9e" points="652.97,-12 664.97,0"/>
|
|
<polyline fill="none" stroke="#357f9e" points="677.22,0 689.22,-12"/>
|
|
<polyline fill="none" stroke="#357f9e" points="689.22,-24.25 677.22,-36.25"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="671.09" y="-13.1" font-family="Helvetica,sans-Serif" font-size="12.00" fill="#1a1a1a">Exit</text>
|
|
</g>
|
|
<!-- serve -->
|
|
<g id="node4" class="node">
|
|
<title>serve</title>
|
|
<polygon fill="none" stroke="#357f9e" points="398.42,-71.12 250.36,-71.12 212.27,-35.13 360.33,-35.12 398.42,-71.12"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="305.35" y="-48.1" font-family="Helvetica,sans-Serif" font-size="12.00" fill="#1a1a1a">Start Dev Server</text>
|
|
</g>
|
|
<!-- build->serve -->
|
|
<g id="edge2" class="edge">
|
|
<title>build->serve</title>
|
|
<path fill="none" stroke="#666666" d="M175.56,-25.29C185.24,-27.38 196.34,-29.78 207.87,-32.27"/>
|
|
<polygon fill="#666666" stroke="#666666" points="207.04,-35.67 217.55,-34.37 208.51,-28.83 207.04,-35.67"/>
|
|
</g>
|
|
<!-- review -->
|
|
<g id="node5" class="node">
|
|
<title>review</title>
|
|
<polygon fill="none" stroke="#357f9e" points="580.97,-18.12 544.58,-36.12 471.81,-36.12 435.42,-18.13 471.81,-0.13 544.58,-0.12 580.97,-18.12"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="508.19" y="-13.1" font-family="Helvetica,sans-Serif" font-size="12.00" fill="#1a1a1a">Review Preview</text>
|
|
</g>
|
|
<!-- serve->review -->
|
|
<g id="edge3" class="edge">
|
|
<title>serve->review</title>
|
|
<path fill="none" stroke="#666666" d="M368.52,-42.29C391.89,-38.22 418.5,-33.58 442.12,-29.46"/>
|
|
<polygon fill="#666666" stroke="#666666" points="442.71,-32.92 451.96,-27.75 441.51,-26.02 442.71,-32.92"/>
|
|
</g>
|
|
<!-- review->exit -->
|
|
<g id="edge4" class="edge">
|
|
<title>review->exit</title>
|
|
<path fill="none" stroke="#666666" d="M581.64,-18.12C602.85,-18.12 624.81,-18.12 641.54,-18.12"/>
|
|
<polygon fill="#666666" stroke="#666666" points="641.2,-21.63 651.2,-18.13 641.2,-14.63 641.2,-21.63"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="616.97" y="-19.88" font-family="Helvetica,sans-Serif" font-size="10.00" fill="#666666">Approve</text>
|
|
</g>
|
|
<!-- review->build -->
|
|
<g id="edge5" class="edge">
|
|
<title>review->build</title>
|
|
<path fill="none" stroke="#666666" d="M439.31,-15.78C425.77,-15.4 411.65,-15.07 398.42,-14.88 315.7,-13.64 294.98,-12.95 212.27,-14.88 204.01,-15.07 195.2,-15.39 186.72,-15.75"/>
|
|
<polygon fill="#666666" stroke="#666666" points="186.78,-12.25 176.95,-16.2 187.11,-19.24 186.78,-12.25"/>
|
|
<text xml:space="preserve" text-anchor="middle" x="305.35" y="-16.62" font-family="Helvetica,sans-Serif" font-size="10.00" fill="#666666">Revise</text>
|
|
</g>
|
|
</g>
|
|
</svg>
|