[codex] fix testimonials iframe background

[riderx]

Summary

Fixes the homepage testimonial embed background in dark mode by allowing the Senja iframe to remain transparent instead of painting a white iframe canvas.

Root cause

The Senja Wall of Love content uses transparent embed styling, but the host iframe itself did not declare a transparent background/allow transparency. In dark mode, the iframe surface could render as white around the cards.

Validation

• bunx prettier --write apps/web/src/components/Testimonials.astro
• NODE_OPTIONS=--max-old-space-size=16384 bunx astro check
• Headless browser smoke test of the homepage testimonial section confirmed the white block is gone.

Summary by CodeRabbit

• Bug Fixes
  • Improved the Testimonials "Wall of Love" embed so the testimonial frame displays with a transparent background and block layout, and allows transparency for more consistent rendering—reducing visual glitches and ensuring a cleaner, more seamless appearance across browsers and devices.

[chatgpt-codex-connector]

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: c64d7ad1-b1a0-4308-a2ee-62c449d8a76e

📥 Commits

Reviewing files that changed from the base of the PR and between e2e2bc5 and 43dba14.

📒 Files selected for processing (1)

• apps/web/src/components/Testimonials.astro

🚧 Files skipped from review as they are similar to previous changes (1)

• apps/web/src/components/Testimonials.astro

---

📝 Walkthrough

Walkthrough

Added allowtransparency="true", class="block bg-transparent", and style="background-color: transparent; overflow: hidden" to the Wall of Love iframe in the Testimonials component.

Changes

Wall of Love iframe styling

Layer / File(s)	Summary
Iframe attributes and inline style apps/web/src/components/Testimonials.astro	The Wall of Love iframe now includes allowtransparency="true", class="block bg-transparent", and an expanded style that sets background-color: transparent alongside the existing overflow: hidden.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 I nudged the frame to let light through,
a transparent patch, a clearer view,
a class to sit the frame just right,
small tweak at dusk, small tweak at night,
Love shows up softly, all anew.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title directly describes the main change: fixing the testimonials iframe background transparency issue in dark mode by updating the iframe element's attributes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch codex/fix-testimonials-iframe-bg

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.

---

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

[coderabbitai]

Actionable comments posted: 1

🧹 Nitpick comments (1)

apps/web/src/components/Testimonials.astro (1)

76-77: ⚡ Quick win

Remove redundant background-color declaration.

The bg-transparent Tailwind class already sets background-color: transparent, making the inline style declaration on line 77 redundant. Consider removing background-color: transparent; from the inline style and keeping only overflow: hidden;.

♻️ Proposed fix

-      class="block bg-transparent"
-      style="overflow: hidden; background-color: transparent;"
+      class="block bg-transparent"
+      style="overflow: hidden;"

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/web/src/components/Testimonials.astro` around lines 76 - 77, In
Testimonials.astro locate the element with class="block bg-transparent" (the
element that currently has style="overflow: hidden; background-color:
transparent;") and remove the redundant background-color: transparent; from the
inline style so it reads only style="overflow: hidden;"; keep the bg-transparent
Tailwind class as-is to control background.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/web/src/components/Testimonials.astro`:
- Line 75: Remove the obsolete allowtransparency attribute from the iframe in
the Testimonials.astro component (the attribute currently on the iframe around
line 75); transparency is already handled via CSS (background-color: transparent
on the same iframe), so delete the allowtransparency token from the element.

---

Nitpick comments:
In `@apps/web/src/components/Testimonials.astro`:
- Around line 76-77: In Testimonials.astro locate the element with class="block
bg-transparent" (the element that currently has style="overflow: hidden;
background-color: transparent;") and remove the redundant background-color:
transparent; from the inline style so it reads only style="overflow: hidden;";
keep the bg-transparent Tailwind class as-is to control background.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: be1061ee-835e-41e6-9f96-fc370a63ed03

📥 Commits

Reviewing files that changed from the base of the PR and between 356929c and 5d0fa54.

📒 Files selected for processing (1)

• apps/web/src/components/Testimonials.astro

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud