fix(theme-default): Support centering members in VPTeamPage

[stevending1st]

Todo

• Remove team-test.md before merging.

preview

Please click to view the screenshot

small

medium

fixed: #3769

[kiaking]

Gonna look into this. Needs a bit adjustment.

[marcosdissotti]

Try use idicomatic css writing to your styles, it's so good ✌️https://github.com/necolas/idiomatic-css

[kiaking]

I've updated a few things.

1. I went with more explicit media query approach on how we grid the layout. The .vp-doc part gets a bit more redundant but team member component style became simpler I guess.
2. Not related to this PR directly, but found out that <VPTeamPage> component margin top was broken (Vite website having issue, too much margin top) so I fixed it too. Also adjusted how we override these things (:slotted wasn't working as I expected).

@brc-dd
Could you test it 🙏 I've added https://localhost:5173/team-test page to test full team page. Should remove this file before merging.

[stevending1st]

@media (max-width: 640px)

---

@kiaking When there are more than 3 members on the page and the width is large, it is always displayed in two columns.

[kiaking]

Oh no 😅 Thanks! I'll fix it.

[kiaking]

OK, now I think I've fixed. I went and separated small and medium size styles completely since mixing them up was mixing up my brain 😅

[stevending1st]

OK, now I think I've fixed. I went and separated small and medium size styles completely since mixing them up was mixing up my brain 😅

Thank you! 😉 But there may be some problems:

1. When size is set to medium, the height is not equal

2. When the layout is home, size is small, but there are only two columns

[kiaking]

Oh no... thank you for keep testing! I'll continue look into it. Yeah I wasn't testing in home layout too, but not sure why it makes any difference... 🤔

[stevending1st]

Oh no... thank you for keep testing! I'll continue look into it. Yeah I wasn't testing in home layout too, but not sure why it makes any difference... 🤔

Thanks for the commit. ❤️You don't have to say thank you to me, I filed an issue (#3769) and then fixed it, and it's my responsibility to do that too. Since I don't know any more details, thank you for taking the time to help me refine this PR. ❤️