Radzen panel menu

Radzen.Blazor Components
1

Hi Guys

I've been driving myself insane trying to figure out how to remove the gradient effect when clicking a panel menu item.
I've been using the browser dev tools changing all the css but can't for the life of me find the relevant part has anyone got any ideas ?

Thanks

2

Hi @wizard123,

Are you referring to the ripple effect? It is enabled by default in the Material theme as required by specification. You can use a different theme if you don't want it.

3

Yes thanks the ripple effect when you click the button, is there no way to override it in material without changing theme ?

4

Not to worry i figured it out, thanks for your time.

5

@wizard123 How did you go about disabling the ripple effect? I would like to know. Thanks.

6

@wizard123 HOW??????????

7

There isn't a built-in way to disable the ripple effect but you can build your own material theme without it. Here is how.

  1. Clone the Radzen.Blazor github repository
  2. Open the Radzen.Blazor.csproj with Visual Studio.
  3. Edit material-base.scss and remove all CSS rules that contain rz-ripple e.g.
    .rz-button {
  @include rz-ripple($pseudo: true);
}
  4. Save material-base.scss and build the project.
  5. Copy wwwroot\css\material-base.css to your application and include it instead of _content/Radzen.Blazor/css/material-base.css
1 Like