Blog index with tags rebase

[Pomax]

Closes #3371
Related PRs/issues #3427 (#3370)

This adds tag filtering to any page of type IndexPage - e.g. if there is a listing page with slug /blog, visiting /blog/tags/tag1 or /blog/tags/tag1/tag2/tag3/... effects listing only pages posts that match that specific tag, or any of the specified tags, respectively.

(tags as used in urls should be the tag slug: Internet Health becomes internet-health, etc.)

Test URL

https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/

Also click on any of the blog cards' main tag to go to the dedicated tag page, e.g:

https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/tags/iot

Also also, verify that "related posts" blog cards still work:

https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/initial-test-blog-post-with-fixed-title/

Deviations from the design

As tags are no longer "filters" but real URLs, so the "clear filters" link has been (for now) omitted, in favour of people using their browser's "back" button.

The "result" phrasing has been changed to "X pages for (tag)", as the URL and page content does not suggest any searching/filtering happens, so talking about "results" without the user performing a search or active filter was problematic.

On any tag-specific page, blog cards show all tags, not just their "main" tag, or just the tag that page is for.

Design questions

• which styling is suppose to be used for the "pages found" line? Using body makes it feel very small.
• should cards show all tags when specifically searching for a tag? If not, things like https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/tags/iot/ get confusion, as the page is supposedly for iot posts, but because that's not the main tag for some pages, it'll look like there are pages listed that don't belong on that page.

[Pomax]

adding @patjouk for review because I might have done something really silly, python wise (and it'll be good to know if I have! =D)

[Pomax]

@alanmoo @mmmavis could this please get a review (@patjouk, I added you mostly for your expertise, if you feel this would cut into your work too much, feel free to remove yourself as reviewer)?

It's been sitting for a few days and is holding up other work around the same model =(

[alanmoo]

Code looks good, just a couple questions. Thanks for so many comments!

Not approving yet because I want to try it out and think rebuilding the review app is the fastest way?

[Pomax]

@mmmavis @alanmoo one more pass?

[alanmoo]

The code looks fine, but I'm not convinced the term list is quite right. I see @mmmavis already had some comments about this, but the vertical alignment of the smaller text isn't sitting with me the right way.

My instinct is to keep the text the same size, border-radius back to 1em, remove the vertical-align property, and set the line-height of .term to 1.

Though the point could also be raised that this whole "pill" style feels out of place and not like anything else we do, which is why this whole thing feels weird to work on.

That all being said, this isn't significant enough to block landing this, but I would want Kristina to have another look at this when she gets back, as I think any adjustments here would be a matter of a designer and dev sitting together for 10 minutes.

[Pomax]

No question, when Kristina's back we need to look at a lot of things.

[alanmoo]

If you're going to merge, file a bug for her.

[mmmavis]

Yea same thoughts as Alan's. We will need to work with Kristina when she's back to fine tune stuff.

[mmmavis]

Note Pulse also uses pill button so we should standardize the styling.

[Pomax]

I will leave this open until Kristina's back, since that's only a few days from now.

[Pomax]

@kristinashu I've added in the tweaks from our call, test URLs are:

• https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/ (blog index page)
• https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/tags/iot/ ("filtered" page for the "iot" tag)
• https://foundation-mofostaging-pr-3464.herokuapp.com/en/blog/initial-test-blog-post-with-fixed-title/ (regular blog post showing related posts)

[kristinashu]

This is looking and working swimmingly!