feat(design): Wellen in der Seitenleiste von Aura rollen
Die festen Huegel weichen drei Wellenkacheln (aura-wave-back/mid/front). Jede ist genau eine Sinusperiode breit, wiederholt sich waagerecht und wandert in 40 s um ihre eigene Kachelbreite - nahtlos und in beiden Modi. Unterschiedliche Kachelbreiten ergeben unterschiedliche Geschwindigkeiten. Loest aura-hills ab; bei prefers-reduced-motion stehen die Wellen still. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
49c03f5e1b
commit
2d84bac91d
@@ -0,0 +1,12 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 235" width="400" height="235" preserveAspectRatio="none">
|
||||
<!--
|
||||
Aura, Seitenleiste: eine Wellenlage. Genau eine Sinusperiode ueber die
|
||||
Breite der Kachel - deshalb passt sie waagerecht nahtlos an sich selbst,
|
||||
und index.css kann sie endlos durchschieben, ohne dass es ruckt.
|
||||
|
||||
Drei solche Kacheln liegen uebereinander (aura-wave-back.svg ist eine davon); jede ist
|
||||
anders breit und wandert deshalb bei gleicher Dauer unterschiedlich
|
||||
schnell - das gibt Tiefe.
|
||||
-->
|
||||
<path d="M0 40.0 L10 41.4 L20 42.8 L30 44.1 L40 45.3 L50 46.4 L60 47.3 L70 48.0 L80 48.6 L90 48.9 L100 49.0 L110 48.9 L120 48.6 L130 48.0 L140 47.3 L150 46.4 L160 45.3 L170 44.1 L180 42.8 L190 41.4 L200 40.0 L210 38.6 L220 37.2 L230 35.9 L240 34.7 L250 33.6 L260 32.7 L270 32.0 L280 31.4 L290 31.1 L300 31.0 L310 31.1 L320 31.4 L330 32.0 L340 32.7 L350 33.6 L360 34.7 L370 35.9 L380 37.2 L390 38.6 L400 40.0 L400 235 L0 235 Z" fill="#c7b8e8" opacity="0.55" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1012 B |
Reference in New Issue
Block a user