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(ui): Adjust sizing of page filter components to prevent overflow in more cases #41979

Merged
merged 3 commits into from Dec 6, 2022

Conversation

malwilley
Copy link
Member

@malwilley malwilley commented Dec 2, 2022

Fixes #41932

Before:

CleanShot 2022-12-02 at 12 01 58

CleanShot 2022-12-02 at 12 07 38

After:

CleanShot 2022-12-02 at 12 01 53

CleanShot 2022-12-02 at 12 08 26

@malwilley malwilley requested a review from a team as a code owner December 2, 2022 20:03
@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Dec 2, 2022
@@ -37,7 +37,7 @@ const PageFilterBar = styled('div')<{condensed?: boolean}>`
}

& > * {
min-width: 6rem;
min-width: 7rem;
Copy link
Member Author

Choose a reason for hiding this comment

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

Increasing this to 7rem ensures that 24h and other 3 character time range selections don't overflow

@malwilley malwilley force-pushed the malwilley/fix/page-filter-overflow branch from a02fdc4 to 2f85e92 Compare December 2, 2022 20:05
@@ -80,7 +80,7 @@ type Props = {

function ProjectPageFilter({
specificProjectSlugs,
maxTitleLength = 30,
maxTitleLength = 25,
Copy link
Member Author

Choose a reason for hiding this comment

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

Decreased this from 30 to 25 because it was taking up too much of the maximum 30rem width allowed by the page filter bar.

Copy link
Member

@evanpurkhiser evanpurkhiser left a comment

Choose a reason for hiding this comment

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

Code looks fine. Will let @vuluongj20 take this one

@vercel
Copy link

vercel bot commented Dec 6, 2022

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

Name Status Preview Updated
sentry ✅ Ready (Inspect) Visit Preview Dec 6, 2022 at 5:32PM (UTC)
storybook ✅ Ready (Inspect) Visit Preview Dec 6, 2022 at 5:32PM (UTC)

@malwilley malwilley merged commit 512d0fa into master Dec 6, 2022
@malwilley malwilley deleted the malwilley/fix/page-filter-overflow branch December 6, 2022 18:27
@github-actions github-actions bot locked and limited conversation to collaborators Dec 22, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Scope: Frontend Automatically applied to PRs that change frontend components
Projects
None yet
3 participants