feat: add EU data hosting badge with SVG image to login page

This commit is contained in:
Johannes Millan 2026-01-22 16:40:34 +01:00
parent 169cdf6551
commit b05b0400ed
2 changed files with 31 additions and 89 deletions

View file

@ -0,0 +1,27 @@
<svg viewBox="0 0 640 480" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<g id="eu-d">
<g id="eu-b">
<path id="eu-a" d="m0-1-.3 1 .5.1z"/>
<use xlink:href="#eu-a" transform="scale(-1 1)"/>
</g>
<g id="eu-c">
<use xlink:href="#eu-b" transform="rotate(72)"/>
<use xlink:href="#eu-b" transform="rotate(144)"/>
</g>
<use xlink:href="#eu-c" transform="scale(-1 1)"/>
</g>
</defs>
<g fill="#fc0" transform="translate(320 240)scale(23.7037)">
<use xlink:href="#eu-d" width="100%" height="100%" y="-6"/>
<use xlink:href="#eu-d" width="100%" height="100%" y="6"/>
<g id="eu-e">
<use xlink:href="#eu-d" width="100%" height="100%" x="-6"/>
<use xlink:href="#eu-d" width="100%" height="100%" transform="rotate(-144 -2.3 -2.1)"/>
<use xlink:href="#eu-d" width="100%" height="100%" transform="rotate(144 -2.1 -2.3)"/>
<use xlink:href="#eu-d" width="100%" height="100%" transform="rotate(72 -4.7 -2)"/>
<use xlink:href="#eu-d" width="100%" height="100%" transform="rotate(72 -5 .5)"/>
</g>
<use xlink:href="#eu-e" width="100%" height="100%" transform="scale(-1 1)"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View file

@ -24,96 +24,11 @@
<h1>SuperSync</h1>
<p>Connect your productivity</p>
<div class="eu-badge">
<svg
<img
src="eu-stars.svg"
alt="EU Flag"
class="eu-stars"
viewBox="0 0 640 480"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs>
<g id="eu-d">
<g id="eu-b">
<path
id="eu-a"
d="m0-1-.3 1 .5.1z"
/>
<use
xlink:href="#eu-a"
transform="scale(-1 1)"
/>
</g>
<g id="eu-c">
<use
xlink:href="#eu-b"
transform="rotate(72)"
/>
<use
xlink:href="#eu-b"
transform="rotate(144)"
/>
</g>
<use
xlink:href="#eu-c"
transform="scale(-1 1)"
/>
</g>
</defs>
<g
fill="#fc0"
transform="translate(320 240)scale(23.7037)"
>
<use
xlink:href="#eu-d"
width="100%"
height="100%"
y="-6"
/>
<use
xlink:href="#eu-d"
width="100%"
height="100%"
y="6"
/>
<g id="eu-e">
<use
xlink:href="#eu-d"
width="100%"
height="100%"
x="-6"
/>
<use
xlink:href="#eu-d"
width="100%"
height="100%"
transform="rotate(-144 -2.3 -2.1)"
/>
<use
xlink:href="#eu-d"
width="100%"
height="100%"
transform="rotate(144 -2.1 -2.3)"
/>
<use
xlink:href="#eu-d"
width="100%"
height="100%"
transform="rotate(72 -4.7 -2)"
/>
<use
xlink:href="#eu-d"
width="100%"
height="100%"
transform="rotate(72 -5 .5)"
/>
</g>
<use
xlink:href="#eu-e"
width="100%"
height="100%"
transform="scale(-1 1)"
/>
</g>
</svg>
/>
<span>Data hosted in EU</span>
</div>
</header>