Phase 3 — Enhanced Link Cards (Test)
This post is for testing Phase 3. A link placed on its own line should render as a full rich card (image + title + description + domain). A link inside a sentence should keep the hover popup.
Bare link → rich card
Put a URL alone in a paragraph like this:
The above should appear as a styled card after the build fetches its Open Graph metadata. If the site blocks fetching, it falls back to the domain name as the title.
Inline link → hover popup
Here is an inline reference to the Astro docs that should still show a small popup on hover, not a full card.
Another inline example with Expressive Code to confirm the hover behavior is unchanged for in-sentence links.
Rich card with markdown detail
Use the :::linkcard directive to attach rich markdown content that
opens in a modal when the card is clicked:
This is markdown detail content rendered inside the modal window, just like a normal post. It supports:
- Lists and
inline code - Math:
- Code blocks and even 🚀 emoji
Click the card above to open the detailed view.
A bare link (no detail) should still open a modal showing the fetched OG info plus a Visit site button.
If both behaviors look right, Phase 3 is good to go.