Tricks on slideToggle

Level 3

@sinnbeck i've tried on react-slide-toggle , but still no luck on my own css . i've tried on second example on docs which is https://github.com/kunukn/react-slide-toggle#component-example-simple---function-as-child

this is exampe output that i want . when user click on their name, slide will appear for account settings and etc

https://imgur.com/alwp7hB

<div className="user-account">
                                    <div className="user-info">
                                        <img src="images/resources/user.png" alt=""/>
                                        <a href="#" title="">John</a>
                                        <i className="la la-sort-down"></i>
                                    </div>
                                    <SlideToggle>
                                        {({ toggle, setCollapsibleElement }) => (
                                            <div className="my-collapsible">
                                            <button className="my-collapsible__toggle" onClick={toggle}>
                                                toggle
                                            </button>
                                            <div className="my-collapsible__content" ref={setCollapsibleElement}>
                                                <div className="my-collapsible__content-inner">
                                                    <div className="user-account-settingss" id="users">
                                                        <h3>Setting</h3>
                                                        <ul className="us-links">
                                                            <li><a href="profile-account-setting.html" title="">Account Setting</a></li>
                                                            <li><a href="#" title="">Privacy</a></li>
                                                            <li><a href="#" title="">Faqs</a></li>
                                                            <li><a href="#" title="">Terms & Conditions</a></li>
                                                        </ul>
                                                        <h3 className="tc"><a href="" onClick={this.handleLogout} title="">Logout</a></h3>
                                                    </div>
                                                </div>
                                            </div>
                                            </div>
                                        )}
                                    </SlideToggle>
                                </div>

sorry for messy indentation , take a look on this pastebin

https://pastebin.com/XXwbB103