Feature request: sticky header styling options

Currently you have to write some custom CSS to get separate styling for headers that become sticky. However, wouldn’t it make sense to include some native options for sticky header styling?

2 Likes

Was thinking about the exact same thing the last time I had encountered this!

A separate, style-able ‘isSticky’ state for the background would be nice. For example, if you want the header bg to be transparent while showing your hero section and let it have a background color as soon as you scroll down.

2 Likes

I agree it would be nice. It would be nice to have a similar state styling like “bricks” where :hover is it’s own selectable and when selected any changes to the controls only affect when you are hovering over an element. I’m not sure our solution would look like that, but I’ll keep some thoughts on it. Have a great weekend.

4 Likes

That would be amazing. Would that mean that other states like :active, :focused, etc. can be included too?

2 Likes

:active and :hover might work a bit different since our interaction controls for color sort of already touch on that. But yes it would touch on various states like :focused. It’s a larger project though since the elements in Cornerstone aren’t just single elements outputted so targeting those states to our controls might be a little difficult. It would be cool to see this in Cornerstone though.