Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve tab scroll on click #7531

Merged
merged 2 commits into from Apr 1, 2024
Merged

Improve tab scroll on click #7531

merged 2 commits into from Apr 1, 2024

Conversation

bluwy
Copy link
Member

@bluwy bluwy commented Mar 21, 2024

Description (required)

At https://docs.astro.build/en/install/auto/#1-run-the-setup-wizard, when clicking a package manager tab, it auto scrolls to the tab and I lost focus of where I am 😅 This PR replaces the auto-scroll with a logic that maintains the scroll position when clicking on a tab.

A more complex example where the scroll position can shift is at https://docs.astro.build/en/recipes/sharing-state-islands/#using-atoms. With this PR, the tab I clicked will also maintain its position.

(I think it's best to showcase a video of how it works, but I haven't figured how to do that on my laptop without large file sizes)

Related issues & labels (optional)

  • Closes #
  • Suggested label:

@bluwy bluwy added the site improvement Some thing that improves the website functionality - ask @delucis for help! label Mar 21, 2024
Copy link

vercel bot commented Mar 21, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
docs ✅ Ready (Inspect) Visit Preview Apr 1, 2024 8:29am
1 Ignored Deployment
Name Status Preview Updated (UTC)
docs-i18n ⬜️ Ignored (Inspect) Apr 1, 2024 8:29am

@sarah11918
Copy link
Member

Thanks, @bluwy ! I think there's current work on Starlight to fix this behaviour there, which we would then get when we update our Starlight version. So, I'll let you, @delucis and @HiDeoo negotiate this one! 😄

@liruifengv
Copy link
Sponsor Member

liruifengv commented Mar 21, 2024

I've encountered this problem and this behavior make me very distressed. I wanted to file an issue but I forgot.

@HiDeoo
Copy link
Member

HiDeoo commented Mar 21, 2024

To comment on the Starlight part of things:

  • There is a PR adding the syncing behavior to Starlight tabs (old one but I want to revive it soon)
  • The tab scroll lock mechanism is something @TheOtterlord and I tried to implement for the PR I linked but there was a few edge cases that we didn't solve at that time (specially when the tab heights change) but my plan is to revisit it and add it to the Starlight PR.

@bluwy
Copy link
Member Author

bluwy commented Apr 1, 2024

I think since upstream support may take a while to iron out, it might be worth to push this along first? The auto-scroll prevention would improve the experience at the meantime.

Copy link
Member

@TheOtterlord TheOtterlord left a comment

Choose a reason for hiding this comment

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

Yep, I'm happy with adding this for now. Once upstream support is released, we can update this to use the new implementation.

@TheOtterlord TheOtterlord merged commit 31caf30 into main Apr 1, 2024
7 checks passed
@TheOtterlord TheOtterlord deleted the improve-tab-scroll branch April 1, 2024 10:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
site improvement Some thing that improves the website functionality - ask @delucis for help!
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants