Files

fix: subreddit badge fill, tagline 'to' cleanup, and comments li spacing

- Default subreddit badge background from transparent to opaque fill
  (light: #fde8e0, dark: #3d2518) so page highlights don't bleed through
- Remove lingering "to" text node from tagline when subreddit is hidden
- Hide the <li> wrapping the comments link (not just the <a>) to
  eliminate leftover whitespace in the flat-list
- Simplify popup: subreddit bg fields are now color pickers (no longer
  need transparent text-input workaround)

Co-authored-by: Cursor <cursoragent@cursor.com>

2026-08-26 15:32:33 -04:00

2.1 KiB

Raw Permalink Blame History

Firefox Reddit Tweaks Extension — Full Build

Date: 2026-08-26

Task

Design and implement a Firefox extension that reskins old Reddit post listings by moving subreddit names and comment counts into styled badge elements above each post title.

Process

Brainstorming — Explored requirements via mockup analysis and clarifying questions (old Reddit only, all pages, user-configurable colors with per-subreddit overrides, light/dark mode)
Design spec — Written, self-reviewed, committed (docs/superpowers/specs/2026-08-26-reddit-badge-tweaks-design.md)
Adversarial review — Found and resolved 9 gaps (div.thing selector, shared module loading, FOUC, teardown logic, dark mode timing, observer target, comment text parsing, permissions, storage quotas)
Implementation plan — 4 tasks, committed (docs/superpowers/plans/2026-08-26-reddit-badge-tweaks.md)
Subagent-driven execution — Each task dispatched to implementer, then reviewed:
- Task 1: Manifest + settings module + icons
- Task 2: Badge CSS with FOUC prevention
- Task 3: Badge DOM manipulation with MutationObservers
- Task 4: Settings popup UI
Final review — Found 1 Critical (disabled-state hides UI), 2 Important (shallow merge, fire-and-forget saves). All fixed.

Files Created

manifest.json — Extension manifest (MV2)
lib/settings.js — Settings read/write module
content/styles/badges.css — Badge styling + FOUC prevention
content/tweaks/badges.js — DOM manipulation + observers
content/main.js — Entry point + storage listener
popup/popup.html — Settings UI
popup/popup.css — Settings styling
popup/popup.js — Settings logic
icons/icon-48.png, icons/icon-96.png — Placeholder icons

Follow-up Items

Manual QA in Firefox via about:debugging (test checklist in spec, items 1-15)
Replace placeholder icons with proper design
Optional: extract subreddit name helper for DRY
Optional: add error handling to loadSettings() / init()
Optional: support transparent backgrounds in per-subreddit overrides

2.1 KiB Raw Permalink Blame History