estuary / marketing-site

0 stars 5 forks source link

Brenosalv/bug/menu-and-banner-overlapping #326

Closed Brenosalv closed 1 month ago

Brenosalv commented 1 month ago

313

Changes

Remove overlapping between header and Take a Tour banner

Tests / Screenshots

Brenosalv commented 1 month ago

With banner:

Without banner:

github-actions[bot] commented 1 month ago

Visit the preview URL for this PR (updated for commit 597222d):

https://estuary-marketing--pr326-brenosalv-bug-menu-a-vinprzzg.web.app

_{(expires Thu, 27 Jun 2024 14:09:26 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 76f6b095a0752e5d9c6c890267f9fdc3e392161e}

travjenkins commented 1 month ago

This looks broken on load while waiting for the banner

This will cause a shift overall too. I think we should just redesign the header to be a bit taller all the time and that allows rooms for the banner. Having anything move/shift ends up hurting the Google performance metrics.

Brenosalv commented 1 month ago

This looks broken on load while waiting for the banner

This will cause a shift overall too. I think we should just redesign the header to be a bit taller all the time and that allows rooms for the banner. Having anything move/shift ends up hurting the Google performance metrics.

@travjenkins Do you think it's enough taller? I made the header's height 116px, the same from the redesigned header. I like this spacing between header and banner.

Also, another possible solution would be moving the banner to the bottom of the header, with position fixed out of it.

travjenkins commented 1 month ago

That looks good to me

I think we should move the menu drop down a bit closer though as it feels really far to me

Bumping it down to just 100px looked pretty solid to me