As noted, we'd like to put our normal header in the level 3 sticky header space as well. When this shrinks to mobile, the logo should lost the second line and move into the area on the left, per the screen shot below.
On mobile, the search bar could probably be a bit wider, maybe 10-15%.
On tablets, I would give it just a little padding on the left and right so text/tiles are not right up against the edge of the screen, but otherwise all good. I could note any additional tweaking when I do a full review of the desktop theme.
Also, it looks like this isn't on stage yet. Is that correct?
Just a note about this one that it looks like you've not yet pushed up the new sticky header for me to review. We should sort this before pushing to prod. From the screen shots you've provided, it looks close to done.
OK, no problem. Since this will go on production for a bit, however, could you adjust the text in the center of the sticky header to match the colored nav tabs on levels 2/3? See screen shot.
Note that there is a small theming issue with the search bar on the current sticky header. See screen shot and note how the text is running out. This looks to be confined to the grid pages, as it's not an issue on the section pages. We can probably ignore this since you'll be replacing the sticky header per the work in this ticket, but here's a note of this issue in case it's of use.
Note that on this ticket, the new sticky header still needs to be implemented. See the comment above that begins: "I've been working on this...." and the comments that follow.
Re: sticky header, please ensure that anchors clear the new header.
I've sorted the text running out issue, but I won't be able to do the change in the header.
I've already spent 3 hours today sorting out the other remains issues including this. Change the header will take a long time no doubt (its changes are far behind) have to wait for another round of work perhaps you can have someone look into it with the grant.
No problem. Let me offer a simpler solution. There are two variants to the header. The one that appears at larger resolutions and the one that appears at smaller resolutions.
Can you simply turn off the one for larger resolutions? In other words, on larger resolutions there would be no sticky header, and the current smaller resolutions sticky header would only appear at smaller resolutions. The only question I have is whether this would mess up the anchors. Note too that it needs to be turned off on both the grid and section pages.
As noted, we'd like to put our normal header in the level 3 sticky header space as well. When this shrinks to mobile, the logo should lost the second line and move into the area on the left, per the screen shot below.
See issue #10
I've been working on this a bit and gone though several iterations as to what looks best at every resolution, does this work for you?
Phones (320px - 768px)
Tablets (769px - 991px)
Tablets and Small Desktop (992px - 1199px)
Desktop (1200px and greater)
Yes, this looks good to me.
On mobile, the search bar could probably be a bit wider, maybe 10-15%.
On tablets, I would give it just a little padding on the left and right so text/tiles are not right up against the edge of the screen, but otherwise all good. I could note any additional tweaking when I do a full review of the desktop theme.
Also, it looks like this isn't on stage yet. Is that correct?
Nope not on stage yet, still tweaking.
See attached. This is how the sticky header looks on my mobile. Here the search box could be widened a bit.
Just a note about this one that it looks like you've not yet pushed up the new sticky header for me to review. We should sort this before pushing to prod. From the screen shots you've provided, it looks close to done.
Other changes have messed with the work I've done thus far, I think we should wait on this till after the move to production.
OK, no problem. Since this will go on production for a bit, however, could you adjust the text in the center of the sticky header to match the colored nav tabs on levels 2/3? See screen shot.
K I've changed the font and size to match closer to the other uses of nav tabs for now.
OK, great. Thanks for doing this!
Note that there is a small theming issue with the search bar on the current sticky header. See screen shot and note how the text is running out. This looks to be confined to the grid pages, as it's not an issue on the section pages. We can probably ignore this since you'll be replacing the sticky header per the work in this ticket, but here's a note of this issue in case it's of use.
Note that on this ticket, the new sticky header still needs to be implemented. See the comment above that begins: "I've been working on this...." and the comments that follow.
Re: sticky header, please ensure that anchors clear the new header.
I've sorted the text running out issue, but I won't be able to do the change in the header.
I've already spent 3 hours today sorting out the other remains issues including this. Change the header will take a long time no doubt (its changes are far behind) have to wait for another round of work perhaps you can have someone look into it with the grant.
No problem. Let me offer a simpler solution. There are two variants to the header. The one that appears at larger resolutions and the one that appears at smaller resolutions.
Can you simply turn off the one for larger resolutions? In other words, on larger resolutions there would be no sticky header, and the current smaller resolutions sticky header would only appear at smaller resolutions. The only question I have is whether this would mess up the anchors. Note too that it needs to be turned off on both the grid and section pages.
I figured out how to hide the sticky header, so for now I've hidden it for all screen widths. Anchors look OK, also.
If we come to develop the sticky header more at some future project stage, we can just show it again as all the code is still there.