# Reddit Fonts Override

Replace old Reddit's default fonts with Reddit's modern typeface family (Reddit Sans, Reddit Sans Condensed, Reddit Mono) from the [reddit/redditsans](https://github.com/reddit/redditsans) repository.

## Scope

- Full page override — all text on old.reddit.com and www.reddit.com.
- Toggleable from the extension popup (one switch for all three families).
- Font files bundled in the extension (no external network requests).

## Font Assets

Three variable-weight woff2 files stored in `content/fonts/`:

| File | Family | Approx Size |
|---|---|---|
| `RedditSans[wght].woff2` | Reddit Sans | 96KB |
| `RedditSansCondensed[wght].woff2` | Reddit Sans Condensed | 94KB |
| `RedditMono[wght].woff2` | Reddit Mono | 81KB |

Variable fonts only — each covers all weights (Light through ExtraBold) via the `wght` axis. No italic variants initially; can be added later if needed.

Licensed under SIL Open Font License 1.1.

## CSS Architecture

New file: `content/styles/fonts.css`, registered in `manifest.json` in the `css` array.

### @font-face Declarations

Three `@font-face` blocks, one per family. Extension-relative paths (e.g., `url("../fonts/RedditSans[wght].woff2")`). Each declares `font-display: swap` and the full `font-weight` range (300–800).

### Override Rules

All overrides gated on `html.rt-fonts-enabled`:

- `html.rt-fonts-enabled` sets `font-family: 'Reddit Sans', sans-serif` on the root.
- Body, content, sidebar, footer inherit from root.
- `code`, `pre`, and `.md code` elements use `font-family: 'Reddit Mono', monospace`.
- Reddit Sans Condensed is declared but not force-applied — available as `'Reddit Sans Condensed'` for future tweaks or user stylesheets.

## Settings & Toggle

### Default

`fontOverride: true` added to `DEFAULTS` in `lib/settings.js`. On by default.

### Class Toggle

`content/main.js` toggles `html.rt-fonts-enabled` on init and on settings change, following the same pattern as `rt-card-enabled` and `rt-badges-enabled`.

### Popup

New checkbox "Reddit fonts" in the top section of `popup/popup.html`, alongside "Enabled" and "Badge layout". Wired in `popup/popup.js` the same way as existing toggles.

No per-family granularity — one switch controls all three families on or off.

## Files Changed

| File | Change |
|---|---|
| `content/fonts/RedditSans[wght].woff2` | New — bundled font asset |
| `content/fonts/RedditSansCondensed[wght].woff2` | New — bundled font asset |
| `content/fonts/RedditMono[wght].woff2` | New — bundled font asset |
| `content/styles/fonts.css` | New — @font-face declarations and override rules |
| `manifest.json` | Add `content/styles/fonts.css` to `css` array |
| `lib/settings.js` | Add `fontOverride: true` to `DEFAULTS` |
| `content/main.js` | Toggle `rt-fonts-enabled` class |
| `popup/popup.html` | Add "Reddit fonts" checkbox |
| `popup/popup.js` | Wire the new checkbox |