How to change background color of Tree

[VMahipalReddy]

I would like to change the background color of the Tree. Can I set a different color instead of black? Thanks.

[VMahipalReddy]

Seems, a similar issue has already been created, but the solution is not available.

[maximilianoforlenza]

do you try change style?

Treebeard.defaultProps = {
    style: {
            tree: {
                base: {
                    listStyle: 'none',
                    backgroundColor: 'red',
                    margin: 0,
                    padding: 0,
                    color: '#9DA5AB',
                    fontFamily: 'lucida grande ,tahoma,verdana,arial,sans-serif',
                    fontSize: '14px'
                },
                node: {
                    base: {
                        position: 'relative'
                    },
                    link: {
                        cursor: 'pointer',
                        position: 'relative',
                        padding: '0px 5px',
                        display: 'block'
                    },
                    activeLink: {
                        background: '#31363F'
                    },
                    toggle: {
                        base: {
                            position: 'relative',
                            display: 'inline-block',
                            verticalAlign: 'top',
                            marginLeft: '-5px',
                            height: '24px',
                            width: '24px'
                        },
                        wrapper: {
                            position: 'absolute',
                            top: '50%',
                            left: '50%',
                            margin: '-7px 0 0 -7px',
                            height: '14px'
                        },
                        height: 14,
                        width: 14,
                        arrow: {
                            fill: '#9DA5AB',
                            strokeWidth: 0
                        }
                    },
                    header: {
                        base: {
                            display: 'inline-block',
                            verticalAlign: 'top',
                            color: '#9DA5AB'
                        },
                        connector: {
                            width: '2px',
                            height: '12px',
                            borderLeft: 'solid 2px black',
                            borderBottom: 'solid 2px black',
                            position: 'absolute',
                            top: '0px',
                            left: '-21px'
                        },
                        title: {
                            lineHeight: '24px',
                            verticalAlign: 'middle'
                        }
                    },
                    subtree: {
                        listStyle: 'none',
                        paddingLeft: '19px'
                    },
                    loading: {
                        color: '#E2C089'
                    }
                }
            }
    }
<Treebeard style={this.props.style}/>

Here fix this - support multiple styles #171
@VMahipalReddy

[VMahipalReddy]

Thanks a lot @maximilianoforlenza . It works 👍

[jzombie]

The documentation should be more clear when it says "Defaults to src/themes/default."

I thought, at first glance, this was a CSS file, and that this parameter must be accepting string values because it kept giving me bizarre errors when I tried to just apply styling.

[maximilianoforlenza]

@jzombie Would you like to send a PR?