Skip to content

Conversation

@harshentau-spec
Copy link

@harshentau-spec harshentau-spec commented Jan 1, 2026

Problem

  • Duplicate "Home" entry appeared in documentation navigation
  • Navbar/header height was oversized on first page load
  • Layout became inconsistent when scrolling or refreshing

Root Cause

Material for MkDocs was rendering a redundant top tabs bar (navigation.tabs) even though there's only one top-level section ("Home").

Fix

  • Disabled navigation.tabs feature by commenting it out
  • Also commented out unused swagger-ui-tag plugin to allow local mkdocs serve

Result

  • Clean header without extra tabs bar
  • No more duplicate "Home"
  • Consistent navbar height on initial load, scroll, and refresh
  • Tested locally with mkdocs serve — works perfectly

Closes #684

Screen.Recording.2026-01-01.133128.mp4

Summary by CodeRabbit

  • Bug Fixes

    • Improved the scrolling marquee for smoother, gap-free animation and refined item styling and interactions.
  • Chores

    • Upgraded animation library to a newer compatible version for better performance.
    • Updated build tooling dev dependency for improved build efficiency.
    • Adjusted documentation site configuration (navigation tabs and API UI setting tweaks).

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

@github-actions github-actions bot added UI documentation Improvements or additions to documentation good first issue Good for newcomers labels Jan 1, 2026
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 1, 2026

📝 Walkthrough

Walkthrough

Updated landing-page dependencies, refactored the Demo marquee to duplicate items for seamless scrolling with adjusted animation and styling, and modified mkdocs configuration to disable navigation tabs and adjust the swagger-ui-tag setting.

Changes

Cohort / File(s) Change Summary
Dependency Updates
landing-page/package.json
Bumped framer-motion from ^12.23.12^12.23.26; bumped devDependency esbuild from ^0.24.0^0.27.2. No script or logic changes.
Marquee Component Refactor
landing-page/src/Pages/Demo/marqu.tsx
Added repeatedTechnologies (10× duplication) and iterate over it for continuous marquee; changed animation x from 0%-50%, duration → 50, linear easing; improved keys to ${index}-${tech.text}; enhanced item spacing and pill styling (mx-4, px-4, py-1.5, rounded, border, shadow) and simplified hover scale behavior; separator spacing increased (mx-6).
MkDocs Configuration
mkdocs.yml
Commented-out navigation.tabs under theme.features; re-enabled swagger-ui-tag as a single enabled line with an inline comment.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐇 I stitched the tokens, row on row,
A looping dance with gentle flow,
Tenfold echoes glide in line,
Smooth and steady, stitched just fine.
Little tweaks and deps aligned—hip, hop, hooray!

Pre-merge checks

❌ Failed checks (2 warnings, 1 inconclusive)
Check name Status Explanation Resolution
Out of Scope Changes check ⚠️ Warning Changes to landing-page/package.json (dependency updates) and landing-page/src/Pages/Demo/marqu.tsx (marquee animation refactor) are unrelated to the navbar height fix described in issue #684. Remove the package.json and marqu.tsx changes from this PR and create separate PRs for dependency updates and marquee improvements to maintain focused, reviewable changesets.
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.
Linked Issues check ❓ Inconclusive While mkdocs.yml changes align with fixing navbar issues, the inclusion of package.json and marqu.tsx changes appears unrelated to the navbar height problem. Clarify whether all changes are necessary for the navbar fix or if some changes belong in a separate PR. Verify that marqu.tsx and package.json updates address the specific issue #684 requirements.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The PR title accurately describes the main fix: removing the duplicate Home tab and fixing navbar height issues, directly addressing issue #684.

📜 Recent review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 62fef62 and 6f17d8e.

📒 Files selected for processing (1)
  • mkdocs.yml
🔇 Additional comments (2)
mkdocs.yml (2)

13-13: LGTM! Correctly fixes the duplicate "Home" issue.

Disabling navigation.tabs is the right solution when there's only one top-level section in the navigation structure. The tabs feature creates a redundant bar that duplicated the "Home" entry, and commenting it out resolves both the duplicate entry and the navbar height inconsistency described in issue #684.


40-40: The plugin is correctly enabled and necessary for the API documentation.

The swagger-ui-tag plugin is actively used in docs/backend/backend_python/api.md (contains <swagger-ui src="openapi.json"/>), has CSS styling rules in docs/stylesheets/extra.css for responsive design, and is listed in docs/requirements.txt as mkdocs-swagger-ui-tag==0.7.1. The inline comment "Re-enabled: used for rendering OpenAPI docs in backend_python/api.md" accurately reflects the current code state.

If the PR description states the plugin was "commented out", it appears to conflict with the actual implementation. Ensure the PR description or commit message is updated to reflect that the plugin was re-enabled, not disabled.

Likely an incorrect or invalid review comment.


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.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

📜 Review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 4043751 and 62fef62.

⛔ Files ignored due to path filters (1)
  • landing-page/package-lock.json is excluded by !**/package-lock.json
📒 Files selected for processing (3)
  • landing-page/package.json
  • landing-page/src/Pages/Demo/marqu.tsx
  • mkdocs.yml
🔇 Additional comments (7)
mkdocs.yml (2)

13-13: Correct fix for duplicate "Home" issue.

Disabling navigation.tabs is the appropriate solution when only one top-level navigation section exists. Material for MkDocs would render a redundant tabs bar showing "Home" when this feature is enabled, creating the duplicate entry described in issue #684.


40-40: Uncomment the swagger-ui-tag plugin instead of removing it.

The plugin is already listed in both docs/requirements.txt and backend/requirements.txt (version 0.7.1) and is actively used in docs/backend/backend_python/api.md for rendering the OpenAPI documentation via <swagger-ui src="openapi.json"/>. Commenting it out breaks the API documentation feature. Change line 40 from:

  # - swagger-ui-tag:  # Commented out to fix plugin not installed error during mkdocs serve

to:

  - swagger-ui-tag

Likely an incorrect or invalid review comment.

landing-page/src/Pages/Demo/marqu.tsx (4)

11-12: Good approach for seamless infinite scrolling.

Creating 10 repetitions of the technologies array ensures smooth, gap-free marquee animation across different screen sizes. The implementation is clean and the comment clearly explains the intent.


26-28: Key generation is correct.

The composite key ${index}-${tech.text} ensures uniqueness. While index alone would be sufficient here (since the array is static and order never changes), the composite approach doesn't cause issues and provides additional clarity.


29-38: Enhanced styling and interactions improve UX.

The updated styling adds visual polish with borders, shadows, and hover effects. Dark mode support is properly implemented, and the framer-motion interactions (hover scale, tap feedback) provide good user feedback.


39-39: Appropriate spacing adjustment.

Increasing the separator spacing from mx-3 to mx-6 provides better visual balance with the enhanced pill styling.

landing-page/package.json (1)

20-20: Verify the framer-motion update doesn't introduce regressions.

The patch version bump from 12.23.12 to 12.23.26 should be backward compatible. However, given that the marquee component uses this library extensively, ensure the updated animations work as expected across different browsers and screen sizes.

@Nakshatra480
Copy link

@harshentau-spec assign this issue to me.

@harshentau-spec
Copy link
Author

@harshentau-spec assign this issue to me.

Thanks for reviewing! I’ve tested the changes locally and everything works as expected. Ready for merge once approved.

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 good first issue Good for newcomers UI

Projects

None yet

Development

Successfully merging this pull request may close these issues.

BUG: Navbar height is oversized on first load and fixes only after refresh

2 participants