In this section we are going to learn how to change the horizontal navigation style.

Changing the reducer file Settings.js

In this method, open the Settings.js file which you can find inside the src/appRedux/reducers/ folder.

Here in this file, you will find a initialSettings constant object

     
const initialSettings = {
    ....
  navStyle: NAV_STYLE_FIXED,
    ...
};
  

The Horizontal Nav Style property could have one of five values given below:

1. NAV_STYLE_DEFAULT_HORIZONTAL
   To set Horizontal default style
2. NAV_STYLE_DARK_HORIZONTAL
   To set Horizontal dark style
3. NAV_STYLE_INSIDE_HEADER_HORIZONTAL
   To set Horizontal inside Header style
4. NAV_STYLE_BELOW_HEADER
   To set Horizontal below Header style
5. NAV_STYLE_ABOVE_HEADER
   To set Horizontal above Header style

That is all you need to do to achieve the desired horizontal navigation style.