Generating a generic listing page and blog listing specific page

[Pomax]

Closes #3370
Related PRs/issues #3371

This does not do any fancy "load initial subset, JS-enabled MORE button to load more results", given that the first use of this model is for blog posts, of which we only have a handful.

#3443 has been filed for the JS functionality.

Test

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

[Pomax]

@kristinashu this should be ready for design review

[alanmoo]

I can tell you just by looking that the margins in the top section are wonky, you probably need a few .my-# classes in there or something like that. @kristinashu What's the best way to iron this out?

[kristinashu]

Thanks Pomax! A few questions and thoughts:

Tags

For the /blog page, can we show the first tag listed in the posts promote tab for each post?

Comp:

Filter view

Have you added the filter by tag view yet? I added the tag 'test' to one of the post then tried the url https://foundation-mofostaging-pr-3427.herokuapp.com/en/blog-list/?tag=[test] but it didn't change anything.

Comp:

Spacing

Just a bit of finessing is needed for the gaps. I'm reluctant to give exact px spacing but here is a comp with some guidelines. I know this will very slightly because of the preexisting spacing associated with the text so just use this comp as a guideline. Note, we stick to multiples of 8px.

[mmmavis]

(Let me know if I should review this sooner. I usually wait for PR to pass design review first.)

[Pomax]

@kristinashu fixed the line widths, it should now be 8 at medium and above, and 12 at smaller than that.

[Pomax]

The grey bar looks like the minisite nav without any content (because there is none) so I'll see if I can remove that nav from this template entirely.

[Pomax]

it was - removed the minisite-specific bits because this is not a minisite and what were they doing in the template in the first place here =P

[kristinashu]

w00t!

[Pomax]

@kristinashu @mmmavis the Percy failure looks like a genuine concern: the "participation guidelines" gets spread out over two columns...

[kristinashu]

Why is this PR changing the footer?

[Pomax]

Your guess is as good as mine: it's only showing changes in the footer for two (out of eleven?) pages, both entirely unrelated to this, and if I check those pages on the review app things look perfectly fine, so.... it could just be Percy being wrong? =/

[kristinashu]

Hmm weird, should we push to staging and then check those pages there?

[Pomax]

That feels reasonable, although @mmmavis and @alanmoo will still need to R+ before we land.

[mmmavis]

Two questions:

• In order for a page to show up on an index page, that page has to be child of the index page. This means child page urls will become /index-page/child-page. Will we running into issues with URL if we are planning to create index page of existing pages on production (e.g., their URL will change and we'll have to deal with redirects???)?
• Will there be cases where we want a page to belong to more than one index page?

[alanmoo]

Two questions:

* In order for a page to show up on an index page, that page has to be child of the index page. This means child page urls will become `/index-page/child-page`. Will we running into issues with URL if we are planning to create index page of existing pages on production (e.g., their URL will change and we'll have to deal with redirects???)?

We shouldn't; We've had mini-site namespace pages in place for a while, so this will be replacing some of those, making previously dead URLs into real ones.

* Will there be cases where we want a page to belong to more than one index page?

I think that's beyond the scope of intent for this page.

[alanmoo]

This looks way better and feels like the right approach. One tiny comment from me and another from Mavis, and I think we're all set.

[alanmoo]

🎉