Blazor components "features"

Hey Radzen team,

Recently I started to learn Blazor and decided to try your Blazor components.

After checking out all demos on your webpage I started developing my application and faced several problems. In the beginning, I thought it was my fault, but after downloading the demo source code: I found out that your demo source code has the same troubles. Maybe you could explain them out.

Link 1: demo on your site:
Link 2: source code:


  1. Sidebar sliding smoothly in the demo on your site. In the source code of the demo, under Visual Studio - it's not.

  2. The profile menu disappears if clicked outside of the menu in the demo on your site. In the source code of the demo, under Visual Studio - it's not. It only disappears if the menu item clicked or gravatar clicked.

  3. Demo on your site - try to resize the window to the min(width). Profile menu text disappears and the only gravatar is visible. The height of the header is not changed. In the source code demo - profile menu text stays visible all the time and if the window size is minimum(width) - header height is doubled, Profile menu takes 2nd row in the header, and covers the sidebar menu under it.

  4. In the following demo demos.radzen.../dashboard the footer is the same width as the body itself(skipping the sidebar width on the left) - was not able to find how to achieve this in the code in Visual Studio

Hi @Ghostbob,

The demo is Angular based and not Blazor. It's source code is here:

Indeed there are subtle differences between Angular and Blazor mostly because the Blazor component are created from scratch while the Angular ones wrap PrimeNG.

Hi Atanas,

Are there any plans on fixing Blazor components, like:

  • profile menu outside click
  • resize problems with profile menu and header height

We will probably implement the profile menu closing on document click at some point. No deadline for that. You can expedite the implementation of this by purchasing a Radzen Professional subscription though.

Resize problems are resolved in the demo itself via some Bootstrap CSS classes set on the Label:

The classes are d-none d-lg-inline-block which means the Label is visible only on large displays.

1 Like

I also vote for implementing "profile menu closing on document click" :+1: