🎨 Added translucent background to video controls to improve text contrast.

[nathansgithub]

This is a small change to improve contrast for the video card interface. It is .5 opacity to match the video "play" button. This makes the controls more readable for better accessibility.

Fixes #26439

---

• I've read and followed the Contributor Guide
• I've explained my change
• [N/A] I've written an automated test to prove my change works

---

Note

Low Risk
CSS-only visual tweak to the video player controls; low chance of functional impact beyond minor styling/layout differences across themes/browsers.

Overview
Improves video card control readability by adding a semi-transparent black background (rgba(0,0,0,.5)) to the .kg-video-player controls bar, increasing contrast against bright video content.

^{Written by Cursor Bugbot for commit 8cda4bf. This will update automatically on new commits. Configure here.}

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: e75c2752-39d2-4b2b-b38c-00fb3b23eb68

📥 Commits

Reviewing files that changed from the base of the PR and between a4c86b0254b0d05a0becc46a687db070e035a7ee and 14c888d.

📒 Files selected for processing (1)

• ghost/core/core/frontend/src/cards/css/video.css

✅ Files skipped from review due to trivial changes (1)

• ghost/core/core/frontend/src/cards/css/video.css

---

Walkthrough

A CSS change adds a background property to the .kg-video-player selector in the video stylesheet: background: rgba(0,0,0,.5);. No other style rules, behavior, or public API declarations were modified.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: adding a translucent background to video controls for improved contrast.
Description check	✅ Passed	The description is directly related to the changeset, explaining the accessibility improvement and referencing the relevant issue #26439.
Linked Issues check	✅ Passed	The PR successfully implements the objective from issue #26439 by adding the translucent black background (rgba(0,0,0,.5)) to video controls.
Out of Scope Changes check	✅ Passed	All changes are in-scope and directly address the accessibility issue; only one CSS property was added to the video player controls.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

📜 Review details

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 31ecb69 and a4c86b0254b0d05a0becc46a687db070e035a7ee.

📒 Files selected for processing (1)

• ghost/core/core/frontend/src/cards/css/video.css

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: Cursor Bugbot

[9larsons]

LGTM - I do think it makes the appearance a bit less clean, but especially on light mode I can see the lack of contrast being challenging. Thanks for this!

[nx-cloud]

🤖 Nx Cloud AI Fix

Ensure the fix-ci command is configured to always run in your CI pipeline to get automatic fixes in future runs. For more information, please see https://nx.dev/ci/features/self-healing-ci

---

View your CI Pipeline Execution ↗ for commit 14c888d

Command	Status	Duration	Result
nx run ghost:test:ci:integration	✅ Succeeded	2m 25s	View ↗
nx run ghost:test:ci:e2e	✅ Succeeded	11m 48s	View ↗
nx run ghost:test:ci:legacy	✅ Succeeded	3m 17s	View ↗
nx run ghost:test:ci:integration:no-coverage	✅ Succeeded	42s	View ↗
nx run ghost:test:ci:e2e:no-coverage	✅ Succeeded	2m 39s	View ↗
nx build @tryghost/admin-toolbar	✅ Succeeded	<1s	View ↗
nx build @tryghost/comments-ui	✅ Succeeded	<1s	View ↗
nx build @tryghost/signup-form	✅ Succeeded	<1s	View ↗
Additional runs (10)	✅ Succeeded	...	View ↗

💡 Verify your cache is correct by running tasks in a sandbox. Read docs ↗

---

☁️ Nx Cloud last updated this comment at 2026-06-12 00:56:45 UTC