-
Notifications
You must be signed in to change notification settings - Fork 3.2k
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: add padding to bottom of global mode list #22112
fix: add padding to bottom of global mode list #22112
Conversation
Thanks for taking the time to open a PR!
|
Co-authored-by: Mark Noonan <mark@cypress.io>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fix looks good and addresses the immediate issue 👍
One thought I had is that we could add this padding globally within the launchpad, like we do for the horizontal padding:
cypress/packages/launchpad/src/Main.vue
Line 15 in b0e32f8
class="px-24px pt-86px" |
This would ensure that all components rendered within Main (including the project list) would have some level of bottom padding. But it would also add more padding to components that already have their own, so we'd have to double check for those.
@marktnoonan thoughts on this approach? If we want to circle back around with another issue to make the padding consistent, I'd be fine with that too. The project list is the most egregious at this point, but the browser selection and error views are also flush with the window when scrolled:
That's a good suggestion @tbiethman. @viniciuspietscher why don't you go ahead and make that change in Main.vue. Let's drop the component test changes from this PR and let Percy detect if the padding at the bottom of global mode changes. |
@marktnoonan updated the PR with the suggested changes. 👍 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This does look like an improvement from what we have today.
@marktnoonan I would say that we should have a look together at the padding and scrollbars together as I've seen a lot of things that don't quite match up to our expectations and it's not easy to show some of these things in Figma either.
PRs from external contributors consistently exhibit failures on these 7 tests link to CI. I don't know why, but it has happened multiple times recently, and I'd like to find out why, it's blocking lots of great contributions. Posting this here to have something to refer to while debugging this issue. Edit: might be fixed: #22326 Even if I push an empty commit, it's the same. The problem seems to be isolated to CI runs with containers initially created by an external contributor. |
Test summaryRun details
View run in Cypress Dashboard ➡️ Flakiness
This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard |
This PR was Co-authored-by: Mark Noonan mark@cypress.io
User facing changelog
Add 24px of padding to bottom of global mode list.
Additional details
Why was this change necessary?
Projects list on GlobalPage were flush with the end of the page.
What is affected by this change?
GlobalPage UI
Steps to test
Add a small viewport with
cy.viewport()
on packages/launchpad/src/global/GlobalPage.cy.tsxHow has the user experience changed?
Before:
After:
PR Tasks
cypress-documentation
?type definitions
?