Start community category styles

[MaggieCabrera]

Partially addresses #148

This adds some starting styles to the Community category page

Desktop:

Mobile:

[ryelle]

It looks like this template has specific hover/focus styles:

[MaggieCabrera]

It looks like this template has specific hover/focus styles:

Oh I missed those, thank you!

[beafialho]

@MaggieCabrera it's looking good!

• The black color on hover seems darker in the screenshot. Just wanted to make sure it's set to #1E1E1E as intended.

• Could you please make sure that the post titles with images have the same spacing as the ones without images? Those are sitting a little bit lower than the others:

• For tablet sizes, the titles overlap and aren't readable. Is there any chance to improve their responsiveness or is this a Gutenberg issue?

Gravacao.do.ecra.2022-01-17.as.17.30.55.mov

[ryelle]

This is looking good! I have a few small changes requested, and could you run the linter & fix the issues?

yarn workspace wporg-news-2021-theme lint:css --fix

[MaggieCabrera]

@beafialho is it ok if we jump from 4 per column to 3 or 2 when we go to tablet size to avoid the issue you highlighted?

[beafialho]

@MaggieCabrera yes, we can use 3 or 2 columns

[MaggieCabrera]

ok, this is ready for another review, I fixed all the mentioned issues, and changed the grid to drop to 3, then 2 then 1 column while we lower the viewport width

[beafialho]

Looks perfect @MaggieCabrera!

Do you have any idea why this post has the off white background?

[MaggieCabrera]

Looks perfect @MaggieCabrera!

Do you have any idea why this post has the off white background?

It's marked with the class .has-post-thumbnail so it should be showing an image instead of the blue background, I'm not sure if there's a problem with the imported content or what's going on there. I could add the blue background always by default so this is not a problem

[MaggieCabrera]

It's marked with the class .has-post-thumbnail so it should be showing an image instead of the blue background, I'm not sure if there's a problem with the imported content or what's going on there. I could add the blue background always by default so this is not a problem

Nevermind that, I did that but the text only appears on hover, as do all the rest of the posts with an image. I think it's best to just make sure that the post has a thumbnail correctly in this case

[ryelle]

I have the same post missing a featured image, I think there must've been an issue in the export. If I remove the (broken) featured image, it works as expected.

[ryelle]

👍🏻
Thanks for all your work!