search

near / near-discovery-components

This is a repository that holds the source code of all NEAR discovery components that the team maintains for near.org.
https://near.org
MIT License
14 stars 12 forks source link

Update containers to support new sidebar layout #710

Closed calebjacob closed 7 months ago

calebjacob commented 7 months ago

Some of our BOS components need to have their container styles updated to support the new sidebar layout. Here's an example of a page that has horizontal scroll issues now when you're signed in: https://near-discovery-git-feat-navigatio-741442-near-developer-console.vercel.app/ecosystem/get-funding

Screen Shot 2024-03-18 at 9 56 02 AM

We need to scan through all of the components that are still being rendered as pages on near.org and update any that have layout issues combined with the new sidebar.

calebjacob commented 7 months ago

Hey @charleslavon, there's a community component that we're using for /gateways that could use a container update: onboarder.near/widget/BOSDirectory

You can view it here: https://near-discovery-git-feat-navigatio-741442-near-developer-console.vercel.app/gateways?sidebar=true

Notice the horizontal overflow scroll since they were originally needing to use negative margin to overcome the wrapping padding that they couldn't control. Once we merge the new layout PR, we'll want to ask them to remove their negative margin and double check their layout overall (maybe they want to adjust their padding too).

Another option is that I add some CSS hacks directly on our /gateways route to override their styles. What do you think is best?

calebjacob commented 7 months ago

@charleslavon And just for some more context, it's not specifically the sidebar layout that causes this issue. If you visit the preview with the marketing layout enabled, you'll see the same overflow issue: https://near-discovery-git-feat-navigatio-741442-near-developer-console.vercel.app/gateways

The layout PR introduces our new wrapping container regardless of the sidebar or marketing layout being rendered. This will give developers way more freedom - the only catch is that some developers need to remove their negative margin that's no longer necessary.