This commit is contained in:
Mackie 2026-05-29 09:23:37 +08:00
parent 3dc4d15861
commit f627a6ef89

View file

@ -305,10 +305,17 @@ function LogosSection({ isDark }: { isDark: boolean }) {
Skills Skills
</p> </p>
{/* Marquee track */} {/* Marquee track */}
<div style={{ overflow: 'hidden', width: '100%' }}> <div style={{ overflow: 'hidden', width: '100%' }}>
<div style={{ display: 'flex', width: 'max-content', animation: 'marquee 35s linear infinite' }}> <div
{[...LOGOS, ...LOGOS, ...LOGOS, ...LOGOS].map((l, i) => ( style={{
display: 'flex',
width: 'max-content',
animation: 'marquee 35s linear infinite',
}}
>
{/* Only 2 copies — animation goes to -50% which = exactly 1 copy width */}
{[...LOGOS, ...LOGOS].map((l, i) => (
<img <img
key={i} key={i}
src={l.src} src={l.src}
@ -320,12 +327,12 @@ function LogosSection({ isDark }: { isDark: boolean }) {
</div> </div>
</div> </div>
<style>{` <style>{`
@keyframes marquee { @keyframes marquee {
0% { transform: translateX(0); } 0% { transform: translateX(0); }
100% { transform: translateX(-50%); } 100% { transform: translateX(-50%); }
} }
`}</style> `}</style>
</section> </section>
) )
} }