studio-variable/world-game
4
1
Fork 0
Code Issues 15 Pull requests Projects Releases Packages Wiki Activity Actions

portfolio : galerie horizontale 3 rangées + mockup conditionnel
All checks were successful
Deploy / Deploy to Production (push) Successful in 25s
Details

Browse source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-03-24 18:53:27 +01:00
parent 133651c35d
commit cb51e050e4
2 changed files with 42 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/views/Portfolio.svelte
View file

@ -103,7 +103,7 @@
</div>
<!-- Mockup device (centre) -->
<div class="portfolio-mockup">
<div class="portfolio-mockup portfolio-mockup--{currentProject.galleryAnimationMode}">
<ResponsivePicture
src={currentProject.mockup}
srcset={currentProject.mockupSrcset}
@ -195,13 +195,21 @@
}
.portfolio-mockup {
grid-area: 6/7 / span 10 / span 4;
grid-area: 6/7 / span 10 / span 5;
z-index: var(--z-content);
display: flex;
align-items: center;
justify-content: center;
}
.portfolio-mockup--horizontal {
grid-area: 6/1 / span 10 / span 7;
}
.portfolio-mockup--horizontal :global(picture) {
transform: scale(1.25);
}
.portfolio-mockup :global(picture),
.portfolio-mockup :global(.portfolio-mockup-img) {
width: 100%;
@ -397,13 +405,17 @@
z-index: var(--z-content);
}
.portfolio-mockup--vertical {
transform: scale(.8);
}
.portfolio-mockup :global(.portfolio-mockup-img) {
height: auto;
}
/* Text — over mockup, centered */
.portfolio-text {
grid-area: 9/4/span 8/span 14;
grid-area: 10/4/span 8/span 14;
z-index: var(--z-content);
gap: .5rem;
text-align: center;
@ -464,8 +476,8 @@
}
.portfolio-nav-item img {
width: 3.75rem;
height: 3.75rem;
width: 3rem;
height: 3rem;
}
.portfolio-nav-number {