Make all YouTube iframe embeds responsive (mobile horizontal scroll fix)

[jtemporal]

Goal

Apply the responsive YouTube embed pattern from PR #23 across all remaining video embeds so they no longer cause horizontal scroll on mobile.

Preferred pattern (from PR #23)

<center>
<iframe style="max-width:100%; width:560px; aspect-ratio:16/9; height:auto;" src="https://www.youtube.com/embed/VIDEO_ID" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</center>

Notes:

• Prefer this over fixed width="560" height="315" and over bare width="100%" height="..." (the latter is better but still lacks consistent aspect-ratio handling).
• For portrait/shorts-style embeds (rare), use aspect-ratio:9/16 instead of 16/9.
• Keep existing title, allow, referrerpolicy, etc. attributes where present.
• Wrap in <center> when missing.

Already updated (do not touch)

These already use the PR #23 style:

• _posts/2022/2022-01-14-desfazendo-um-ou-mais-commits.md
• _posts/2022/2022-01-14-undoing-the-last-commits-using-git-reset.md
• _posts/2022/2022-01-15-desfazendo-o-ultimo-commit-e-reaproveitando-a-mensagem.md
• _posts/2022/2022-01-15-undoing-the-last-commit-and-reusing-the-message.md
• _posts/2023/2023-11-30-como-desfazer-alteracoes-em-um-repositorio-git-usando-git-revert.md
• _posts/2023/2023-11-30-how-to-undo-changes-in-a-git-repository-using-git-revert.md
• _posts/2026-06-28-desfazendo-mais-de-um-commit-de-uma-vez-com-git-revert.md
• _posts/2026-06-28-undoing-more-than-one-commit-at-once-with-git-revert.md

(Plus any July 2026 short posts that land via the current PR branch once merged.)

Posts / pages that still need updating

Fixed width="560" height="315" (or similar) — highest priority

Path	Notes
_posts/2017/2017-02-09-meu-medo-de-formularios.md	no <center>
_posts/2018/2018-01-01-the-last-of-a-list-in-python.md	portrait (315×560) → use aspect-ratio:9/16
_posts/2021/2021-04-15-my-first-avocadolabs-live-o.md
_posts/2021/2021-08-30-universo-python.md	youtube-nocookie
_posts/2022/2022-03-29-one-year-as-a-developer-advocate.md
_posts/2022/2022-03-29-primeiro-ano-sendo-uma-developer-advocate.md
_posts/2022/2022-03-31-vamos-falar-sobre-jwt.md	no <center>
_posts/2022/2022-04-30-let-s-talk-about-jwt.md	no <center>
_posts/2023/2023-03-13-go-with-the-flow.md
_posts/2023/2023-10-08-pybay23.md
_posts/2023/2023-11-06-hacktoberfest-livestream-github.md
_posts/2024/2024-11-09-testing-apple-intelligence-s-clean-up-tool.md	2 embeds
_posts/2024/2024-11-09-testando-a-funcionalidade-de-clean-up-da-apple-intelligence.md	2 embeds
_posts/2024/2024-12-06-pyladiescon2024.md	no <center>
_posts/2025-10-12-hacktoberfest-2025-semana-2.md
_posts/2026-02-03-ai-powered-development-workflow.md	2 embeds
_posts/2026-02-03-desenvolvimento-de-software-com-ia-licoes-ao-lancar-my-yarn-stash.md	2 embeds
_posts/2026-06-18-git-stash-save-your-work-short.md	short
_posts/2026-06-19-agenticstack-compare-ai-agent-tools-short.md	short
_posts/2026-06-23-git-stash-pop-vs-apply-short.md	short
_posts/2026-06-25-gitkeep-track-empty-folders-short.md	short
_posts/2026-06-30-merge-conflict-short.md	short
_posts/2026-07-02-switch-short.md	short
_posts/2026-07-07-rebase-short.md	short
_posts/2026-07-09-rename-git-mv-short.md	short

width="100%" + fixed height (already better, but standardize to PR #23 pattern)

Path	Notes
_posts/2019/2019-11-23-a-ciencia-de-dados-pode-salvar-um-pais.md
_posts/2021/2021-08-04-live-stream-como-montar-tua-palestra-para-python-brasil.md
_posts/2021/2021-08-24-traveling-through-a-secure-api-with-python-and-auth0.md
_posts/2021/2021-08-30-fechatag-40.md	youtube-nocookie
_posts/2021/2021-09-17-tips-for-writing-great-technical-content.md
_posts/2021/2021-10-12-viajando-por-o-uma-api-segura-com-flask.md
_posts/2024/2024-07-27-pyohio24.md	width="100%" height="500"
_posts/2025-08-31-configure-local-python-mcp-server-in-vscode.md
_posts/2025-08-31-configurando-servidor-mcp-python-local-no-vscode.md

Docs / templates (update example too)

• AGENTS.md — still shows the old non-responsive iframe snippet; update the example to the PR Embed YouTube video “How to Undo Commits in Git” in related posts #23 style.

Out of scope for this issue

Non-YouTube iframes (Slides.com, Google Slides, Giphy, Spotify, Anchor, Facebook video, Omny, etc.) — leave those alone unless they also cause layout issues.

Acceptance criteria

• Every YouTube / youtube-nocookie embed on the site uses the responsive style="max-width:100%; width:560px; aspect-ratio:16/9; height:auto;" (or 9/16 for portrait).
• No horizontal overflow on mobile for post pages that contain video embeds.
• AGENTS.md example updated so future posts get the correct pattern by default.

Related

• PR Embed YouTube video “How to Undo Commits in Git” in related posts #23 (original responsive fix)
• Current work on July 2026 git shorts branch