search

visual-framework / vf-core

A (primarily CSS) framework that targets needs of life science websites and services
https://stable.visual-framework.dev/
Apache License 2.0
22 stars 10 forks source link

Component variant: secondary footer #1339

Open khawkins98 opened 3 years ago

khawkins98 commented 3 years ago

For big organisations, they usually have a global footer and section-specific footers (about EMBL vs about EMBL's microscopy unit).

In both cases the footers span a section of pages, but the section-specific footer often needs to appear before the global footer.

Standard questions

image https://www.ebi.ac.uk/style-lab/websites/meta-patterns/page-structure.html

Any further thoughts?

Maybe similar to the main vf-footer but with a slightly lighter background?

This is becoming an area of recurring need as services develop their own things. Flagging as high importance.

Here's the workaround look i've been using for now (just a vf-grid with link lists)

image

sturobson commented 3 years ago

The second image looks like a 3 column vf-grid using vf-links-list--easy without the SVG.

Do we need to complicate things by adding a variant?

khawkins98 commented 3 years ago

The services should use a vf-footer, but they can't as, well, two vf-footers don't stack well as containers.

I think there's also a risk in not formalising what a "vf-footer--local" should look like as some services will add a background colour, or use different layout approaches.

I think it might be enough to have "vf-footer--local" supply a fullbleed background and perhaps support for a "vf-footer__notice"

USWDS probably comes closest to this with .usa-footer site-footer that complements the .usa-identifier (https://designsystem.digital.gov/utilities/):

grafik

khawkins98 commented 3 years ago

And here's the "local footer" for another forthcoming hamburg-based embl service:

image

sturobson commented 3 years ago

What I think I’m getting at is … we have existing components that look like they do this — I don’t want to be generating any additional CSS unless truly required.

I think we can have the variant here but as a ‘naming hook’ only and rely on existing CSS and class names to get the look and feel.

The other thing that got me here was thinking this would a ‘one off’ requirement, rather than something lots of teams would need. Again, I don’t think we should get to making ‘one off’ variants as part of vf-core and make any new variants something that’s ‘required’ by lots of teams. Or we could end up with lots and lots of weird and wonderful variants — losing all site and sense of any attempts at ‘systemising the design’.

khawkins98 commented 3 years ago

To date it's mostly been 1st and 3rd party (EMBL and COVID Portal, for examples). But now we're going to see a wave of "second party" that will be EMBL branded but have distinct sub-identities and organisation.

I'd estimate a local footer would be used in something like 20 to 50 services (eventually). Maybe 10 in the next six months.

Probably worth catching up on this at one of the next calls. Might be worth including Cindy too. We're entering a new phase of the adoption of the VF.

sturobson commented 3 years ago

We're entering a new phase of the adoption of the VF.

Better get some good guard rails up quick.

aside: This relates to the site footer and preventing it from being a dumping station for all the links in the organisation - which it's close to getting to … which is another discussion.

khawkins98 commented 3 years ago

Another one that's popped up on https://www.alphafold.ebi.ac.uk/

image

nikiforosk commented 2 years ago

Another one that's popped up on https://www.alphafold.ebi.ac.uk/

image

This looks more like an acknowledgement of partnerships. Also, would the elixir-banner fall into this category?

I feel that we need to revisit this discussion when we have to work on concrete use case that might require this component so currently I'm keeping its status as "On Hold".