2023-12-24 13:27:10 +01:00
|
|
|
<!-- __SDEFILE__ - This file is a dependency for the stand-alone environment -->
|
2023-11-11 18:55:28 +01:00
|
|
|
<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="2000" height="1500" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 2000 1500">
|
|
|
|
|
<defs>
|
|
|
|
|
<path id="path" d="M 30 -35 l 0 191" style="fill: none; stroke-linejoin: round;"/>
|
|
|
|
|
</defs>
|
|
|
|
|
<style type="text/css"><![CDATA[
|
|
|
|
|
path {fill: none; stroke-linejoin: round;}
|
|
|
|
|
.tape {stroke: #000; stroke-width: 20px; stroke-linecap: butt;}
|
|
|
|
|
.redtape {stroke: #f00; stroke-width: 1px;stroke-linecap: round;}
|
|
|
|
|
.color {stroke: #fff86c; stroke-width: 16px; stroke-linecap: butt;}
|
|
|
|
|
.cm {stroke: #000; stroke-width: 16px; stroke-dasharray: 2 10; stroke-linecap: butt;}
|
|
|
|
|
.line {stroke: #000; stroke-width: 3px; stroke-dasharray: 8 5; stroke-linecap: round;}
|
|
|
|
|
]]></style>
|
|
|
|
|
|
|
|
|
|
<!-- Background image -->
|
|
|
|
|
<image xlink:href="./seated.jpg" x="0" y="0" width="2000" height="1500" />
|
|
|
|
|
|
|
|
|
|
<g transform="translate(1450 700)">
|
|
|
|
|
<use x="0" y="0" xlink:href="#path" class="redtape">
|
|
|
|
|
<animate attributeType="CSS" attributeName="stroke-width" from="1" to="450" begin="loop.begin+2.5s" dur="0.5s" fill="freeze" />
|
|
|
|
|
<animate attributeType="CSS" attributeName="stroke-opacity" from="1" to="0" begin="loop.begin+2.7s" dur="0.3s" fill="freeze" />
|
|
|
|
|
</use>
|
|
|
|
|
<use x="0" y="0" xlink:href="#path" class="tape"/>
|
|
|
|
|
<use x="0" y="0" xlink:href="#path" class="color"/>
|
|
|
|
|
<use x="0" y="0" xlink:href="#path" class="cm"/>
|
|
|
|
|
</g>
|
|
|
|
|
|
|
|
|
|
<!-- Helplines -->
|
|
|
|
|
<g>
|
|
|
|
|
<path id="hipline" class="line" d="M 1350 670 l 160 0 ">
|
|
|
|
|
<animate attributeType="CSS" attributeName="stroke-dashoffset" from="0" to="13" dur="1s" repeatDur="indefinite" />
|
|
|
|
|
</path>
|
|
|
|
|
</g>
|
|
|
|
|
|
|
|
|
|
<!-- timing loop -->
|
|
|
|
|
<rect height="1" width="1" x="-10" y="-10">
|
|
|
|
|
<animate attributeType="CSS" attributeName="visibility" from="hide" to="hide" begin="0;loop.end" dur="4s" id="loop" />
|
|
|
|
|
</rect>
|
|
|
|
|
</svg>
|
