Skip to content

Conversation

@tbouffard
Copy link
Member

@tbouffard tbouffard commented Oct 31, 2025

Allow users to cycle through light, dark, and system theme preferences
by enabling respectPrefersColorScheme in the Docusaurus color mode config.

This fixes the issue where only light/dark modes were toggleable,
preventing users from selecting their OS theme preference.

Notes

Fixes #895

Summary by CodeRabbit

  • New Features

    • Website now respects your system's dark or light mode preference, automatically adjusting the theme to match your operating system settings for a more seamless and personalized browsing experience without requiring manual theme selection.
  • Documentation

    • Updated documentation examples and commit message formatting guidelines to ensure consistency and clarity across contribution standards and processes.

Allow users to cycle through light, dark, and system theme preferences
by enabling respectPrefersColorScheme in the Docusaurus color mode config.

This fixes the issue where only light/dark modes were toggleable,
preventing users from selecting their OS theme preference.
@tbouffard tbouffard added the documentation Improvements or additions to documentation label Oct 31, 2025
@coderabbitai
Copy link

coderabbitai bot commented Oct 31, 2025

Walkthrough

The PR updates documentation examples to remove PR number suffixes from commit message subjects and adds system color mode preference support to the Docusaurus configuration by enabling respectPrefersColorScheme.

Changes

Cohort / File(s) Summary
Documentation updates
CLAUDE.md
Removed explicit PR number suffixes (e.g., "(#929)", "(#914)") from commit subject line examples and normalized trailing newline.
Configuration updates
packages/website/docusaurus.config.ts
Added colorMode configuration block with respectPrefersColorScheme: true to enable system color scheme preference detection in theme selection.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

  • Focus areas:
    • Verify colorMode property placement and indentation align with Docusaurus config structure
    • Confirm respectPrefersColorScheme: true is the correct configuration key for enabling system theme mode cycling

Pre-merge checks and finishing touches

❌ Failed checks (3 warnings)
Check name Status Explanation Resolution
Out of Scope Changes Check ⚠️ Warning The pull request contains changes to CLAUDE.md that remove PR number suffixes from commit/subject examples. These changes are unrelated to the linked issue #895 (website theme selector system mode) and do not support the stated PR objective of enabling system color mode toggle in the website. While the docusaurus.config.ts changes are clearly in-scope, the CLAUDE.md modifications appear to be separate cleanup work that should be addressed in a different PR focused on documentation standards.
Description Check ⚠️ Warning The pull request description does not follow the required template structure. While it provides an overview of what was changed and why, it is missing critical sections from the template including the PR Checklist (with required confirmations about addressing issues, scope, tests, screenshots, and documentation), explicit confirmation of discussion with maintainers, and verification that scope is sufficiently narrow. The description only provides a brief overview and notes section without the structured checklist format that the template requires.
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (2 passed)
Check name Status Explanation
Title Check ✅ Passed The pull request title "docs(website): enable system color mode toggle" follows the Conventional Commits format correctly with type "docs", scope "website", and a clear, concise description. The title accurately reflects the main change made to the codebase—adding the colorMode configuration to enable the system theme preference toggle in Docusaurus. The phrasing is specific and understandable at a glance.
Linked Issues Check ✅ Passed The code changes directly address the requirements in linked issue #895. The addition of the colorMode configuration with respectPrefersColorScheme set to true enables the Docusaurus theme toggle to cycle through light, dark, and system theme options. This directly implements the fix for the bug where users could only toggle between light and dark modes and were unable to select the system theme preference, which was the core issue described in #895.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch docs/issue-895_color_mode_respect_user_prefs

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 407d526 and d40386f.

📒 Files selected for processing (2)
  • CLAUDE.md (2 hunks)
  • packages/website/docusaurus.config.ts (1 hunks)
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: tbouffard
Repo: maxGraph/maxGraph PR: 849
File: packages/html/stories/DragSource.stories.js:98-101
Timestamp: 2025-06-13T07:48:10.300Z
Learning: User tbouffard prefers answers in English; avoid switching to other languages in future replies.
📚 Learning: 2025-02-17T06:01:50.745Z
Learnt from: tbouffard
Repo: maxGraph/maxGraph PR: 679
File: packages/html/stories/Drop.stories.js:71-94
Timestamp: 2025-02-17T06:01:50.745Z
Learning: maxGraph does not support Internet Explorer, making IE-specific browser compatibility checks unnecessary.

Applied to files:

  • CLAUDE.md
🪛 markdownlint-cli2 (0.18.1)
CLAUDE.md

352-352: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

⏰ 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: build
🔇 Additional comments (2)
packages/website/docusaurus.config.ts (1)

122-124: LGTM! Configuration correctly enables system color mode.

The addition of respectPrefersColorScheme: true directly addresses issue #895 by enabling the theme toggle to cycle through light, dark, and system modes. The configuration is correctly placed within themeConfig and follows Docusaurus best practices.

CLAUDE.md (1)

346-346: Good documentation improvement.

Removing the PR number suffixes from commit message examples better reflects actual commit message best practices. PR numbers are typically added automatically by GitHub during merge rather than being part of the original commit message subject.

Also applies to: 353-353


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

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

@sonarqubecloud
Copy link

@tbouffard tbouffard merged commit df597c7 into main Oct 31, 2025
4 checks passed
@tbouffard tbouffard deleted the docs/issue-895_color_mode_respect_user_prefs branch October 31, 2025 14:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Improvements or additions to documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Website theme selector: System theme mode not selectable via UI

1 participant