File: //snap/google-cloud-cli/396/platform/gsutil/third_party/pyparsing/examples/bf_diagram.html
<!DOCTYPE html>
<html>
<head>
<style>
.railroad-heading {
font-family: monospace;
}
</style>
</head>
<body>
<meta charset="UTF-8"/>
<div class="railroad-group">
<h1 class="railroad-heading" id="program-0002">program</h1>
<div class="railroad-description"></div>
<div class="railroad-svg">
<svg class="railroad-diagram" height="80" viewBox="0 0 253.5 80" width="253.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g transform="translate(.5 .5)">
<g>
<path d="M20 30v20m10 -20v20m-10 -10h20" /></g><g>
<path d="M40 40h0.0" /><path d="M213.5 40h0.0" /><path d="M40.0 40a10 10 0 0 0 10 -10v0a10 10 0 0 1 10 -10" /><g>
<path d="M60.0 20h133.5" /></g><path d="M193.5 20a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10" /><path d="M40.0 40h20" /><g>
<path d="M60.0 40h0.0" /><path d="M193.5 40h0.0" /><path d="M60.0 40h10" /><g class="non-terminal ">
<path d="M70.0 40h0.0" /><path d="M183.5 40h0.0" /><rect height="22" width="113.5" x="70" y="29"></rect><a xlink:href="#instruction-0001"><text x="126.75" y="44">instruction</text><text x="126.75" y="44">instruction</text></a></g><path d="M183.5 40h10" /><path d="M70.0 40a10 10 0 0 0 -10 10v0a10 10 0 0 0 10 10" /><g>
<path d="M70.0 60h113.5" /></g><path d="M183.5 60a10 10 0 0 0 10 -10v0a10 10 0 0 0 -10 -10" /></g><path d="M193.5 40h20" /></g><path d="M 213.5 40 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g><style>/* <![CDATA[ */
svg.railroad-diagram {
background-color:hsl(30,20%,95%);
}
svg.railroad-diagram path {
stroke-width:3;
stroke:black;
fill:rgba(0,0,0,0);
}
svg.railroad-diagram text {
font:bold 14px monospace;
text-anchor:middle;
}
svg.railroad-diagram text.label{
text-anchor:start;
}
svg.railroad-diagram text.comment{
font:italic 12px monospace;
}
svg.railroad-diagram rect{
stroke-width:3;
stroke:black;
fill:hsl(120,100%,90%);
}
svg.railroad-diagram rect.group-box {
stroke: gray;
stroke-dasharray: 10 5;
fill: none;
}
/* ]]> */
</style></svg>
</div>
</div>
<div class="railroad-group">
<h1 class="railroad-heading" id="instruction-0001">instruction</h1>
<div class="railroad-description"></div>
<div class="railroad-svg">
<svg class="railroad-diagram" height="276" viewBox="0 0 444.5 276" width="444.5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g transform="translate(.5 .5)">
<g>
<path d="M20 21v20m10 -20v20m-10 -10h20" /></g><path d="M40 31h10" /><g>
<path d="M50 31h0.0" /><path d="M394.5 31h0.0" /><g>
<path d="M50.0 31h0.0" /><path d="M394.5 31h0.0" /><path d="M50.0 31h20" /><g class="terminal ">
<path d="M70.0 31h129.5" /><path d="M245.0 31h129.5" /><rect height="22" rx="10" ry="10" width="45.5" x="199.5" y="20"></rect><text x="222.25" y="35">'+'</text></g><path d="M374.5 31h20" /><path d="M50.0 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10" /><g class="terminal ">
<path d="M70.0 61h129.5" /><path d="M245.0 61h129.5" /><rect height="22" rx="10" ry="10" width="45.5" x="199.5" y="50"></rect><text x="222.25" y="65">'-'</text></g><path d="M374.5 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10" /><path d="M50.0 31a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10" /><g class="terminal ">
<path d="M70.0 91h129.5" /><path d="M245.0 91h129.5" /><rect height="22" rx="10" ry="10" width="45.5" x="199.5" y="80"></rect><text x="222.25" y="95">'<'</text></g><path d="M374.5 91a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10" /><path d="M50.0 31a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10" /><g class="terminal ">
<path d="M70.0 121h129.5" /><path d="M245.0 121h129.5" /><rect height="22" rx="10" ry="10" width="45.5" x="199.5" y="110"></rect><text x="222.25" y="125">'>'</text></g><path d="M374.5 121a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10" /><path d="M50.0 31a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10" /><g class="terminal ">
<path d="M70.0 151h129.5" /><path d="M245.0 151h129.5" /><rect height="22" rx="10" ry="10" width="45.5" x="199.5" y="140"></rect><text x="222.25" y="155">','</text></g><path d="M374.5 151a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10" /><path d="M50.0 31a10 10 0 0 1 10 10v130a10 10 0 0 0 10 10" /><g class="terminal ">
<path d="M70.0 181h129.5" /><path d="M245.0 181h129.5" /><rect height="22" rx="10" ry="10" width="45.5" x="199.5" y="170"></rect><text x="222.25" y="185">'.'</text></g><path d="M374.5 181a10 10 0 0 0 10 -10v-130a10 10 0 0 1 10 -10" /><path d="M50.0 31a10 10 0 0 1 10 10v177a10 10 0 0 0 10 10" /><g>
<path d="M70.0 228h0.0" /><path d="M374.5 228h0.0" /><rect class="group-box" height="56" rx="10" ry="10" width="304.5" x="70" y="200"></rect><g>
<path d="M70.0 228h10.0" /><path d="M364.5 228h10.0" /><g class="terminal ">
<path d="M80.0 228h0.0" /><path d="M125.5 228h0.0" /><rect height="22" rx="10" ry="10" width="45.5" x="80" y="217"></rect><text x="102.75" y="232">'['</text></g><path d="M125.5 228h10" /><g>
<path d="M135.5 228h0.0" /><path d="M309.0 228h0.0" /><path d="M135.5 228a10 10 0 0 0 10 -10v0a10 10 0 0 1 10 -10" /><g>
<path d="M155.5 208h133.5" /></g><path d="M289.0 208a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10" /><path d="M135.5 228h20" /><g>
<path d="M155.5 228h0.0" /><path d="M289.0 228h0.0" /><path d="M155.5 228h10" /><g class="non-terminal ">
<path d="M165.5 228h0.0" /><path d="M279.0 228h0.0" /><rect height="22" width="113.5" x="165.5" y="217"></rect><a xlink:href="#instruction-0001"><text x="222.25" y="232">instruction</text><text x="222.25" y="232">instruction</text></a></g><path d="M279.0 228h10" /><path d="M165.5 228a10 10 0 0 0 -10 10v0a10 10 0 0 0 10 10" /><g>
<path d="M165.5 248h113.5" /></g><path d="M279.0 248a10 10 0 0 0 10 -10v0a10 10 0 0 0 -10 -10" /></g><path d="M289.0 228h20" /></g><path d="M309.0 228h10" /><g class="terminal ">
<path d="M319.0 228h0.0" /><path d="M364.5 228h0.0" /><rect height="22" rx="10" ry="10" width="45.5" x="319" y="217"></rect><text x="341.75" y="232">']'</text></g></g></g><path d="M374.5 228a10 10 0 0 0 10 -10v-177a10 10 0 0 1 10 -10" /></g></g><path d="M394.5 31h10" /><path d="M 404.5 31 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g><style>/* <![CDATA[ */
svg.railroad-diagram {
background-color:hsl(30,20%,95%);
}
svg.railroad-diagram path {
stroke-width:3;
stroke:black;
fill:rgba(0,0,0,0);
}
svg.railroad-diagram text {
font:bold 14px monospace;
text-anchor:middle;
}
svg.railroad-diagram text.label{
text-anchor:start;
}
svg.railroad-diagram text.comment{
font:italic 12px monospace;
}
svg.railroad-diagram rect{
stroke-width:3;
stroke:black;
fill:hsl(120,100%,90%);
}
svg.railroad-diagram rect.group-box {
stroke: gray;
stroke-dasharray: 10 5;
fill: none;
}
/* ]]> */
</style></svg>
</div>
</div>
</body>
</html>