patternfly / patternfly-design

Use this repo to file all new feature or design change requests for the PatternFly project
114 stars 104 forks source link

Page - review sticky section designs #1286

Closed mcoker closed 4 months ago

mcoker commented 7 months ago

This is what it looks like now. cc @lboehling

Screenshot 2024-02-09 at 7 06 25 PM
andrew-ronaldson commented 5 months ago
Screenshot 2024-04-09 at 8 17 35 PM

This is a possible solution but looking at the code I'm not sure how to make it work. @lboehling @mcoker any feedback on this?

Update: Unless we add fade/ blurr instead of the shadow (bad example in browser).

Screenshot 2024-04-09 at 8 30 36 PM
mcoker commented 5 months ago

@andrew-ronaldson off the top of my head, I'm not sure if that's possible either - to have the left/right edges of the sticky section span the full width of the content area. The content area has a white border around it now that creates the padding on the inside of the content area, and getting a section to overlap that border will be tricky. It's probably worth revisiting that part of the code and see if there is a better way to do that in a way that lets page sections bleed out to the edges of the main container though, so we could make a spike out of it.

andrew-ronaldson commented 5 months ago

I'm going to walk back all the nonsense I was saying about the full width border and the blurs/shadows. The only thing I'd like to update is a md spacer at the bottom of the page header content. One wrinkle Breadcrumbs and horizontal navigations need the spacer but the tabs component should not have a bottom spacer.

andrew-ronaldson commented 4 months ago

Closing this review and created a design kit issue