Change side bar color and fix side bar 100% height

[pavvvan]

No description provided.

[pedrohba1]

Changing the color is simple:

import SideNav from "@trendmicro/react-sidenav";

const StyledSideNav = styled(SideNav)`
    background-color: #0057c3;
`;

The bar out-of-the-box works for 100% height for me, do you have a picture to show what you mean?

[pedrohba1]

I actually found out your problem, of the 100% height. try adding this inside you SideNav component:

   style={{
                        position: "fixed",
                    }}

this will fix the navbar to the right, and then the user can scrooll the page and it will always show it in same place. It is no 100% height but it works for desktop at least

[moezlaarif]

Changing the color is simple:

import SideNav from "@trendmicro/react-sidenav";

const StyledSideNav = styled(SideNav)`
    background-color: #0057c3;
`;

The bar out-of-the-box works for 100% height for me, do you have a picture to show what you mean?

`render() {

const { expanded} = this.state;

const StyledSideNav = styled(SideNav)`
background-color: #808080;

`;

return (

(

        <SideNav StyledSideNav={StyledSideNav}

`
Should it bi like this ? it didn't wordk for me ?

[christrt9]

I also cannot change the background. Do you find the solution?
version: react-sidenav: "^4.0.6"