Add love-letters page with postcard component

[samus-aran]

• New /love-letters page displaying postcards with images and markdown quotes
• Postcard component using useMemo, with markdown-it for link support
• Content sourced from content/love-letters/postcards.md for easy editing
• Heart icon and nav link added after Partner Pack in header

---

Mockups Below 👇

[Copilot]

Pull request overview

Adds a new “Love Letters” section to the site, sourcing postcard data from a markdown file and exposing it via a new page and header navigation entry.

Changes:

• Introduces /love-letters page with static content loading from content/love-letters/postcards.md.
• Adds a Postcard component + SCSS styling to render an image grid with markdown-rendered quotes.
• Adds a Heart icon and a new “Love Letters” link in the global header; registers the route in common/routes.js.

Show a summary per file

File	Description
styles/styles.scss	Imports the new postcard SCSS into the global stylesheet bundle.
public/icons/heart.js	Adds a Heart SVG icon component for the header nav.
pages/love-letters.js	Creates the Love Letters page and loads postcard data at build time.
content/love-letters/postcards.md	Adds editable postcard content (image + quote) in frontmatter.
components/postcard/postcard.scss	Provides layout and visual styling for the postcards grid/cards.
components/postcard/Postcard.jsx	Renders postcards, including markdown quote rendering and images.
components/header/Header.jsx	Adds a new nav item linking to Love Letters with the Heart icon.
common/routes.js	Registers the LOVE_LETTERS route helper.

Copilot's findings

Tip

Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comments suppressed due to low confidence (2)

components/postcard/Postcard.jsx:31

• The image alt text is set to postcard.quote, which may contain markdown syntax (e.g. [@user](...)) and can be quite long. For accessibility, alt should be a concise plain-text description of the image (or empty if decorative). Consider adding a dedicated alt/imageAlt field in the markdown data, or stripping markdown before using it as alt text.

              <img
                className="postcards__image"
                src={postcard.image}
                alt={postcard.quote}
              />

components/postcard/Postcard.jsx:37

• md({ linkify: true }).render(...) is instantiating a new markdown-it parser for every postcard (and on every re-render). This is unnecessarily expensive. Prefer creating a single MarkdownIt instance once (e.g., via useMemo/module-level singleton) and reusing it to render each quote.

            <blockquote
              className="postcards__quote"
              dangerouslySetInnerHTML={{
                __html: md({ linkify: true }).render(postcard.quote || ''),
              }}

• Files reviewed: 8/8 changed files
• Comments generated: 2