fix: typing text is black on dark mode

[zytact]

Summary by CodeRabbit

• Style

  • Enhanced dark mode support for text input styling with improved visual consistency across light and dark themes.

• Tests

  • Updated test assertions to validate styling changes.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

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

Project	Deployment	Review	Updated (UTC)
strokeshare	Ready	Preview, Comment	Jan 9, 2026 3:43pm

[coderabbitai]

Walkthrough

InfiniteCanvas textarea styling is refactored to move text color from inline styles to CSS classes, enabling responsive dark mode support (text-black dark:text-white). Tests are updated to verify class-based color assertions instead of inline styles.

Changes

Cohort / File(s)	Change Summary
InfiniteCanvas styling migration components/ui/InfiniteCanvas.tsx, components/ui/__tests/InfiniteCanvas.test.tsx	Removed inline style.color: currentColor from textarea and replaced with CSS classes for dark mode support. Test expectations updated from inline style checks to class-based assertions for light and dark theme validation.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related PRs

• zytact/strokeshare#65 — Modifies InfiniteCanvas text color handling and related component styling, complementing this PR's class-based approach.

Poem

A rabbit hops through styles so fine,
Moving color from inline to design,
Dark modes now dance in harmony's light,
From gray to black, from day into night! 🐰✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main fix: addressing dark mode text color visibility by updating text styling in InfiniteCanvas textarea component.

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

✨ Finishing touches

• 📝 Generate docstrings

---

📜 Recent review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between c49b977 and 5a7a15c.

📒 Files selected for processing (2)

• components/ui/InfiniteCanvas.tsx
• components/ui/__tests/InfiniteCanvas.test.tsx

🔇 Additional comments (2)

components/ui/InfiniteCanvas.tsx (1)

1891-1891: LGTM! Clean dark mode implementation.

The migration from inline style.color: currentColor to Tailwind's class-based approach (text-black dark:text-white) is the right solution for responsive dark mode support. This ensures text visibility in both light and dark themes while following Tailwind CSS best practices.

components/ui/__tests/InfiniteCanvas.test.tsx (1)

470-472: LGTM! Test correctly validates class-based styling.

The test assertions properly verify the presence of both text-black and dark:text-white classes, correctly reflecting the implementation change from inline styles to CSS classes. This ensures the dark mode fix is properly covered by 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.}

[zytact]

• fix: typing text is black on dark mode #100 👈 (View in Graphite)
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.