Normalize landing page vertical spacing#1524
Conversation
…-spacing' into fix/community-page-mobile-tablet-spacing # Conflicts: # landing-pages/site/assets/scss/_community-page.scss
|
If similar issues exist on other pages (event, use-case, ecosystem, etc.), could we fix them using a consistent style as well? |
Sure. I'll take a look |
parkhojeong
changed the title
|
@choo121600 I added the checked page list with screenshots to the PR description. Could you take another look? |
choo121600
left a comment
choo121600
left a comment
There was a problem hiding this comment.
The layout structure of each page appears to be similar, but the styling approach is not consistent.
In some places, the page styles are modified, while in others the container styles are adjusted. This mixed approach could increase maintenance complexity over time.
If the layout structure is the same, it would be better to consolidate these into shared/common styles.
Thanks, that’s a good point. I agree I have a question about the design guidelines. It’s a bit unclear what to base the spacing on. do you have any references, like a Figma mockup? |
|
As far as I know, there isn’t a dedicated mockup or design system for this yet. |
|
Indeed - we do not have one ... not any more and there were many changes since the initial design many years ago |
|
@choo121600 @potiuk This looks like a common situation, and I enjoy helping bring projects into alignment and clean things up. Glad to work on this :) I’ll take a closer look! |
|
I think it would be good to keep the scope of this PR focused on making the CSS layout styling more consistent across pages. A broader design-system/style-guide discussion could probably be handled separately in a follow-up PR :) |
I think so. I'll keep this PR focused on that scope. |
|
I addressed this in the following commits: ba94eb7, 56ca38f
There are many implicit CSS dependencies due to selector-based styling, and we do not have tests or design guidelines to catch regressions. So changing CSS or HTML can introduce side effects that are hard to catch. As a first step, these changes look good to me and should help reduce regressions in follow-up changes. Would appreciate your thoughts on this. |
| .navbar { | ||
| position: fixed; | ||
| header { | ||
| position: sticky; | ||
| top: 0; | ||
| z-index: 32; | ||
| } | ||
|
|
||
| .navbar { | ||
| position: static; | ||
| width: 100%; | ||
| background-color: white; | ||
| border-bottom: solid 1px map-get($colors, very-light-pink); | ||
| z-index: 32; |
There was a problem hiding this comment.
Could you explain why this change is needed?
3 participants
Previously, the vertical spacing across pages was inconsistent. This work normalizes it across the site.
Overview
spacing rule
navbar(fixed) height+custom spacing per page(base-layout: 40px, others: custom per page)40px(desktop)checked list with screenshot
/
/community
/community/resources/
/meetups/
/docs/
/use-cases/
/use-cases/etl_analytics/
/announcements/
/blog
/blog/airflow-survey-2025/
/ecosystem/
/code-of-conduct/
cc @choo121600