Feat: Uniform avatar appearance in space/room navigation

[wolterkam]

Introduces a new appearance setting turning room avatar icons more consistent, reducing the visual noise caused by mismatched shapes and styles.

Problem

In the left sidebar navigation between spaces and rooms, some avatar tiles filled their button area while others appeared as small icons or irregular transparent shapes. There is no canon style to how these avatars appear, so visual variety is expected, but the stark differences in how avatars occupied their space made the sidebar feel inconsistent with the rest of the design language.

Solution

Avatar icons can now fill their background with the dominant color of the icon itself, harmonizing the appearance of otherwise mismatched tiles. This can be toggled via Consistent Icon Style in Appearance settings. I've shipped it disabled by default, but happy to change that if there's a preference either way.

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings

[7w1]

You need to add crossOrigin="anonymous" into the FoldsAvatarImage in AvatarImage.tsx or this will immediately crash all Firefox based browsers for whatever reason.

[wolterkam]

You need to add crossOrigin="anonymous" into the FoldsAvatarImage in AvatarImage.tsx or this will immediately crash all Firefox based browsers for whatever reason.

Thank you, I've implemented a fix. In short: Firefox blocks pixel access from cross-origin sources by default, but that restriction doesn't make sense for our use case, so the recommended workaround is safe here.

[kfiven]

I feel this is too much of control on user input. I can see down the road people complaining where does the background of their images came from.

[wolterkam]

I feel this is too much of control on user input. I can see down the road people complaining where does the background of their images came from.

Hmm... Operating systems from across the board have been doing this for years without much backlash.

It's a setting, off by default, builds off the existing design, and addresses a blind spot.

The same visual component is a delineated rounded rectangle in every other case:

• Action button
• Rectangular avatar image
• Auto-created "initials" buttons

My goal was to conform the outlier to a design decision that is already established and uncontroversial.

[kfiven]

I am all in for streamlined UI but I think we should only do that on UI component and User Input such as background should not be done. Also I think one of our core philosophy is to only have necessary settings which keeps the app including settings simple.