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

Account for scrollbar in expanded SideNavigation #2123

Merged
merged 2 commits into from
May 22, 2023

Conversation

connor-baer
Copy link
Member

@connor-baer connor-baer commented May 22, 2023

Addresses a Slack thread.

Purpose

The SideNavigation is supposed to be fully expanded on viewports wider than 1920px. This can cause a flicker on monitors that measure exactly 1920px since the viewport size is reduced by the scrollbar which is present on most pages. When opening a modal, the page content is locked in place, so the scroll bar disappears and the side navigation is expanded.

Approach and changes

  • Reduce the breakpoint to 1900px (scrollbars tend to be 12-20px wide)

Definition of done

  • Development completed
  • Reviewers assigned
  • Unit and integration tests
  • Meets minimum browser support
  • Meets accessibility requirements

@connor-baer connor-baer requested a review from a team as a code owner May 22, 2023 15:34
@connor-baer connor-baer requested review from tareqlol and removed request for a team May 22, 2023 15:34
@changeset-bot
Copy link

changeset-bot bot commented May 22, 2023

🦋 Changeset detected

Latest commit: 5386712

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@sumup/circuit-ui Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented May 22, 2023

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

Name Status Preview Comments Updated (UTC)
oss-circuit-ui ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 22, 2023 3:51pm

@connor-baer connor-baer added the 🐞 bug Something isn't working as it should label May 22, 2023
@codecov
Copy link

codecov bot commented May 22, 2023

Codecov Report

Merging #2123 (5386712) into main (b9500fc) will not change coverage.
The diff coverage is 100.00%.

Impacted file tree graph

@@           Coverage Diff           @@
##             main    #2123   +/-   ##
=======================================
  Coverage   92.04%   92.04%           
=======================================
  Files         170      170           
  Lines        3571     3571           
  Branches     1248     1248           
=======================================
  Hits         3287     3287           
  Misses        263      263           
  Partials       21       21           
Impacted Files Coverage Δ
...components/DesktopNavigation/DesktopNavigation.tsx 100.00% <100.00%> (ø)

@connor-baer connor-baer merged commit 2218490 into main May 22, 2023
@connor-baer connor-baer deleted the fix/navigation-expanded branch May 22, 2023 15:56
@connor-baer connor-baer mentioned this pull request May 22, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🐞 bug Something isn't working as it should 🗂 circuit-ui
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants