docs: add demo video to Web Callouts changelog and docs page

[jannikmaierhoefer]

Adds the demo video to the Web Callouts changelog post and docs page.

Both pages already shipped (#3108, #3055) without a visual. This embeds https://static.langfuse.com/docs-videos/web-callouts.mp4 (1920×1080, 16:9):

• Changelog (content/changelog/2026-06-17-web-callouts.mdx): added ogVideo frontmatter, so ChangelogHeader renders the video as the hero and it doubles as the OG/social preview.
• Docs (content/docs/observability/features/web-callouts.mdx): added an inline <Video gifStyle> right after the intro callout.

Part of the #lf-launches Web Callouts launch (slug 2026-06-19-web-callouts).

🤖 Generated with Claude Code

Greptile Summary

Embeds a 1920×1080 MP4 demo video (web-callouts.mp4) into the Web Callouts changelog entry and docs page that previously shipped without a visual.

• Changelog (2026-06-17-web-callouts.mdx): adds ogVideo frontmatter so ChangelogHeader renders the video as the hero and OG/social preview — matching the exact pattern used in other recent changelog entries.
• Docs (web-callouts.mdx): inserts a <Video gifStyle aspectRatio={16/9}> component directly after the intro callout — consistent with how similar demo videos are embedded across the docs.

Confidence Score: 5/5

Both changes are additive-only documentation updates using well-established patterns already present throughout the repo.

The ogVideo frontmatter key and the <Video gifStyle aspectRatio={16/9}> component usage exactly mirror patterns found in multiple other changelog and docs files. The video URL follows the established https://static.langfuse.com/docs-videos/ convention. No logic, routing, or component code is modified.

No files require special attention.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A["static.langfuse.com/docs-videos/web-callouts.mp4"] --> B["Changelog frontmatter\nogVideo: url"]
    A --> C["Docs page\nVideo src=url gifStyle"]
    B --> D["ChangelogHeader component\nrenders video as hero + OG preview"]
    C --> E["Inline demo video\nbelow intro callout"]

Loading

%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
flowchart TD
    A["static.langfuse.com/docs-videos/web-callouts.mp4"] --> B["Changelog frontmatter\nogVideo: url"]
    A --> C["Docs page\nVideo src=url gifStyle"]
    B --> D["ChangelogHeader component\nrenders video as hero + OG preview"]
    C --> E["Inline demo video\nbelow intro callout"]

Loading

_{Reviews (1): Last reviewed commit: "Merge branch 'main' into feature-launch/..." | Re-trigger Greptile}

[vercel]

@jannikmaierhoefer is attempting to deploy a commit to the langfuse Team on Vercel.

A member of the Team first needs to authorize it.

[claude]

Claude Code Review

This pull request is from a fork — automated review is disabled. A repository maintainer can comment @claude review to run a one-time review.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
langfuse-docs	Ready	Preview, Comment	Jun 19, 2026 2:37pm