Add 3D album art rotation and vinyl desaturation effect
- Subtle oscillating Y/X rotation with perspective for depth - Enhanced vinyl mode filter: more desaturation + sepia warmth Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -492,6 +492,7 @@ h1 {
|
||||
.player-layout {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
perspective: 800px;
|
||||
}
|
||||
|
||||
.player-details {
|
||||
@@ -504,6 +505,13 @@ h1 {
|
||||
justify-content: center;
|
||||
margin-bottom: 2rem;
|
||||
position: relative;
|
||||
transform-style: preserve-3d;
|
||||
animation: albumArt3D 8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes albumArt3D {
|
||||
0%, 100% { transform: rotateY(-8deg) rotateX(2deg); }
|
||||
50% { transform: rotateY(8deg) rotateX(-2deg); }
|
||||
}
|
||||
|
||||
.album-art-glow {
|
||||
@@ -546,7 +554,7 @@ h1 {
|
||||
width: 210px;
|
||||
height: 210px;
|
||||
margin: 45px;
|
||||
filter: saturate(0.8) brightness(0.92) contrast(1.05);
|
||||
filter: saturate(0.55) sepia(0.12) brightness(0.92) contrast(1.08);
|
||||
box-shadow:
|
||||
0 0 0 3px var(--vinyl-groove),
|
||||
0 0 0 5px var(--vinyl-ring),
|
||||
|
||||
Reference in New Issue
Block a user