studio-variable/world-game
3
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

Refactor: styles GalleryAnimation migrés dans le composant

Browse source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-03-06 18:11:31 +01:00
parent 6151dd5a31
commit 47be2b4662
3 changed files with 62 additions and 66 deletions
Download patch file Download diff file Expand all files Collapse all files

62
src/components/ui/GalleryAnimation.svelte
View file

@ -59,3 +59,65 @@
</div>
{/each}
</div>
<style>
.gallery-animation {
width: 100%;
height: 100%;
overflow: hidden;
}
/* Vertical mode (Portfolio) */
.gallery-animation--vertical {
display: flex;
flex-direction: row;
gap: 8px;
}
.gallery-animation--vertical :global(.gallery-animation__column) {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
}
.gallery-animation--vertical :global(.gallery-animation__track) {
display: flex;
flex-direction: column;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
.gallery-animation--vertical :global(.gallery-animation__column:nth-child(odd) .gallery-animation__track) {
animation-name: galleryScrollDown;
animation-duration: var(--gallery-duration);
}
.gallery-animation--vertical :global(.gallery-animation__column:nth-child(even) .gallery-animation__track) {
animation-name: galleryScrollUp;
animation-duration: var(--gallery-duration);
}
:global(.gallery-animation__image) {
width: 100%;
height: auto;
display: block;
object-fit: contain;
}
@keyframes galleryScrollDown {
from { transform: translateY(0); }
to { transform: translateY(-50%); }
}
@keyframes galleryScrollUp {
from { transform: translateY(-50%); }
to { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
:global(.gallery-animation__track) {
animation: none;
}
}
</style>