Skip to content

Commit 05863b4

Browse files
p4gsclaudehappy-otter
committed
feat: flicker effect only on "Nth" letters, remove from tagline
- neon-flicker animation now targets only the first 3 letters (N,t,h) via .lava-text:first-child > .lava-letter:nth-child(-n+3) - Wider flicker windows (17-27% and 52-56%) with deeper dip (0.65) for more noticeable effect - Removed flicker animation from hero-tagline subtitle Generated with [Claude Code](https://claude.ai/code) via [Happy](https://happy.engineering) Co-Authored-By: Claude <noreply@anthropic.com> Co-Authored-By: Happy <yesreply@happy.engineering>
1 parent 9289b3d commit 05863b4

1 file changed

Lines changed: 7 additions & 4 deletions

File tree

docs/projects/nthpartyfinder/index.html

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -316,11 +316,11 @@
316316
100% { background-position: 100% 50%; }
317317
}
318318
@keyframes neon-flicker {
319-
0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
319+
0%, 17%, 21%, 23%, 27%, 52%, 56%, 100% {
320320
opacity: 1;
321321
}
322-
20%, 24%, 55% {
323-
opacity: 0.82;
322+
18%, 22%, 24%, 53%, 55% {
323+
opacity: 0.65;
324324
}
325325
}
326326
.lava-text { display: inline; }
@@ -332,6 +332,10 @@
332332
-webkit-background-clip: text;
333333
background-clip: text;
334334
-webkit-text-fill-color: transparent;
335+
animation: lava-flow 8s ease-in-out infinite;
336+
animation-delay: calc(var(--i) * -0.6s);
337+
}
338+
.hero-title > .lava-text:first-child > .lava-letter:nth-child(-n+3) {
335339
animation: lava-flow 8s ease-in-out infinite, neon-flicker 4s infinite;
336340
animation-delay: calc(var(--i) * -0.6s), 0s;
337341
}
@@ -364,7 +368,6 @@
364368
0%,19%,21%,23%,25%,54%,56%,100% { opacity:1; }
365369
20%,24%,55% { opacity:.5; }
366370
}
367-
.hero-tagline { animation: flicker 4s infinite; }
368371

369372
.hero-desc {
370373
font-size: 1.1rem;

0 commit comments

Comments
 (0)