Skip to content

fix(ui): adjust faq accordion scroll target to prevent clipping - #2476

Open
kunalverma2512 wants to merge 2 commits into
json-schema-org:mainfrom
kunalverma2512:fix/faq-scroll-overshoot
Open

kunalverma2512 wants to merge 2 commits into
json-schema-org:mainfrom
kunalverma2512:fix/faq-scroll-overshoot

Conversation

@kunalverma2512

Copy link
Copy Markdown
Contributor

What kind of change does this PR introduce?

Bugfix

Issue Number:

Screenshots/videos:

Before changes :
ScreenRecording2026-08-29at3 34 20PM-ezgif com-video-to-gif-converter

After changes :
ScreenRecording2026-08-29at4 26 45PM-ezgif com-video-to-gif-converter

After changes (phone view) :
ScreenRecording2026-09-01at8 56 49PM-ezgif com-video-to-gif-converter

If relevant, did you update the documentation?

Not applicable

Summary

When expanding an FAQ item, the automatic scroll behavior currently calculates its offset by targeting the inner answer block. This causes the scroll to overshoot and clip the top of the accordion card underneath the sticky navigation bar.

To fix this without losing the helpful scrolling behavior, this PR simply moves the HTML id attribute from the inner answer block up to the outer wrapper of the accordion item. This ensures the scroll calculation perfectly aligns the top of the entire question card below the header. As an added bonus, it also fixes native URL deep-linking so direct links to FAQs jump to the top of the card instead of the answer text.

Does this PR introduce a breaking change?

No

Checklist

Please ensure the following tasks are completed before submitting this pull request.

@github-actions

github-actions Bot commented Sep 1, 2026 •

Copy link
Copy Markdown
built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Name Status Preview Last Commit
website ✅ Ready (View Log) Visit Preview d930230

@codecov

codecov Bot commented Sep 1, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (d0f61e9) to head (d930230).

Additional details and impacted files
@@            Coverage Diff            @@
##              main     #2476   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           31        31           
  Lines          695       695           
  Branches       215       215           
=========================================
  Hits           695       695           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

This branch was successfully deployed

1 active deployment
Preview — d9302305 Deployed Sep 1, 2026 by github-actions[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Ready to review

Development

Successfully merging this pull request may close these issues.

🐛 Bug: FAQ accordion scroll overshoots and hides question under the top navbar

1 participant