Sonne bzw. Mond in der Ecke oben rechts der Leiste, dahinter ziehen Wolken in zwei Lagen langsam von links nach rechts (reines CSS, nahtlose Kacheln). Im hellen Modus fallen alle 16-24 s zwei bis drei Sonnenstrahlen diagonal ueber den Bildschirm. Bernstein bei Tag, Lavendel und Sterne bei Nacht. Bei prefers-reduced-motion still. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
23 lines
1.1 KiB
XML
23 lines
1.1 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
|
|
<!--
|
|
Aura, hell ("Sunshine"): die Sonne. Sie sitzt in der Ecke oben rechts der
|
|
Leiste und ist nur zur Haelfte zu sehen (Position in index.css). Von ihrem
|
|
Mittelpunkt gehen die Sonnenstrahlen aus (components/AuraWeather.tsx) -
|
|
wer die Groesse oder Lage aendert, muss dort SUN_* nachziehen.
|
|
-->
|
|
<defs>
|
|
<radialGradient id="schein" cx="50" cy="50" r="50" gradientUnits="userSpaceOnUse">
|
|
<stop offset="0.3" stop-color="#ffd76a" stop-opacity="0.9" />
|
|
<stop offset="0.6" stop-color="#ffc94a" stop-opacity="0.35" />
|
|
<stop offset="1" stop-color="#ffc94a" stop-opacity="0" />
|
|
</radialGradient>
|
|
<radialGradient id="kern" cx="45" cy="45" r="22" gradientUnits="userSpaceOnUse">
|
|
<stop offset="0" stop-color="#fff6c9" />
|
|
<stop offset="0.7" stop-color="#ffd24d" />
|
|
<stop offset="1" stop-color="#ffb81f" />
|
|
</radialGradient>
|
|
</defs>
|
|
<circle cx="50" cy="50" r="50" fill="url(#schein)" />
|
|
<circle cx="50" cy="50" r="20" fill="url(#kern)" />
|
|
</svg>
|