New to Telerik UI for ASP.NET Core? Download free 30-day trial

Appearance

The Telerik BottomNavigation TagHelper for ASP.NET Core allows you to alter the appearance of the component by setting its item-flow, theme-color, border, shadow and fill options.

The example below demonstrates how to modify the appearance by using the above settings:

    @addTagHelper *, Kendo.Mvc
    @{
        var home = new { view= "home"};
        var calendar = new { view = "calendar" };
        var profile = new { view = "profile" };
    }  
    <kendo-bottomnavigation
            name="bottomNavigation"
            position-mode="BottomNavigationPositionMode.Absolute"
            item-flow="BottomNavigationItemFlow.Horizontal"
            theme-color="BottomNavigationThemeColor.Secondary"
            fill="BottomNavigationFill.Solid"
            border="false"
            shadow="true">
        <bottomnavigation-items>
            <bottomnavigation-item context-data="@home" text="Home" icon="home" selected="true"></bottomnavigation-item>
            <bottomnavigation-item context-data="@calendar" text="Calendar" icon="calendar"></bottomnavigation-item>
            <bottomnavigation-item context-data="@profile" text="Profile" icon="user"></bottomnavigation-item>
        </bottomnavigation-items>
    </kendo-bottomnavigation>

See Also

In this article
Not finding the help you need? Improve this article