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: banner paddings #27301

Merged
merged 12 commits into from
Jan 13, 2025
Merged

fix: banner paddings #27301

merged 12 commits into from
Jan 13, 2025

Conversation

joshsny
Copy link
Contributor

@joshsny joshsny commented Jan 7, 2025

Problem

Banners had no padding on raw layouts

Changes

  • Add padding
  • Remove unused app-canvas layout

👉 Stay up-to-date with PostHog coding conventions for a smoother review.

Does this work well for both Cloud and self-hosted?

Yes

How did you test this code?

Looked at the banner

@joshsny joshsny changed the title fix: fix banner paddings fix: banner paddings Jan 7, 2025
Copy link
Contributor

github-actions bot commented Jan 7, 2025

Size Change: 0 B

Total Size: 1.11 MB

ℹ️ View Unchanged
Filename Size
frontend/dist/toolbar.js 1.11 MB

compressed-size-action

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

70 snapshot changes in total. 0 added, 70 modified, 0 deleted:

Triggered by this commit.

👉 Review this PR's diff of snapshots.

Copy link
Contributor

@zlwaterfield zlwaterfield left a comment

Choose a reason for hiding this comment

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

I'll be honest, I don't fully understand how your change shifted these pages down but it is now properly fitted so it works for me.

The pages where the first content block is the tab component looks like the space is a bit too large because of the padding on the tab but just a minor thing. It only looks fine now because the page is incorrectly formatted.

Before:
Screenshot 2025-01-07 at 11 22 57 AM

After:
Screenshot 2025-01-07 at 11 23 08 AM

@joshsny
Copy link
Contributor Author

joshsny commented Jan 7, 2025

@zlwaterfield Do you think it's worth fixing the padding issues by moving the logic down into the <ProjectNotice /> and <BillingAlertsV2 /> components? Right now this is rendering two divs of 0 height which is causing the layout change...

@zlwaterfield
Copy link
Contributor

@zlwaterfield Do you think it's worth fixing the padding issues by moving the logic down into the <ProjectNotice /> and <BillingAlertsV2 /> components? Right now this is rendering two divs of 0 height which is causing the layout change...

Ah yeah that's a good point. Yeah because those components render null for many cases.

@joshsny joshsny requested a review from zlwaterfield January 8, 2025 11:49
@joshsny
Copy link
Contributor Author

joshsny commented Jan 8, 2025

@zlwaterfield updated to move the check down into the individual components. Not the prettiest, but get's the job done

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

70 snapshot changes in total. 0 added, 70 modified, 0 deleted:

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@zlwaterfield
Copy link
Contributor

Might need to pull this and merge locally. Just use snapshots from master and it will re-run and update them after you push.

@joshsny joshsny enabled auto-merge (squash) January 13, 2025 19:21
@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

58 snapshot changes in total. 0 added, 58 modified, 0 deleted:

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@joshsny joshsny merged commit b7b49d6 into master Jan 13, 2025
99 checks passed
@joshsny joshsny deleted the fix-project-notice-layout branch January 13, 2025 19:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants