| <html> |
| <head> |
| <style> |
| * { margin: 0; padding:0;} |
| #MatchesCase, #FailCase, #compiledSelector, .arrow, .compilationArrow, .htmlMatchingInputArrow, .headMatchingInputArrow, .bodyMatchingInputArrow, .navMatchingInputArrow, .articleMatchingInputArrow, .headerMatchingInputArrow, .sectionMatchingInputArrow { |
| opacity: 0; |
| } |
| |
| @-webkit-keyframes building-binary-animation { |
| from { opacity:0; } |
| to { opacity:1; } |
| } |
| @keyframes building-binary-animation { |
| from { opacity:0; } |
| to { opacity:1; } |
| } |
| .animated #compiledSelector { |
| -webkit-animation-name: building-binary-animation; |
| -webkit-animation-duration: 2s; |
| animation-name: input-arrows-animation; |
| animation-duration: 2s; |
| opacity:1; |
| } |
| @keyframes compilation-arrow-animation { |
| 5% { opacity:1; } |
| 95% { opacity:1; } |
| } |
| @-webkit-keyframes compilation-arrow-animation { |
| 5% { opacity:1; } |
| 95% { opacity:1; } |
| } |
| .animated .compilationArrow { |
| -webkit-animation-name: compilation-arrow-animation; |
| -webkit-animation-duration: 2s; |
| animation-name: input-arrows-animation; |
| animation-duration: 2s; |
| } |
| @-webkit-keyframes compilation-gear-animation { |
| 5% { -webkit-transform: rotate(0); } |
| 95% { -webkit-transform: rotate(30deg); -webkit-animation-timing-function: step-start; } |
| } |
| @keyframes compilation-gear-animation { |
| 5% { transform: rotate(0); } |
| 95% { transform: rotate(30deg); animation-timing-function: step-start; } |
| } |
| .animated #CompileGear { |
| -webkit-transform-origin: center; |
| -webkit-animation-name: compilation-gear-animation; |
| -webkit-animation-duration: 2s; |
| transform-origin: center; |
| animation-name: work-in-progress-animation; |
| animation-duration: 2s; |
| /* transform-origin behave completly randomly with Gecko :( */ |
| -moz-animation-name:none; |
| } |
| @-webkit-keyframes work-in-progress-animation { |
| 5% { -webkit-transform: rotate(0); } |
| 95% { -webkit-transform: rotate(30deg); -webkit-animation-timing-function: step-start; } |
| } |
| @keyframes work-in-progress-animation { |
| 5% { transform: rotate(0); } |
| 95% { transform: rotate(30deg); animation-timing-function: step-start; } |
| } |
| .animated #WorkGear { |
| -webkit-transform-origin: center; |
| -webkit-animation-name: work-in-progress-animation; |
| -webkit-animation-duration: 0.25s; |
| -webkit-animation-iteration-count: 7; |
| -webkit-animation-delay: 2s; |
| transform-origin: center; |
| animation-name: work-in-progress-animation; |
| animation-duration: 0.25s; |
| animation-iteration-count: 7; |
| animation-delay: 2s; |
| /* transform-origin behave completly randomly with Gecko :( */ |
| -moz-animation-name:none; |
| -moz-transform-origin: 486px 647px; |
| } |
| @-webkit-keyframes input-arrows-animation { |
| 5% { opacity:1; } |
| 75% { opacity:1; } |
| 80% { opacity:0; } |
| } |
| @keyframes input-arrows-animation { |
| 5% { opacity:1; } |
| 75% { opacity:1; } |
| 80% { opacity:0; } |
| } |
| .animated .arrow { |
| -webkit-animation-name: input-arrows-animation; |
| -webkit-animation-duration: 0.25s; |
| animation-name: input-arrows-animation; |
| animation-duration: 0.25s; |
| } |
| .animated .htmlMatchingInputArrow { |
| -webkit-animation-delay: 2s; |
| animation-delay: 2s; |
| } |
| .animated .headMatchingInputArrow { |
| -webkit-animation-delay: 2.25s; |
| animation-delay: 2.25s; |
| } |
| .animated .bodyMatchingInputArrow { |
| -webkit-animation-delay: 2.5s; |
| animation-delay: 2.5s; |
| } |
| .animated .navMatchingInputArrow { |
| -webkit-animation-delay: 2.75s; |
| animation-delay: 2.75s; |
| } |
| .animated .articleMatchingInputArrow { |
| -webkit-animation-delay: 3s; |
| animation-delay: 3s; |
| } |
| .animated .headerMatchingInputArrow { |
| -webkit-animation-delay: 3.25s; |
| animation-delay: 3.25s; |
| } |
| .animated .sectionMatchingInputArrow { |
| -webkit-animation-delay: 3.5s; |
| animation-delay: 3.5s; |
| } |
| @-webkit-keyframes output-animation { |
| 75% { opacity:0; } |
| 80% { opacity:1; } |
| 95% { opacity:1; } |
| } |
| @keyframes output-animation { |
| 75% { opacity:0; } |
| 80% { opacity:1; } |
| 95% { opacity:1; } |
| } |
| |
| .animated #FailCase { |
| -webkit-animation-name: output-animation; |
| -webkit-animation-duration: 0.25s; |
| -webkit-animation-iteration-count: 6; |
| -webkit-animation-delay: 2s; |
| animation-name: output-animation; |
| animation-duration: 0.25s; |
| animation-iteration-count: 6; |
| animation-delay: 2s; |
| } |
| .animated #MatchesCase { |
| -webkit-animation-name: output-animation; |
| -webkit-animation-duration: 0.25s; |
| -webkit-animation-delay: 3.5s; |
| animation-name: output-animation; |
| animation-duration: 0.25s; |
| animation-delay: 3.5s; |
| } |
| |
| .clickToStart { |
| width: 400px; |
| background-color: rgba(0, 0, 0, 0.75); |
| position: absolute; |
| padding: 10px; |
| border-radius:25px; |
| text-align:center; |
| font-size: 18pt; |
| top: 50%; |
| left: 107px; |
| color:white; |
| cursor:hand; |
| } |
| </style> |
| </head> |
| <body> |
| <svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="18 70 588 613" width="614px" height="587px"> |
| <defs> |
| <font-face font-family="Helvetica" font-size="12" units-per-em="1000" underline-position="-75.683594" underline-thickness="49.316406" slope="0" x-height="522.94922" cap-height="717.28516" ascent="770.01953" descent="-229.98047" font-weight="500"> |
| <font-face-src><font-face-name name="Helvetica" /></font-face-src> |
| </font-face> |
| <font-face font-family="Helvetica Neue" font-size="22" panose-1="2 0 5 3 0 0 0 2 0 4" units-per-em="1000" underline-position="-100" underline-thickness="50" slope="0" x-height="517" cap-height="714" ascent="951.99585" descent="-212.99744" |
| font-weight="500"> |
| <font-face-src><font-face-name name="HelveticaNeue" /></font-face-src> |
| </font-face> |
| <font-face font-family="Helvetica" font-size="18" units-per-em="1000" underline-position="-75.683594" underline-thickness="49.316406" slope="0" x-height="522.94922" cap-height="717.28516" ascent="770.01953" descent="-229.98047" font-weight="500"> |
| <font-face-src><font-face-name name="Helvetica" /></font-face-src> |
| </font-face> |
| <marker orient="auto" overflow="visible" markerUnits="strokeWidth" id="FilledArrow_Marker" viewBox="-1 -3 7 6" markerWidth="7" markerHeight="6" color="black"> |
| <g> |
| <path d="M 4.8 0 L 0 -1.8 L 0 1.8 Z" fill="currentColor" stroke="currentColor" stroke-width="1" /> |
| </g> |
| </marker> |
| <font-face font-family="Helvetica" font-size="16" units-per-em="1000" underline-position="-75.683594" underline-thickness="49.316406" slope="0" x-height="522.94922" cap-height="717.28516" ascent="770.01953" descent="-229.98047" font-weight="500"> |
| <font-face-src><font-face-name name="Helvetica" /></font-face-src> |
| </font-face> |
| <marker orient="auto" overflow="visible" markerUnits="strokeWidth" id="FilledArrow_Marker_2" viewBox="-1 -3 7 6" markerWidth="7" markerHeight="6" color="#992727"> |
| <g> |
| <path d="M 4.8 0 L 0 -1.8 L 0 1.8 Z" fill="currentColor" stroke="currentColor" stroke-width="1" /> |
| </g> |
| </marker> |
| <marker orient="auto" overflow="visible" markerUnits="strokeWidth" id="FilledArrow_Marker_3" viewBox="-1 -3 7 6" markerWidth="7" markerHeight="6" color="#218041"> |
| <g> |
| <path d="M 4.8 0 L 0 -1.8 L 0 1.8 Z" fill="currentColor" stroke="currentColor" stroke-width="1" /> |
| </g> |
| </marker> |
| <font-face font-family="Helvetica" font-size="22" units-per-em="1000" underline-position="-75.683594" underline-thickness="49.316406" slope="0" x-height="522.94922" cap-height="717.28516" ascent="770.01953" descent="-229.98047" font-weight="500"> |
| <font-face-src><font-face-name name="Helvetica" /></font-face-src> |
| </font-face> |
| </defs> |
| <g stroke="none" stroke-dasharray="none" fill="none"> |
| <g transform="scale(0.35) translate(875, 95)"> |
| <path id="CompileGear" d="m469.34 451.62-8.125 46.281 0.0313 0.031c-9.9316 1.6228-19.54 4.2238-28.719 7.6875v-0.031l-30.156-36.031-28.344 16.375 16.094 44.125 0.0624 0.031c-7.6842 6.3076-14.727 13.375-21.031 21.063l-0.0312-0.094-44.125-16.094-16.375 28.344 36.031 30.188c-3.458 9.1707-6.0358 18.765-7.6562 28.688l-0.0313-0.031-46.281 8.125v32.75l46.281 8.125 0.0313-0.031c1.6203 9.9223 4.1982 19.517 7.6562 28.688l-36.031 30.188 16.375 28.344 44.125-16.094 0.0312-0.094c6.3041 7.687 13.347 14.755 21.031 21.062l-0.0624 0.031-16.094 44.125 28.344 16.375 30.156-36.031v-0.0312c9.1783 3.4637 18.787 6.0647 28.719 7.6875l-0.0313 0.031 8.125 46.281h32.719l8.125-46.281-0.0312-0.031c9.9296-1.6184 19.541-4.1977 28.719-7.6563l30.187 36.031 28.344-16.375-16.125-44.125c7.6669-6.2915 14.706-13.335 21-21l44.156 16.094 16.344-28.344-36-30.188c3.4588-9.1719 6.0668-18.764 7.6875-28.688l46.281-8.0937v-32.75l-46.281-8.125c-1.621-9.9131-4.2322-19.494-7.6875-28.656l36-30.188-16.344-28.344-44.156 16.094c-6.2938-7.6652-13.333-14.708-21-21l16.125-44.125-28.344-16.375-30.187 36.031c-9.1775-3.4583-18.789-6.0378-28.719-7.6562l0.0312-0.031-8.125-46.281h-32.719zm16.375 79.688c63.71 0 115.38 51.634 115.38 115.34 0 63.71-51.665 115.34-115.38 115.34-63.71 0-115.34-51.634-115.34-115.34 0-63.71 51.634-115.34 115.34-115.34z" fill="#e0e0e0"/> |
| </g> |
| <g> |
| <ellipse cx="150.644495" cy="290.25" rx="29.144542" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(132.3289 283.25)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="6.9806354" y="11" textLength="22.669922">html</tspan> |
| </text> |
| <ellipse cx="76.144495" cy="388.25" rx="29.144542" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(57.8289 381.25)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="4.96794" y="11" textLength="26.695312">head</tspan> |
| </text> |
| <ellipse cx="183.1445" cy="388.25" rx="29.144542" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(164.8289 381.25)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="5.304854" y="11" textLength="26.021484">body</tspan> |
| </text> |
| <line x1="135.061325" y1="310.74867" x2="91.727665" y2="367.75133" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="158.39821" y1="313.63042" x2="175.39078" y2="364.86958" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <ellipse cx="130.18356" cy="487.75" rx="29.144542" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(111.86796 480.75)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="8.641768" y="11" textLength="19.347656">nav</tspan> |
| </text> |
| <ellipse cx="233.18356" cy="490.25" rx="29.144542" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(214.86796 483.25)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="2.3107135" y="11" textLength="32.009766">article</tspan> |
| </text> |
| <ellipse cx="136.53906" cy="568.75" rx="35.500057" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(113.13906 561.75)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="4.7173828" y="11" textLength="37.365234">header</tspan> |
| </text> |
| <ellipse cx="213.5" cy="566.75" rx="35.500057" ry="24.250039" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(190.1 559.75)" fill="black"> |
| <tspan font-family="Helvetica" font-size="12" font-weight="500" x="4.3892578" y="11" textLength="38.021484">section</tspan> |
| </text> |
| <line x1="171.3394" y1="410.42874" x2="141.98865" y2="465.57126" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="194.16163" y1="410.7074" x2="222.16642" y2="467.7926" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="212.32857" y1="507.18958" x2="159.38946" y2="550.18964" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="227.08153" y1="513.96547" x2="219.64588" y2="542.86407" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="253.83015" y1="507.36535" x2="301.03906" y2="546.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="301.03906" y1="546.5" x2="331.0039" y2="572.6914" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="249.6333" y1="510.27333" x2="279.39453" y2="546.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="242.80672" y1="513.14585" x2="256.32805" y2="545.3164" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="256.32805" y1="545.3164" x2="269.04297" y2="574.0586" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="279.39453" y1="546.5" x2="300.27344" y2="571.11328" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="73.34009" y1="412.38817" x2="67.34375" y2="464" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="65.847823" y1="410.94252" x2="42" y2="463.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="114.33451" y1="508.10675" x2="86" y2="544.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="107.61227" y1="503.0939" x2="57" y2="537.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="125.923996" y1="591.8957" x2="101.03906" y2="646.15625" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="142.44099" y1="592.66447" x2="155.62891" y2="646.10156" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="205.9535" y1="590.44877" x2="188.78899" y2="644.35156" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="219.53639" y1="590.6489" x2="232.61719" y2="642.4375" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="227.25017" y1="589.114" x2="261.28899" y2="644.47656" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="233.18122" y1="586.93766" x2="289.40234" y2="644.60547" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <line x1="42" y1="463.5" x2="33" y2="483.39844" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="67" y1="466" x2="65" y2="484.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="57" y1="537.5" x2="25" y2="558.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="86" y1="544.5" x2="63" y2="574.5" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="101.03906" y1="646.15625" x2="87.5" y2="675.51562" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="155.62891" y1="646.10156" x2="160.63672" y2="672.52734" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="188.78899" y1="644.35156" x2="182.94531" y2="672.04297" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="232.61719" y1="642.4375" x2="239.16406" y2="668.14062" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="261.28899" y1="644.47656" x2="276.6289" y2="669.4883" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <line x1="289.40234" y1="644.60547" x2="316.00781" y2="670.1797" stroke="#1d5aab" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke-dasharray="1,4" /> |
| <text transform="translate(342.24942 80.5)" fill="black"> |
| <tspan font-family="Helvetica Neue" font-size="22" font-weight="500" x=".161" y="21" textLength="249.678">article > header + section</tspan> |
| </text> |
| <g id="compiledSelector"> |
| <rect x="411.58425" y="434" width="130.33033" height="56.75" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <g transform="translate(428, 399) scale(0.10)"> |
| <path id="WorkGear" d="m469.34 451.62-8.125 46.281 0.0313 0.031c-9.9316 1.6228-19.54 4.2238-28.719 7.6875v-0.031l-30.156-36.031-28.344 16.375 16.094 44.125 0.0624 0.031c-7.6842 6.3076-14.727 13.375-21.031 21.063l-0.0312-0.094-44.125-16.094-16.375 28.344 36.031 30.188c-3.458 9.1707-6.0358 18.765-7.6562 28.688l-0.0313-0.031-46.281 8.125v32.75l46.281 8.125 0.0313-0.031c1.6203 9.9223 4.1982 19.517 7.6562 28.688l-36.031 30.188 16.375 28.344 44.125-16.094 0.0312-0.094c6.3041 7.687 13.347 14.755 21.031 21.062l-0.0624 0.031-16.094 44.125 28.344 16.375 30.156-36.031v-0.0312c9.1783 3.4637 18.787 6.0647 28.719 7.6875l-0.0313 0.031 8.125 46.281h32.719l8.125-46.281-0.0312-0.031c9.9296-1.6184 19.541-4.1977 28.719-7.6563l30.187 36.031 28.344-16.375-16.125-44.125c7.6669-6.2915 14.706-13.335 21-21l44.156 16.094 16.344-28.344-36-30.188c3.4588-9.1719 6.0668-18.764 7.6875-28.688l46.281-8.0937v-32.75l-46.281-8.125c-1.621-9.9131-4.2322-19.494-7.6875-28.656l36-30.188-16.344-28.344-44.156 16.094c-6.2938-7.6652-13.333-14.708-21-21l16.125-44.125-28.344-16.375-30.187 36.031c-9.1775-3.4583-18.789-6.0378-28.719-7.6562l0.0312-0.031-8.125-46.281h-32.719zm16.375 79.688c63.71 0 115.38 51.634 115.38 115.34 0 63.71-51.665 115.34-115.38 115.34-63.71 0-115.34-51.634-115.34-115.34 0-63.71 51.634-115.34 115.34-115.34z" fill="#e0e0e0"/> |
| </g> |
| <text transform="translate(416.58425 451.375)" fill="black"> |
| <tspan font-family="Helvetica" font-size="18" font-weight="500" x="6.6441677" y="18" textLength="107.04199">Native Binary</tspan> |
| </text> |
| </g> |
| <line class="arrow htmlMatchingInputArrow" x1="175.26025" y1="303.2427" x2="411.5823" y2="427.97843" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="arrow headMatchingInputArrow" x1="105.28899" y1="387.5" x2="398.9386" y2="446.69073" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="arrow bodyMatchingInputArrow" x1="212.28899" y1="390.5" x2="399.13581" y2="441.2812" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="arrow navMatchingInputArrow" x1="159.21656" y1="485.62425" x2="398.7187" y2="468.08829" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="arrow articleMatchingInputArrow" x1="262.05781" y1="486.94547" x2="398.76791" y2="471.29963" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="arrow headerMatchingInputArrow" x1="168.827" y1="558.6544" x2="399.27207" y2="486.60017" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="arrow sectionMatchingInputArrow" x1="244.2105" y1="554.57368" x2="399.59243" y2="492.96675" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <g id="FailCase"> |
| <path d="M 407.24942 601.5 L 446.74942 601.5 C 460.55654 601.5 471.74942 612.69288 471.74942 626.5 L 471.74942 633.25 C 471.74942 647.0571 460.55654 658.25 446.74942 658.25 L 407.24942 658.25 C 393.4423 658.25 382.24942 647.0571 382.24942 633.25 L 382.24942 626.5 C 382.24942 612.69288 393.4423 601.5 407.24942 601.5 Z" |
| stroke="#992727" stroke-linecap="round" stroke-linejoin="round" stroke-width="3" /> |
| <text transform="translate(387.24942 620.375)" fill="#992727"> |
| <tspan font-family="Helvetica" font-size="16" font-weight="500" fill="#992727" x="26.859375" y="15" textLength="25.78125">Fail</tspan> |
| </text> |
| <line x1="468.32162" y1="490.75" x2="439.54565" y2="587.63393" marker-end="url(#FilledArrow_Marker_2)" stroke="#992727" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| </g> |
| <g id="MatchesCase"> |
| <path d="M 532.74942 601.5 L 572.24942 601.5 C 586.05654 601.5 597.24942 612.69288 597.24942 626.5 L 597.24942 633.25 C 597.24942 647.0571 586.05654 658.25 572.24942 658.25 L 532.74942 658.25 C 518.9423 658.25 507.74942 647.0571 507.74942 633.25 L 507.74942 626.5 C 507.74942 612.69288 518.9423 601.5 532.74942 601.5 Z" |
| stroke="#218041" stroke-linecap="round" stroke-linejoin="round" stroke-width="3" /> |
| <text transform="translate(512.74942 620.375)" fill="#218041"> |
| <tspan font-family="Helvetica" font-size="16" font-weight="500" fill="#218041" x="9.515625" y="15" textLength="60.46875">Match</tspan> |
| </text> |
| <line x1="489.5817" y1="490.75" x2="533.6732" y2="588.24608" marker-end="url(#FilledArrow_Marker_3)" stroke="#218041" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| </g> |
| <rect x="377.31177" y="186" width="198.87529" height="146.5" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" /> |
| <text transform="translate(382.31177 246.25)" fill="black"> |
| <tspan font-family="Helvetica" font-size="22" font-weight="500" fill="black" x="6.6148915" y="21" textLength="81.898438">CSS JIT</tspan> |
| <tspan font-family="Helvetica" font-size="22" font-weight="500" fill="black" x="88.12661" y="21" textLength="94.13379">Compiler</tspan> |
| </text> |
| <line class="compilationArrow" x1="476.24942" y1="118.14453" x2="476.24942" y2="173.1" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| <line class="compilationArrow" x1="476.74942" y1="332.5" x2="476.74942" y2="421.1" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" /> |
| </g> |
| </g> |
| </svg> |
| <script defer async src="clicktostart.js"></script> |
| </body> |
| |
| </html> |
