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

fix(content-sidebar): box ai sidebar zoom fix #3809

Merged

Conversation

kkuliczkowski-box
Copy link
Contributor

@kkuliczkowski-box kkuliczkowski-box commented Dec 20, 2024

Description

Fixed the styling of Box AI Sidebar when zoomed in >= 175%. Previously a horizontal scroll was appearing at the bottom.

Before:
image

After:
image

Mobile view looks the same as before:
image

@kkuliczkowski-box kkuliczkowski-box requested a review from a team as a code owner December 20, 2024 16:31
@kkuliczkowski-box kkuliczkowski-box force-pushed the content-sidebar/fix-box-ai-zoom branch from d261ecc to a92faeb Compare December 27, 2024 10:35
@@ -4,60 +4,52 @@

Copy link

Choose a reason for hiding this comment

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

Hi Kamil,
A clarification question:

  1. Instead of defining media query here you leverage media query created for the whole sidebar (here) by appending the bcs-is-wider class?

Copy link
Contributor Author

@kkuliczkowski-box kkuliczkowski-box Dec 27, 2024

Choose a reason for hiding this comment

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

Not really. Media query block was not needed after a small refactor I've done by not setting the Box AI Sidebar width to a fixed number ($sidebarContentIncreasedWidth). It's now using the entire available width in both scenarios.

And the addition of .bcs-is-wider was required to get a higher specificity for some of the selectors. We're safe to add it because bcs-is-wider will always be present when Box AI Sidebar is visible.

Copy link
Contributor

@marcoartaviaq marcoartaviaq left a comment

Choose a reason for hiding this comment

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

lgtm

@mergify mergify bot merged commit d679d60 into box:master Dec 27, 2024
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants