Add community section in landing page

[MakisH]

Adds a "Join the community!" section in the landing page.

• After the academic, before the support program, but short to not steal too much attention. This also fits the natural path (internal -> open -> open + support).
• No button "Contribute to preCICE", to avoid too much visual repetition compared to the "Support preCICE", which I used as starting point. We have too many buttons anyway. There is a link to the same page in the text.
• I already considered putting the photo on the left, to alternate from the section below. But it then looks very strange as not aligned with the section heading, and the image comes before the text in small screens. On the right, it also naturally connects with the last text line.
• Changed the picture to have a ratio of 1:2, thinking it would help me with the implementation. In any case, it increases the people/background ratio.

I have used this StackOverflow answer for the cropping part. Later, I saw that there were more methods, but this one worked already.

Reviews:

• @uekerman please check the content and position
• @fsimonis please check the implementation

---

Screenshots in different views:

[uekerman]

Content and position is good.
Thanks for adding this 👍

Only thing: On one of your screenshots some head is cut.

[fsimonis]

I simplified the html/css and directly pushed the update.
Looks like you were fighting the panel class.

The outcome looks good on any device. Let's not add additional css.

[MakisH]

I was indeed fighting the panel class, but I wanted to use it (or another container) to have rounded corners and the cropping feature.

Anyway, it does not look bad now either, it's just a bit... plain. 😬

[fsimonis]

@MakisH Like this? 😃 dd86efc