Easter egg: Triple Red animation when all hard flags fire simultaneously #8

New issue

Closed

opened 2026-03-26 23:32:18 -07:00 by pyr0ball · 1 comment

pyr0ball commented

2026-03-26 23:32:18 -07:00

Owner

Description

When a listing triggers all three hard red flags at once — new_account, established_bad_actor, and suspicious_price — animate the ListingCard with a "triple red" CSS effect to visually call out the most dangerous listings.

Design notes

CSS animation on the card border/background (pulsing red glow, or scan-line effect)
Should be distinct from the normal red flag badge display
Classic CF easter egg pattern — Konami code is the gold standard (see peregrine)
Triggers automatically on render, no user interaction required

Acceptance criteria

Animation defined in theme.css or ListingCard scoped styles
Fires only when red_flags contains at least the two hard filter flags (new_account OR established_bad_actor) plus suspicious_price
Does not interfere with card interactivity (click, enrich button)

## Description When a listing triggers all three hard red flags at once — `new_account`, `established_bad_actor`, and `suspicious_price` — animate the ListingCard with a "triple red" CSS effect to visually call out the most dangerous listings. ## Design notes - CSS animation on the card border/background (pulsing red glow, or scan-line effect) - Should be distinct from the normal red flag badge display - Classic CF easter egg pattern — Konami code is the gold standard (see peregrine) - Triggers automatically on render, no user interaction required ## Acceptance criteria - [ ] Animation defined in `theme.css` or ListingCard scoped styles - [ ] Fires only when `red_flags` contains at least the two hard filter flags (`new_account` OR `established_bad_actor`) plus `suspicious_price` - [ ] Does not interfere with card interactivity (click, enrich button)

pyr0ball commented

2026-04-04 22:47:44 -07:00

Author

Owner

Implemented in web/src/components/ListingCard.vue.

Final trigger logic (broader than original spec, intentional):

new_account OR account_under_30_days (account flag)
suspicious_price
any third hard flag: duplicate_photo, established_bad_actor, zero_feedback, OR scratch_dent_mentioned

CSS: triple-red-glow border pulse + triple-red-glitch ✗ pseudo-element that dissipates on hover. Keyframes in ListingCard scoped styles.

Implemented in `web/src/components/ListingCard.vue`. Final trigger logic (broader than original spec, intentional): - `new_account` OR `account_under_30_days` (account flag) - `suspicious_price` - any third hard flag: `duplicate_photo`, `established_bad_actor`, `zero_feedback`, OR `scratch_dent_mentioned` CSS: `triple-red-glow` border pulse + `triple-red-glitch` ✗ pseudo-element that dissipates on hover. Keyframes in ListingCard scoped styles.