[Publications] Summary Link Order

[sabrinang]

There's been feedback for adjusting the summary link order or format such as:

• Data for Empowerment research series, they want to be able to change the two columns to be vertically ordered not horizontal
• Trustworthy AI whitepaper, Sarah W wanted to be able to have one column for the summary content https://github.com/mozilla/foundation.mozilla.org/issues/5800#issuecomment-744577728

Are these possible options to provide?

---

Updates: according to this comment

have one column when there are less than 5 links, and two columns when there is more

[benhohner]

@sabrinang Can you provide some more detail on what is requested/desired? We need a bit more information before we can recommend solutions

[sabrinang]

@benhohner Yes, I annotated some screencaps here to go along with the request

• Data for Empowerment research series, they want to be able to change the two columns to be vertically ordered not horizontal:

  

• Trustworthy AI whitepaper (this is the executive summary section within it) they wanted to be able to have one column for the summary content:

  

My concern with one column however is that when it has a lot of content in the summary it pushes the content quite down on desktop (see below)

[mmmavis]

We might wanna settle for just having one 2-column link order because from the users' perspective, having two different order options here and there is very confusing unless the links are explicitly numbered.

[mmmavis]

@sabrinang assigning this one to you as we need to finalize specs and mockup before we can start implementation!

[sabrinang]

@mmmavis I agree that having both orderings would be confusing so I'm planning to go with just the vertical ordering. I was wondering is it possible to have one column when there are less than 5 links, and two columns when there is more?

[mmmavis]

@sabrinang yup it should be possible.

[mmmavis]

I've updated the ticket description with the decision we made.

[mmmavis]

Thanks for tackling this @danielfmiranda !

@sabrinang is back from PTO and got the chance to test your solution out on prod. It seems like the PR has introduced some undesired side effects. I'm gonna re-open this ticket so you can work closely with Sabrina to get this to a perfect state! 😃

Issues:

1. Some page split the links into 2+ columns. e.g., https://foundation.mozilla.org/en/data-futures-lab/data-for-empowerment/shifting-power-through-data-governance/
2. columns are not in equal width

I didn't try it out myself but column-count might be something we can utilize. We also used this on footer links so it's worth looking into.

[danielfmiranda]

Thanks for the catch @sabrinang and thank you for the suggestion @mmmavis! Using the column-count instead of css grid worked great :D I have assigned a PR with the fix to this issue.

Please let me know if you have any questions