feat: add noodle for national gif day

[MatteoGabriele]

🧭 Context

National GIF Day Noodle

📚 Description

I've added a new noodle for GIF Day. The current GIFs can be replaced with anything we like; we could even vote on them, if we find a decent way.

For now, each letter has a GIF that starts with that letter.

N = Nicolas Cage
P = Party
M = Minions
X = X-Men

The "./" symbol is an exception: for now, it's a random cat! (you gotta have a cat)

Screen.Recording.2026-07-21.at.22.24.48.mov

This is the motion-safe version

Screen.Recording.2026-07-22.at.08.59.17.mov

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Jul 23, 2026 9:21pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Jul 23, 2026 9:21pm
npmx-lunaria	Ignored		Jul 23, 2026 9:21pm

[coderabbitai]

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

• @coderabbitai resume to resume automatic reviews.
• @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

• ▶️ Resume reviews
• 🔍 Trigger review

📝 Walkthrough

Walkthrough

The PR adds a GIF Day noodle with animated GIF text, 5 September 2026 activation metadata, catalogue information, Baloo 2 typography, Tenor CSP support, adjusted tagline alignment, and accessibility coverage.

Changes

GIF Day noodle

Layer / File(s)	Summary
GIF text and logo components app/components/Noodle/GifDay/*	Adds typed GIF text rendering with image preloading and configurable background positioning and sizing, then composes individual characters into the GIF Day logo.
Noodle registration and metadata app/components/Noodle/index.ts, app/noodles.ts	Registers gif-day for 5 September 2026 and adds its catalogue metadata, author, description, and reference.
Styling, CSP, and accessibility validation nuxt.config.ts, uno.theme.ts, modules/security-headers.ts, app/components/Landing/IntroHeader.vue, test/nuxt/a11y.spec.ts	Adds Baloo 2 configuration, permits Tenor media images, removes tagline centring and width utilities, and audits both GIF Day components for accessibility.

Sequence Diagram(s)

sequenceDiagram
participant NoodleRegistry
participant NoodleGifDayLogo
participant NoodleGifDayGifText
participant Tenor
NoodleRegistry->>NoodleGifDayLogo: resolve active gif-day logo
NoodleGifDayLogo->>NoodleGifDayGifText: pass character and GIF metadata
NoodleGifDayGifText->>Tenor: preload background GIF
Tenor-->>NoodleGifDayGifText: complete image loading
NoodleGifDayGifText-->>NoodleGifDayLogo: render GIF-backed character

Loading

Possibly related PRs

• npmx-dev/npmx.dev#2778: Uses the shared noodle registration and accessibility-test paths for another noodle.
• npmx-dev/npmx.dev#2779: Builds on the noodle archive and logo-resolution paths extended here.
• npmx-dev/npmx.dev#3038: Updates the same active-noodle and logo lookup paths.

Suggested reviewers:ghostdevv, danielroe, gameroman

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly matches the change: adding a new noodle for National GIF Day.
Description check	✅ Passed	The description is directly about the GIF Day noodle and its GIF-backed letter treatment.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[codecov]

Codecov Report

❌ Patch coverage is 86.66667% with 2 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
app/components/Noodle/GifDay/GifText.vue	90.90%	0 Missing and 1 partial ⚠️
app/noodles.ts	0.00%	1 Missing ⚠️

📢 Thoughts on this report? Let us know!

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@app/components/Noodle/GifDay/Logo.vue`:
- Around line 8-13: Update the textArray entry for './' in the Logo component to
contain multiple Matrix GIF URLs and select among them with an SSR-safe
randomization approach, ensuring server and client rendering remain consistent
while enabling random Matrix GIF display.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 17805e8a-8277-4ffb-a8ee-faf62327eda4

📥 Commits

Reviewing files that changed from the base of the PR and between 7c506b5 and e21c5de.

📒 Files selected for processing (9)

• app/components/Landing/IntroHeader.vue
• app/components/Noodle/GifDay/GifText.vue
• app/components/Noodle/GifDay/Logo.vue
• app/components/Noodle/index.ts
• app/noodles.ts
• modules/security-headers.ts
• nuxt.config.ts
• test/nuxt/a11y.spec.ts
• uno.theme.ts

[graphieros]

The cat's eye is genius

[ghostdevv]

petition for N to be for nan, as in "you're joking not another one" lady :p

https://giphy.com/gifs/bbc-one-uk-uFiaMyDjtxoE6Q1gCU

[MatteoGabriele]

ahahah I've never seen that one 🤣
I am not sure it works because it is really much based on lip-reading or knowing it.
What do you think?

Screen.Recording.2026-07-22.at.22.05.16.mov

[ghostdevv]

ahahah I've never seen that one 🤣 I am not sure it works because it is really much based on lip-reading or knowing it. What do you think?
Screen.Recording.2026-07-22.at.22.05.16.mov

I love it too much I'm biased, please overrule me xD

[graphieros]

Love it!
You've been Zucked! 🌿

[MatteoGabriele]

I need to fix some hydration issues. I might use the pre hydrate hook to set the styles. That should fix it