Implement common IOOS.us header/menubar/footer framework in IOOS Catalog

[mwengren]

What should we add?

Documentation for the common header/menubar/footer is here: https://github.com/ioos/ioos-us/blob/andy-refactor/component-library/README.md.

Task is to modify the CKAN UI to integrate this in a way that aligns with the existing CKAN header/menubar, ideally.

Will require some CSS/template changes in the CKAN code base.

Reference

No response

[benjwadams]

@mwengren, link to README is 404.

[benjwadams]

Need further clarification on this issue.

[mwengren]

Hi @benjwadams. The updated header/footer documentation is located at: https://github.com/ioos/ioos-us/blob/main/component-library/README.md.

I think for the Catalog we want to use the 'compact' option so the menu bar hides/unhides dynamically and doesn't get in the way of the CKAN menu.

Here's an example showing it deployed: https://ocefpaf.github.io/ioos_code_lab/content/intro.html

This would replace the current header/banner, as well as the footer in the Catalog - currently the layout of that is all garbled anyway.

I guess one challenge is that we might need to insert the language/i18n selection pulldown that's in the current CKAN footer separately - maybe in it's own row just above the shared footer? Open to suggestions.

Would it be easier to have @nguyandy just implement this since he made the header/footer component?

[mwengren]

@jamesdoyle21 @benjwadams I'd like to add this one to the list of issues to address. The order in the board can be used to prioritize, so work on this one after the CKAN performance ones. Or, if @nguyandy is available to implement it himself in parallel with Ben, that would be great.

Let me know if you have any questions!

[jamesdoyle21]

Hi @mwengren, yes we can add this task to our list. @nguyandy do you have bandwidth to work on this one and do you know what needs to be implemented for this issue?

[nguyandy]

Yup! I can take care of this next week

[nguyandy]

Hi @mwengren , one thing catalog has is a language selector (found in the footer).

With this change, the new IOOS header/footer component won't support translations.
The translations on catalog are done server-side using i18n, so our components are skipped.

I don't see an easy path forward to support translations. Is this something we should address before completing this issue?
FWIW, it does look like a good chunk of the IOOS Catalog site isn't translating.

[benjwadams]

i18n will still work, but you'll need to manually enter the locale in the address bar, e.g.: https://data.ioos.us/fr/