Modernize docs/v3: Update dependencies, add JavaScript bundler, and implement dark mode#4869
Merged
Modernize docs/v3: Update dependencies, add JavaScript bundler, and implement dark mode#4869
Conversation
moleske
previously approved these changes
Feb 25, 2026
This commit updates all outdated dependencies in docs/v3 and fixes compatibility issues with Middleman 4.6+. Key changes: - middleman: 4.5.1 → 4.6.3 - middleman-livereload: 3.4.7 → 3.5.0 - thor: 1.2.2 → 1.5.0 - rack: 2.2.22 → 3.1.20 (required by Middleman 4.6) - Plus ~25 other dependency updates Technical changes: - Removed middleman-sprockets gem due to conflicts with Middleman 4.6's built-in Sass renderer - Disabled Sprockets activation in config.rb - Manually concatenated JavaScript files into all.js with proper semicolons to fix IIFE syntax errors - Pinned autoprefixer-rails to ~> 10.4.7 for stability The site now builds successfully with properly compiled CSS and working JavaScript functionality including the sidebar collapsible behavior.
Replace Sprockets-based JavaScript concatenation with a custom Node.js build script that handles bundling during development and build time. Changes: - Add webrick gem for Rack 3 / Middleman 4.6 compatibility - Create build-js.mjs script to concatenate JavaScript files in dependency order - Update package.json to add build:js script and integrate it into the start command - Regenerate all.js with proper file markers and comments - Update config.rb comment to reference new build system Benefits: - Cleaner separation of concerns (Ruby for templates, Node for JS) - No conflict between Sprockets and Middleman's Sass renderer - Maintainable individual source files in lib/ and app/ directories - Automatic bundling on npm start and can be run manually with npm run build:js This completes the Option 4 implementation for long-term maintainability.
Add section explaining the new JavaScript build workflow: - How the build script concatenates individual source files - When developers need to run npm run build:js - Warning not to edit all.js directly since it's auto-generated - Where to modify the build configuration if needed This helps future contributors understand the build system.
Implement a complete dark mode solution with automatic system preference detection and manual toggle control. Features: - Automatic dark mode detection via prefers-color-scheme media query - Manual theme toggle button (cycles: Auto → Light → Dark → Auto) - Theme preference persisted in localStorage - Minimal icon-only toggle button (sun/moon) below logo CSS changes: - Convert colors to CSS custom properties for theme switching - Add dark color palette with proper contrast ratios - Update all UI elements: sidebar, navigation, tables, borders, version dropdown, search, and inline code - Logo inverts colors in dark mode for visibility - Code blocks (JSON examples) maintain their Monokai syntax highlighting in both themes JavaScript: - New theme_toggle.js module handles theme switching logic - Detects system preference changes automatically - Updates toggle icon based on current theme - Integrated into build-js.mjs bundle The implementation respects user system preferences by default while allowing manual override for flexibility.
Remove verbose comments explaining why changes were made - this information belongs in git history (commit messages and PR description) rather than cluttering the source code. Changes: - Remove Sprockets removal explanation from Gemfile - Remove Sprockets comments from config.rb - Simplify build-js.mjs header comments - Remove redundant inline comments from SCSS files The code is now cleaner while maintaining necessary documentation (section headers, generated file warnings, etc.)
b06fc64 to
6224ae0
Compare
jochenehret
approved these changes
Feb 25, 2026
ari-wg-gitbot
added a commit
to cloudfoundry/capi-release
that referenced
this pull request
Feb 25, 2026
Changes in cloud_controller_ng:
- fix rubocop issues
PR: cloudfoundry/cloud_controller_ng#4875
Author: Johannes Haass <johannes.haass@sap.com>
- Modernize docs/v3: Update dependencies, add JavaScript bundler, and implement dark mode
PR: cloudfoundry/cloud_controller_ng#4869
Author: Johannes Haass <johannes.haass@sap.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR modernizes the docs/v3 folder by updating outdated dependencies, replacing the deprecated Sprockets build system with a modern JavaScript bundler, and adding a dark mode feature.
Changes
1. Dependency Updates
2. JavaScript Build System
3. Dark Mode Implementation
Technical Details
Build System:
Dark Mode:
Testing
Breaking Changes
None. All existing functionality is preserved.
Migration Notes
Developers need to be aware:
This PR was developed with AI assistance (Claude Code).