The React AppBar component serves as the main navigation of your application, containing navigation elements and the title of the application or current page. It allows you to add several action buttons and change available action items to ensure the perfect fit in your application. Enjoy a plethora of customization options when adding this React UI component to your applications.
Changing the position of the KendoReact AppBar component is as easy as changing a single configuration option. The AppBar can be positioned either at the top or bottom of any React application.
The KendoReact AppBar component does not come with a predefined layout. Instead, it offers React developers full flexibility to define the items and the order in which they should appear in the React AppBar component. To assist with arranging the content of the React AppBar, there are several layout components like the Section, Spacing and Separator, which can be used to make the KendoReact AppBar fit any design.
Beyond the three available out-of-the-box themes for KendoReact, the Default, Material, Fluent and Bootstrap themes, the React AppBar component has additional settings to help customize its appearance. These include light, dark and inherit options for the existing theme colors, which can be set through a single configuration option, or customization through CSS styles.
The KendoReact AppBar component can adhere to any responsive design rules provided by the React application. This includes support for common responsive design tactics like using CSS media queries to customize what should be displayed and when as the React AppBar component is being resized.