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.

Sign up for GitHub

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

Jump to bottom

fix(masthead): update overflow scrolling positions #4333

Merged
merged 16 commits into from
Oct 29, 2020
Merged

fix(masthead): update overflow scrolling positions #4333

merged 16 commits into from
Oct 29, 2020

Conversation

ariellalgilmore
Copy link
Member

Related Ticket(s)

#4188

Description

update scrolling positioning to align with functional specs. Align items to right/left if partially hidden or move to start or end of container.
ezgif com-gif-maker (1)

Changelog

Changed

  • paginate functions to check for what is being overlapped and scroll to appropriate location

@ariellalgilmore ariellalgilmore added package: react Work necessary for the Carbon for IBM.com react components package hacktoberfest labels Oct 28, 2020
@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 28, 2020 •
edited
Loading

Deploy preview created for package React:
https://ibmdotcom-react.s3.us-south.cloud-object-storage.appdomain.cloud/deploy-previews/4333/index.html

Built with commit: 9f8826e1f481d8036fddc7e10a979971c72132f1

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 28, 2020 •
edited
Loading

Deploy preview created for package Web Components:
https://ibmdotcom-webcomponents.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/4333/index.html

Built with commit: 9f8826e1f481d8036fddc7e10a979971c72132f1

kennylam
kennylam reviewed Oct 28, 2020
View reviewed changes
Copy link
Member

@kennylam kennylam left a comment

Choose a reason for hiding this comment

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

Looking good @ariellalgilmore! I'm seeing a few small things:

On load both arrows will flicker off when they aren't needed. A few times they didn't disappear at all. This is random but the flicker happens every time.

Oct-28-2020 15-46-07

Same issue in Safari except the box-shadow is still visible when the arrow disappears.

Screen Shot 2020-10-28 at 3 46 21 PM

asudoh
asudoh reviewed Oct 28, 2020
View reviewed changes
Copy link
Contributor

@asudoh asudoh left a comment

Choose a reason for hiding this comment

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

Thank you for trying to address this @ariellalgilmore!

packages/react/src/components/Masthead/HeaderNavContainer.js Outdated Show resolved Hide resolved
@ariellalgilmore
Copy link
Member Author

@kennylam thanks! Fixed the flicker, but still trying to investigate why the gradient still shows in safari.

asudoh
asudoh reviewed Oct 28, 2020
View reviewed changes
Copy link
Contributor

@asudoh asudoh left a comment

Choose a reason for hiding this comment

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

Thank you for the update @ariellalgilmore!

packages/react/src/components/Masthead/HeaderNavContainer.js Outdated Show resolved Hide resolved
packages/react/src/components/Masthead/HeaderNavContainer.js Outdated Show resolved Hide resolved
asudoh
asudoh reviewed Oct 28, 2020
View reviewed changes
Copy link
Contributor

@asudoh asudoh left a comment

Choose a reason for hiding this comment

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

Thank you for the update @ariellalgilmore!

packages/react/src/components/Masthead/HeaderNavContainer.js Outdated Show resolved Hide resolved
packages/react/src/components/Masthead/HeaderNavContainer.js Outdated Show resolved Hide resolved
asudoh
asudoh approved these changes Oct 29, 2020
View reviewed changes
Copy link
Contributor

@asudoh asudoh left a comment •
edited
Loading

Choose a reason for hiding this comment

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

LGTM 👍 - Thanks @ariellalgilmore! Would you want to update the snapshot?

kennylam
kennylam approved these changes Oct 29, 2020
View reviewed changes
Copy link
Member

@kennylam kennylam left a comment

Choose a reason for hiding this comment

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

Looks great thanks @ariellalgilmore!

@ariellalgilmore ariellalgilmore merged commit a97b079 into carbon-design-system:master Oct 29, 2020
@ariellalgilmore ariellalgilmore deleted the fix/overflow-scrolling branch October 29, 2020 17:32
@jeffchew jeffchew mentioned this pull request Nov 10, 2020
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@asudoh asudoh asudoh approved these changes

@kennylam kennylam kennylam approved these changes

@IgnacioBecerra IgnacioBecerra Awaiting requested review from IgnacioBecerra

@raphaelamadeu-zz raphaelamadeu-zz Awaiting requested review from raphaelamadeu-zz

@annawen1 annawen1 Awaiting requested review from annawen1

@andysherman2121 andysherman2121 Awaiting requested review from andysherman2121

Assignees
No one assigned
Labels
package: react Work necessary for the Carbon for IBM.com react components package
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@ariellalgilmore @ibmdotcom-bot @kennylam @asudoh