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

Fix: classe active sur le li au lieu du button dans la nav Portfolio

Browse source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-03-06 17:38:25 +01:00
parent 594d53f50e
commit 7bc6451ae5
1 changed files with 6 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/views/Portfolio.svelte
View file

@ -124,15 +124,15 @@
<nav class="portfolio-nav" aria-label="Projets"> <nav class="portfolio-nav" aria-label="Projets">
<ul role="list"> <ul role="list">
{#each projects as project, i} {#each projects as project, i}
<li> <li class="portfolio-nav-item" class:active={i === currentIndex}>
<button <button
class="portfolio-nav-item"
class:active={i === currentIndex}
aria-current={i === currentIndex ? 'true' : undefined} aria-current={i === currentIndex ? 'true' : undefined}
aria-label={project.title} aria-label={project.title}
onclick={() => { currentIndex = i; setAnchor(i) }} onclick={() => { currentIndex = i; setAnchor(i) }}
> >
{#if project.thumbnail?.length}
<img src={project.thumbnail} alt="" /> <img src={project.thumbnail} alt="" />
{/if}
<span class="portfolio-nav-number" aria-hidden="true">{String(i + 1).padStart(2, '0')}</span> <span class="portfolio-nav-number" aria-hidden="true">{String(i + 1).padStart(2, '0')}</span>
</button> </button>
</li> </li>
@ -238,7 +238,7 @@
gap: 1rem; gap: 1rem;
} }
.portfolio-nav-item { .portfolio-nav-item button {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
gap: 0.5rem; gap: 0.5rem;
@ -250,7 +250,7 @@
transition: transform 0.6s var(--ease-standard), opacity 0.6s var(--ease-standard); transition: transform 0.6s var(--ease-standard), opacity 0.6s var(--ease-standard);
} }
.portfolio-nav-item.active { .portfolio-nav-item.active button {
transform: scale(1.5) translateX(-20%); transform: scale(1.5) translateX(-20%);
opacity: 1; opacity: 1;
} }