Polish typography and fix sidebar toggle arrow#53
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
✅ Files skipped from review due to trivial changes (1)
WalkthroughUpdated Docusaurus styling and marketing copy: added a dark-mode submenu icon inversion and stronger collapsible sidebar link styling; extended Markdown typography and table styles; adjusted hero, persona, flow, migration, consultation banner, and testimonials text on the index page. No runtime logic changes. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@prototypes/docusaurus/src/css/custom.css`:
- Around line 109-112: The current rule ".menu__list-item-collapsible
.menu__link" styles all descendant links including nested submenu items; change
it to target only the direct category link by using the child combinator on the
selector (i.e., replace the descendant selector with
".menu__list-item-collapsible > .menu__link") so only the immediate collapsible
header receives font-weight:600 and color:var(--ifm-color-content).
- Around line 169-171: The zebra striping selector currently targets all rows
via ".markdown tr:nth-child(2n)" which can color header rows; change the
selector to target only table body rows (e.g., ".markdown tbody
tr:nth-child(2n)" or ".markdown table tbody tr:nth-child(2n)") so header rows
remain unaffected, update the rule in custom.css accordingly, and verify
multi-row table headers are no longer striped.
🪄 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: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 05516c13-cd6d-4b58-bd5d-1e51f2a9673e
📒 Files selected for processing (1)
prototypes/docusaurus/src/css/custom.css
|
Cloudflare preview deployed.
|
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: c400fa1634
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
Autofix Details
Bugbot Autofix prepared a fix for the issue found in the latest run.
- ✅ Fixed: Collapsible link style overrides active link color
- I restricted the collapsible link color rule to non-active links so
.menu__link--activekeeps its intended active text color.
- I restricted the collapsible link color rule to non-active links so
Or push these changes by commenting:
@cursor push dc86fa7b07
Preview (dc86fa7b07)
diff --git a/prototypes/docusaurus/src/css/custom.css b/prototypes/docusaurus/src/css/custom.css
--- a/prototypes/docusaurus/src/css/custom.css
+++ b/prototypes/docusaurus/src/css/custom.css
@@ -106,7 +106,7 @@
font-weight: 600;
}
-.menu__list-item-collapsible .menu__link {
+.menu__list-item-collapsible .menu__link:not(.menu__link--active) {
font-weight: 600;
color: var(--ifm-color-content);
}
Closes #15 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Revert the font-size and weight reductions from the previous typography commit while keeping the useful structural additions: heading border separators, blockquote styling, table zebra-striping, sidebar hover states, and code padding. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
justin808
force-pushed
the
jg/15-typography-polish
branch
from
c400fa1 to
210aa5b
Compare
- Use child combinator for collapsible sidebar links to preserve active link color - Scope zebra striping to tbody rows only - Exclude pre>code from inline code styles to avoid breaking fenced blocks - Tighten all home page text: remove meta-commentary, cut filler words, make headings action-oriented instead of philosophical Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
Bugbot Autofix prepared a fix for the issue found in the latest run.
- ✅ Fixed: Dark mode table striping invisible due to matching colors
- Added a dark-theme-specific table stripe override to use #21262d so alternating rows remain visually distinct from the dark page background.
Or push these changes by commenting:
@cursor push 7864b32d2f
Preview (7864b32d2f)
diff --git a/prototypes/docusaurus/src/css/custom.css b/prototypes/docusaurus/src/css/custom.css
--- a/prototypes/docusaurus/src/css/custom.css
+++ b/prototypes/docusaurus/src/css/custom.css
@@ -199,6 +199,10 @@
background: var(--site-soft-surface);
}
+[data-theme='dark'] .markdown tbody tr:nth-child(2n) {
+ background: #21262d;
+}
+
/* ── Pagination & misc ────────────────────────────────────── */
.pagination-nav__link {|
|
||
| .markdown tbody tr:nth-child(2n) { | ||
| background: var(--site-soft-surface); | ||
| } |
There was a problem hiding this comment.
Dark mode table striping invisible due to matching colors
Medium Severity
The new alternating table row striping uses var(--site-soft-surface), which in dark mode resolves to #0d1117 — the exact same value as --ifm-background-color in dark mode. This makes the striped rows indistinguishable from non-striped rows, so the visual striping effect is completely invisible in dark mode. The codebase already acknowledges this mismatch for .button--secondary:hover, which has a dedicated dark-mode override using #21262d instead of --site-soft-surface.
Additional Locations (1)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Revert hero h1, persona/flow/migration section headings, OSS comparison description, and Pro flow summary to their original wording. These were changed too aggressively and lost product name visibility or meaning. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 participant
Summary
backgroundoverride on.menu__caret::beforeand adding--ifm-menu-link-sublist-icon-filter: invert(1)for dark themeCloses #15
Visual Changes
Compare side-by-side:
What to look for
Test plan
/docs/configuration— heading underlines visible/docs/configuration(the "Good News!" block)/config/initializers/react_on_rails.rb)🤖 Generated with Claude Code
Note
Low Risk
Low risk: CSS-only presentation tweaks and homepage copy updates with no functional or data-handling changes beyond minor visual behavior.
Overview
Updates Docusaurus theming to improve readability and consistency: adds H1/H2 underlines, refined inline-code vs code-block styling, blockquote and table formatting (borders, zebra striping, horizontal scroll), and clearer section separators in
custom.css.Adjusts sidebar visuals by bolding collapsible category links and fixing dark-mode sublist caret visibility via
--ifm-menu-link-sublist-icon-filter: invert(1).Refines
index.tsxhomepage messaging and CTAs across persona cards, recommended flows, migration section, consultation banner, and testimonials to be shorter and more action-oriented.Written by Cursor Bugbot for commit c470165. This will update automatically on new commits. Configure here.
Summary by CodeRabbit
Style
Documentation