Add SDDS global header styling

kristen pol → credited alan.cole → .

Work is here

https://git.drupalcode.org/project/demo_design_system/-/merge_requests/77

I have class today so I won't be able to test this until tonight.

If someone else wants to test in the meantime, go for it.

I tried to test it. I'm not sure how everything should work.

1. One new bug, adding an image for Hero , and the publishing the page, the image disappear, and we have error message inside the settings of this SDC. See screenshot
2. In the above section, I added the new SDC Header Panel, in the fist column I tried to add branding block, but it's not present, not sure how to make it available.
3. The navigation block is available but doesn't show anything once included. Not sure what's need to be done to make it work
4. Small issue button tertiary is not right color
5. Some images have wrong path. See screenshot

Here what I achieved so far

I recorded my testing of the header and of global regions.

I'm not loving the UX of the global regions but I think that's a known thing so maybe it'll be different at some point.

I'm not sure it's good to build this into the hero because only the home page will have the hero and not the other pages.

If we could just build that bar more generically and put it into the header then it would be the same across all pages.

But then it wouldn't look integrated with the hero and a hero may or may not be on other pages and, if it is, it will be different.

I'm not sure what the best UX is for this.

I'll see if others have some thoughts.

Could this be a variation of the container rather than being its own "header panel" component?

https://youtu.be/pF6F523Jieg

I agree the UX is confusing of empty regions not being exposed in XB, needing to place stuff in the content and then moving it. After that though double-clicking on/into the region makes it possible to adjust it, which is for me at least natural. The initial part of how one tries to use it is confusing.

I think 📌 Too many global regions Active must be solved before this issue or as part of this issue first because otherwise you don't have a clean region to place the header onto. Otherwise I don't think this should be help up in trying to get it perfectly blend in with the hero/design at all :)

The regions are reduced in this issue’s MR but I didn’t include the header region because I had my unstyled blocks in there. Even disabled blocks will show up in XB.

I made an issue for me to remove those blocks from block placement so it’s not additionally confusing things. I’ll try to do soon.

Just merged these:

📌 Remove block placement of SDDS header+footer blocks Active
📌 Too many global regions Active

Removed some of the main menu links to reduce wrapping issues so it will look more like:

We're going to move from the standalone MR into an issue MR so non-maintainers can collaborate.

When splitting up the menus into starshot-specific ones, I must have missed some config as I get errors sometimes... I'll try to figure it out but am off to class for a few hours soon :/

I'll try with a fresh install later as my local db might be a bit borked now

I'll be out of commission until tonight, so unassigning in case someone can pick this up.

Here's a video of it (still processing)... not sure why the link styling disappeared after switching menus:

https://youtu.be/B_P-8bzG2cM

Oh… or probably because it’s not inside the hero

Merged MR and we'll do another MR to clean up some styling things.

Some generic styling to support footer and minor header tweaks happened in:

📌 Create SDDS global footer Active

https://youtu.be/V3JbUZ7_mHc

These changes were merged.

We probably want to move away from a specialized header component and move the styling into some of the generic components (e.g. flexible slot and or columns)

To avoid confusion, I'll mark this one as fixed and we can create a follow up issue for that.

Thanks, everyone!

Follow-up:

📌 Update SDDS components to move header_panel features to generic components Active

Note:

🐛 Twig\Error\LoaderError: Template "@atoms/starshot-menu/starshot-menu.twig" is not defined Active

update parent