MudBlazor / MudBlazor

Blazor Component Library based on Material design with an emphasis on ease of use. Mainly written in C# with Javascript kept to a bare minimum it empowers .NET developers to easily debug it if needed.
http://mudblazor.com
MIT License
8.05k stars 1.28k forks source link

MudSelect and MudAutoComplete OpenIcon padding inconsistent #9550

Open maddog21z opened 3 months ago

maddog21z commented 3 months ago

Things to check

Bug type

Component

Component name

MudAutoComplete

What happened?

This is a minor stylistic issue. When you have both MudAutocomplete and MudSelect controls in a form and both controls are clearable the clear icons of the controls are not matching. The reason is that the Autocomplete OpenIcon has padding while the MudSelect does not. I am also using Margin:Dense and Dense:true

Expected behavior

they should be consistent.

Reproduction link

https://try.mudblazor.com/snippet/mEmykWklqZgXlRRS

Reproduction steps

  1. Just setup both mudselect and mudautocomplete one over the other
  2. clearable: true
  3. dense: true, margin:dense
  4. select a value for both

Relevant log output

No response

Version (bug)

7.5.0

Version (working)

No response

What browsers are you seeing the problem on?

Edge

On which operating systems are you experiencing the issue?

Windows

Pull Request

Code of Conduct

danielchalmers commented 3 months ago

Related #8878

maddog21z commented 3 months ago

@danielchalmers so will the padding be made consistent between the MudSelect and MudAutocomplete Adornments in an upcoming release?

image

danielchalmers commented 3 months ago

No ETA. As a workaround you can assign a handler to OnAdornmentClick to turn it into a larger button.

maddog21z commented 3 months ago

Just to clarify for anyone reading this thread. The OnAdornmentClick event does not need to be assigned.
Setting the IconSize="Size.Small" on the MudAutocomplete is enough to make it appear more consistent with the MudSelect. It's not a perfect solution but it is more aesthetically pleasing.

https://try.mudblazor.com/snippet/cumeaiaJSSRvyXUp