diff --git a/app/components/Landing/IntroHeader.vue b/app/components/Landing/IntroHeader.vue index d3c4444004..0b10a2bdd6 100644 --- a/app/components/Landing/IntroHeader.vue +++ b/app/components/Landing/IntroHeader.vue @@ -126,7 +126,7 @@ onPrehydrate(el => { />

{{ $t('tagline') }}

diff --git a/app/components/Noodle/GifDay/GifText.vue b/app/components/Noodle/GifDay/GifText.vue new file mode 100644 index 0000000000..267cfcc928 --- /dev/null +++ b/app/components/Noodle/GifDay/GifText.vue @@ -0,0 +1,30 @@ + + + + + diff --git a/app/components/Noodle/GifDay/Logo.vue b/app/components/Noodle/GifDay/Logo.vue new file mode 100644 index 0000000000..24e2082ee9 --- /dev/null +++ b/app/components/Noodle/GifDay/Logo.vue @@ -0,0 +1,58 @@ + + + diff --git a/app/components/Noodle/index.ts b/app/components/Noodle/index.ts index 9e611daf54..2912126f96 100644 --- a/app/components/Noodle/index.ts +++ b/app/components/Noodle/index.ts @@ -9,6 +9,7 @@ import NoodlePride2Logo from './Pride2/Logo.vue' import NoodlePride3Logo from './Pride3/Logo.vue' import NoodleTetrisLogo from './Tetris/Logo.vue' import NoodleEmojiDayLogo from './EmojiDay/Logo.vue' +import NoodleGifDayLogo from './GifDay/Logo.vue' export type Noodle = { // Unique identifier for the noodle @@ -72,6 +73,13 @@ export const ACTIVE_NOODLES: Noodle[] = [ dateTo: '2026-07-19', timezone: 'auto', }, + { + key: 'gif-day', + logo: NoodleGifDayLogo, + date: '2026-09-05', + dateTo: '2026-09-05', + timezone: 'auto', + }, ] // Logo registry for the /noodles archive, keyed by the entry's `key` in @@ -86,6 +94,7 @@ const NOODLE_LOGOS: Record = { 'pride-1': NoodlePride1Logo, 'tetris': NoodleTetrisLogo, 'emoji-day': NoodleEmojiDayLogo, + 'gif-day': NoodleGifDayLogo, } export function resolveNoodleLogo(key: string): Component | undefined { diff --git a/app/noodles.ts b/app/noodles.ts index e759d6f8d4..0655ec1065 100644 --- a/app/noodles.ts +++ b/app/noodles.ts @@ -8,6 +8,7 @@ const ALFON = { name: 'Alfon', blueskyHandle: 'alfon.dev' } const GRAPHIEROS = { name: 'Graphieros', blueskyHandle: 'graphieros.npmx.social' } const FELIX = { name: 'Felix Schneider', blueskyHandle: 'felixs.dev' } const JVIIDE = { name: 'Joachim Viide', blueskyHandle: 'jviide.iki.fi' } +const MATTEO = { name: 'Matteo Gabriele', blueskyHandle: 'matteogabriele.bsky.social' } const entries: Noodle[] = [ { @@ -151,6 +152,24 @@ const entries: Noodle[] = [ { label: 'Wikipedia', url: 'https://en.wikipedia.org/wiki/World_Emoji_Day' }, ], }, + + { + key: 'gif-day', + title: 'National GIF Day', + slug: 'gif-day', + date: '2026-09-5', + timezone: 'auto', + tagline: false, + occasion: 'National GIF day', + prUrl: 'https://github.com/npmx-dev/npmx.dev/pull/2778', + authors: [MATTEO], + references: [ + { + label: 'National GIF day', + url: 'https://www.whatnationaldayisit.com/day/Gif/', + }, + ], + }, ] export const noodles: Noodle[] = [...entries].sort( diff --git a/modules/security-headers.ts b/modules/security-headers.ts index 25b6b2a63d..3835791543 100644 --- a/modules/security-headers.ts +++ b/modules/security-headers.ts @@ -36,6 +36,7 @@ export default defineNuxtModule({ 'https://cdn.bsky.app', 'https://video.bsky.app', 'https://video.cdn.bsky.app', + 'https://media1.tenor.com', ] const imgSrc = [ "'self'", diff --git a/nuxt.config.ts b/nuxt.config.ts index 1c2fbca1fa..43b55b19cf 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -321,6 +321,11 @@ export default defineNuxtConfig({ global: true, subsets: ['arabic'], }, + { + name: 'Baloo 2', + weights: [800], + global: true, + }, ], }, diff --git a/test/nuxt/a11y.spec.ts b/test/nuxt/a11y.spec.ts index d9e4412fde..f7958b9b10 100644 --- a/test/nuxt/a11y.spec.ts +++ b/test/nuxt/a11y.spec.ts @@ -171,6 +171,8 @@ import { NoodleLens, NoodlePride3Logo, NoodleTetrisLogo, + NoodleGifDayLogo, + NoodleGifDayGifText, LinkBase, CallToAction, ChangelogCard, @@ -463,6 +465,23 @@ describe('component accessibility audits', () => { const results = await runAxe(component) expect(results.violations).toEqual([]) }) + + it('should have no accessibility violations', async () => { + const component = await mountSuspended(NoodleGifDayGifText, { + props: { + text: 'N', + backgroundUrl: 'some_image_here.gif', + }, + }) + const results = await runAxe(component) + expect(results.violations).toEqual([]) + }) + + it('should have no accessibility violations', async () => { + const component = await mountSuspended(NoodleGifDayLogo) + const results = await runAxe(component) + expect(results.violations).toEqual([]) + }) }) describe('AppFooter', () => { diff --git a/uno.theme.ts b/uno.theme.ts index f0325dc810..4479e49758 100644 --- a/uno.theme.ts +++ b/uno.theme.ts @@ -5,6 +5,7 @@ export const theme = { font: { mono: "'Geist Mono', 'IBM Plex Sans Arabic', monospace", sans: "'Geist', 'IBM Plex Sans Arabic', system-ui, -apple-system, sans-serif", + noodle: "'Baloo 2', sans-serif", }, text: { '2xs': { fontSize: '0.6875rem' }, // 11px