salam/nuhodds_fi4
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
salam committed 2026-09-10 18:28:53 +02:00
1 parent b1add2f055
commit 57bca26ad2
8 files changed
+125 -132
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

public/svg/soccerfield.svg
+67 -45
View File
@@ -1,46 +1,68 @@
<?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">
<svg width="100%" height="100%" viewBox="0 0 1063 693" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1,0,0,1,-23.815342,-23.815342)">
<g transform="matrix(0,10,-10,0,1080,30)">
<rect id="Border" x="0" y="0" width="68" height="105" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<path id="Centre-line" serif:id="Centre line" d="M0,52.5l68,0" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<circle id="Centre-circle" serif:id="Centre circle" cx="34" cy="52.5" r="9.15" style="fill:none;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<circle id="Centre-mark" serif:id="Centre mark" cx="34" cy="52.5" r="0.75" style="fill:none;stroke:#ffffff;stroke-width:0.3px;stroke-linejoin:round;stroke-miterlimit:2;"/>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<g id="Penalty-area" serif:id="Penalty area">
<path id="Penalty-area-line" serif:id="Penalty area line" d="M13.84,0l0,16.5l40.32,0l0,-16.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<path id="Goal-area-line" serif:id="Goal area line" d="M24.84,0l0,5.5l18.32,0l0,-5.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<circle id="Penalty-mark" serif:id="Penalty mark" cx="34" cy="10.94" r="0.75" style="fill:none;stroke:#ffffff;stroke-width:0.3px;stroke-linejoin:round;stroke-miterlimit:2;"/>
<path id="Penalty-arc" serif:id="Penalty arc" d="M26.733,16.5c1.73,2.261 4.42,3.59 7.267,3.59c2.847,0 5.537,-1.329 7.267,-3.59" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<g id="Penalty-area1" serif:id="Penalty area" transform="matrix(-1,-0,0,-1,68,105)">
<path id="Penalty-area-line1" serif:id="Penalty area line" d="M13.84,0l0,16.5l40.32,0l0,-16.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<path id="Goal-area-line1" serif:id="Goal area line" d="M24.84,0l0,5.5l18.32,0l0,-5.5" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
<circle id="Penalty-mark1" serif:id="Penalty mark" cx="34" cy="10.94" r="0.75" style="fill:none;stroke:#ffffff;stroke-width:0.3px;stroke-linejoin:round;stroke-miterlimit:2;"/>
<g transform="matrix(0,0.1,-0.1,0,71,-3)">
<use xlink:href="#_Image1" x="27" y="27" width="1056px" height="686px"/>
</g>
<g transform="matrix(0,0.1,-0.1,0,71,-3)">
<use xlink:href="#_Image2" x="27" y="27" width="1056px" height="686px"/>
</g>
<g transform="matrix(0,0.1,-0.1,0,71,-3)">
<use xlink:href="#_Image3" x="27" y="27" width="1056px" height="686px"/>
</g>
<path id="Penalty-arc1" serif:id="Penalty arc" d="M26.733,16.5c1.73,2.261 4.42,3.59 7.267,3.59c2.847,0 5.537,-1.329 7.267,-3.59" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
</g>
<g transform="matrix(0,10,-10,0,1080,30)">
<path id="Corner-arcs" serif:id="Corner arcs" d="M0,2c1.097,0 2,-0.903 2,-2m64,0c0,1.097 0.903,2 2,2m0,101c-1.097,0 -2,0.903 -2,2m-64,0c0,-1.097 -0.903,-2 -2,-2" style="fill:none;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.3px;"/>
</g>
</g>
<svg xmlns="http://w3.org" viewBox="0 0 700 500" width="100%" height="100%">
<defs>
<!-- Definition für die helleren Rasenstreifen -->
<pattern id="grass-stripes" width="100" height="500" patternUnits="userSpaceOnUse">
<rect x="0" y="0" width="50" height="500" fill="#2d8a4e" />
<rect x="50" y="0" width="50" height="500" fill="#359a58" />
</pattern>
</defs>
<!-- 1. Rasen-Hintergrund mit Streifenmuster -->
<rect width="700" height="500" fill="url(#grass-stripes)" />
<!-- 2. Äußere Spielfeldbegrenzung (Sicherheitsabstand von 25px zum Rand) -->
<!-- Spielfeld-Netto-Maße: 650px Länge x 450px Breite -->
<rect x="25" y="25" width="650" height="450" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Mittellinie -->
<line x1="350" y1="25" x2="350" y2="475" stroke="#ffffff" stroke-width="3" />
<!-- Anstoßkreis (Radius proportional angepasst: 60px) -->
<circle cx="350" cy="250" r="60" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Anstoßpunkt -->
<circle cx="350" cy="250" r="4" fill="#ffffff" />
<!-- ================= LINKES SPIELFELDDRITTEL ================= -->
<!-- Strafraum (100px tief, 240px breit, zentriert bei y=250) -->
<rect x="25" y="130" width="100" height="240" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Torraum / Fünfmeterraum (35px tief, 110px breit) -->
<rect x="25" y="195" width="35" height="110" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Elfmeterpunkt (75px von der Torlinie entfernt) -->
<circle cx="100" cy="250" r="4" fill="#ffffff" />
<!-- Strafraumkreisbogen (Teilkreis am Strafraum) -->
<path d="M 125,200 A 60,60 0 0,1 125,300" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Linkes Tor (Außerhalb des Spielfelds gezeichnet) -->
<rect x="5" y="215" width="20" height="70" fill="none" stroke="#ffffff" stroke-width="3" opacity="0.8" />
<!-- ================= RECHTES SPIELFELDDRITTEL ================= -->
<!-- Strafraum (100px tief von rechts, 240px breit) -->
<rect x="575" y="130" width="100" height="240" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Torraum / Fünfmeterraum (35px tief von rechts, 110px breit) -->
<rect x="640" y="195" width="35" height="110" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Elfmeterpunkt (75px von der rechten Torlinie entfernt) -->
<circle cx="600" cy="250" r="4" fill="#ffffff" />
<!-- Strafraumkreisbogen (Teilkreis am Strafraum rechts) -->
<path d="M 575,200 A 60,60 0 0,0 575,300" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Rechtes Tor -->
<rect x="675" y="215" width="20" height="70" fill="none" stroke="#ffffff" stroke-width="3" opacity="0.8" />
<!-- ================= ECKFAHNEN-BÖGEN ================= -->
<!-- Oben Links -->
<path d="M 25,40 A 15,15 0 0,0 40,25" fill="none" stroke="#ffffff" stroke-width="2" />
<!-- Unten Links -->
<path d="M 40,475 A 15,15 0 0,0 25,460" fill="none" stroke="#ffffff" stroke-width="2" />
<!-- Oben Rechts -->
<path d="M 660,25 A 15,15 0 0,0 675,40" fill="none" stroke="#ffffff" stroke-width="2" />
<!-- Unten Rechts -->
<path d="M 675,460 A 15,15 0 0,0 660,475" fill="none" stroke="#ffffff" stroke-width="2" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB