go-gitea / gitea

Git with a cup of tea! Painless self-hosted all-in-one software development service, including Git hosting, code review, team collaboration, package registry and CI/CD
https://gitea.com
MIT License
45.24k stars 5.5k forks source link

Add Avatar Border for Visual Consistency #32574

Open kerwin612 opened 2 days ago

kerwin612 commented 2 days ago

For the ① mentioned in the comment (https://github.com/go-gitea/gitea/pull/32565#issue-2672568872).

Add a border to the Avatar to avoid poor visual experiences caused by irregularly sized images.

before: image

after: image

lunny commented 2 days ago

The new design looks a bit off—there are two overlapping borders.

wxiaoguang commented 2 days ago

To be honest, the border is more ugly than before

kerwin612 commented 2 days ago

To be honest, the border is more ugly than before

This is indeed a matter of "choice". No matter how one chooses, there will always be some who find it suitable and some who don't. This is quite normal, and I fully understand it.

Currently:
1732090781438

After adding the border: 1732090730917 (issues such as border style can be adjusted additionally)

I think we should first make a choice and confirm whether we need borders.
If it's confirmed that borders are needed, I will continue to improve this PR. If not, I will close this PR.

@lunny @wxiaoguang

wxiaoguang commented 1 day ago

I think we should first make a choice and confirm whether we need borders. If it's confirmed that borders are needed, I will continue to improve this PR. If not, I will close this PR.

I would say no to current state, these screenshots look more ugly.

![image](https://github.com/user-attachments/assets/74354ba4-3323-4a6e-ade0-ab017cff8765) ![image](https://github.com/user-attachments/assets/3ff5d4e5-a4e9-40da-bed6-df875ad6bade)
lunny commented 1 day ago

Maybe we can use a circle with border which is how Github did. profile small image

participants image

profile big image

silverwind commented 1 day ago

I personally dislike both circling and border, with circling being the more severe of the two. If there is a border, there should also be a subtle background change. And it wouldn't fit in all places, like on the user page where it looks strange imho with the double border.

When GitHub introduced the circles around 2 years ago, they visually broke a lot of avatars where essential parts of the avatar were cut off. So it's a somewhat breaking change too.