In the example below, the home icon is displayed correctly but the two with underscores are not. Moving the span outside the drawer does display correctly.
<TelerikRootComponent>
<TelerikDrawer Data="@NavigablePages"
@bind-Expanded="@DrawerExpanded"
MiniMode="true"
Mode="@DrawerMode.Push"
@ref="@DrawerRef"
@bind-SelectedItem="@SelectedItem">
<Template>
<div class="k-drawer-items">
<ul>
<li class="k-drawer-item" style="white-space:nowrap">
<span class="k-icon material-icons" style="margin-right: 8px;">home</span>
@if (DrawerExpanded)
{
<span class="k-item-text">Home</span>
}
</li>
<li class="k-drawer-item" style="white-space:nowrap">
<span class="k-icon material-icons" style="margin-right: 8px;">shopping_cart</span>
@if (DrawerExpanded)
{
<span class="k-item-text">Shopping Cart</span>
}
</li>
<li class="k-drawer-item" style="white-space:nowrap">
<span class="k-icon material-icons" style="margin-right: 8px;">content_paste_search</span>
@if (DrawerExpanded)
{
<span class="k-item-text">Clipboard</span>
}
</li>
</ul>
</div>
</Template>
<DrawerContent>
<div class="content px-4">
@Body
</div>
</div>
</DrawerContent>
</TelerikDrawer>
</TelerikRootComponent>