Is there a way I can replace the checkbox with button for the selection of the row in the grid?

Blazor DataGrid Demos - CheckBox Only Selection | Telerik UI for Blazor

Hi,

I am using the TelerikMenu Blazor component and I am trying to change the background color of the submenu items when being hovered over.  I can successfully change the hover colors for the top-level menus but not the submenus.  When I am running the app, I can go into developer tools and write the css to change the submenu background when being hovered over, but when I try that same css in my page css file, only the top-level menu items are affected (meaning the hover affect only happens to the top-level menu),  I have attached a picture of the submenu with a background color change on hover via Developer Tools.

I am probably missing a hierarchy level in the css - any assistance is appreciated.

Thanks,

Mike

Menu creation tag:

<nav class="navbar navbar-dark navbar py-md-0" id="navbar-custom-style"> 
    <span class=" k-link  k-menu-link">
        <TelerikMenu Data="MenuItems" UrlField="@nameof(MenuItem.Page)" Orientation="MenuOrientation.Horizontal" Class="centered-menu">

        </TelerikMenu>

   </span>
</nav>

Menu creation code:

  public List<MenuItem> MenuItems { get; set; }

        protected override async Task OnInitializedAsync()
        {
            List<MenuItem> menuItems = new List<MenuItem>()
            {
                new MenuItem { Text = "Home", Page = "/", IconClass="oi oi-home" },
                new MenuItem { Text = "Application Health", Items = new List<MenuItem>()
                    {
                        new MenuItem { Text = "Counter", Page = "/counter" },
                        new MenuItem { Text = "Batch Review", Page = "/batchreview", IconClass="oi oi-bar-chart" },
                        new MenuItem { Text = "Closed Items", Page = "" },
                    }, IconClass="oi oi-heart" },
                new MenuItem { Text = "Fetch Data", Page = "/fetchdata", IconClass="oi oi-rich" },
            };
            MenuItems = menuItems;
        }          

Menu CSS (only affects top level menus):

::deep .centered-menu.k-menu .k-item {
    color: white;
    font-weight: bold;
    background: #007DBC;
    padding: 0;
}

::deep .k-item.k-menu-item:hover {
    color: whitesmoke;
    background-color: #0b6fa4;
}

When I add this to my page css from the dev tools (which only affected the sub-menus), only the top menu items are affected:

I have a Vertical Splitter pane that will not resize until I first collapse it and then expand it.  

I am getting an error in the browser when I first try to re-size it.

telerik-blazor.js:63 Uncaught TypeError: Cannot read properties of undefined (reading 'min')
    at e.value (telerik-blazor.js:63)
    at e.value (telerik-blazor.js:63)
    at e.value (telerik-blazor.js:63)
    at e.value (telerik-blazor.js:63)
    at Object.i.onResizableResize [as resize] (telerik-blazor.js:63)
    at e.value (telerik-blazor.js:1)
    at e.value (telerik-blazor.js:49)
    at Object.i.onDraggableDrag [as drag] (telerik-blazor.js:49)
    at e.value (telerik-blazor.js:1)
    at e.value (telerik-blazor.js:3)

Here is the markup of the Splitter:

 <TelerikSplitter Orientation="SplitterOrientation.Vertical" Height="100%" Class="accountWorkscopeSplitter">
                <SplitterPanes>
                    <SplitterPane Class="scrollablePane">
                        <LeftNav WorkspaceId="@WorkspaceId.Value" NavigationWorkspace="Account" OnNavItemSelected="NavItemSelected" />
                    </SplitterPane>
                    @if (showExpenditureCenter || showRevenueCenter)
                    {
                        <SplitterPane Collapsible="true" Resizable="true" Size="50%" Max="50%" Class="scrollablePane">
                            @if (showExpenditureCenter)
                            {
                                <div id="ExpenditureCenterDiv">
                                    <AccountCenter Type="AccountType.Expenditures"></AccountCenter>
                                </div>
                            }
                            @if (showRevenueCenter)
                            {
                                <div id="RevenueCenterDiv">
                                    <AccountCenter Type="AccountType.Revenues"></AccountCenter>
                                </div>
                            }
                        </SplitterPane>
                    }
                </SplitterPanes>
            </TelerikSplitter>

Hello, I've just started using the TelerikMultiSelect for the first time and it's working well, except I can't change the font size of the list of selected items. I've applied Class="MyStyle" which defines a font-size value, but it has no effect. The attached image shows the selected items with font-size 14px that I can't override and they are smaller than the surrounding elements.

Inspecting the source I can see a nest of k-xxx styles which I tried overriding as an experiment, but nothing has any effect.

Thanks, Greg

Hi,

While developing my app, I have a grid and I'd like to run the TelerikLoader while loading page or data...

I follow the example (I.E: https://demos.telerik.com/blazor-ui/grid/loading-animation)

but when I add the code, the VS2002 compiler says:

"The name 'ThemeConstants' does not exist in the current context "

I try to add the full namespace: Telerik.Blazor.ThemeConstants and it's still the same....

does anyone has a clue.

How can I set the start value on the Y axis? The max value always look right