Skip to content

Instantly share code, notes, and snippets.

@daino3
Created September 27, 2019 15:33
Show Gist options
  • Save daino3/d7764634e5bd0e66c6a14b99cb861fa5 to your computer and use it in GitHub Desktop.
Save daino3/d7764634e5bd0e66c6a14b99cb861fa5 to your computer and use it in GitHub Desktop.
class Sidebar extends React.Component {
// this class will be responsible
// for positioning, styles, animations, etc.
// and that's about it...
render() {
const {
isOpen,
children,
} = this.props
return (
<div className="some-global-sidebar-class ${isOpen ? '--expanded' : '--closed'}">
{children}
<div>
);
}
}
import Sidebar from 'shared/sidebar'
class MyChildComponent extends React.Component {
render() {
return (
<Sidebar isOpen={true}>
<div>
My Custom Content that fits the
constraints provided by <Sidebar/>
</div>
<Sidebar/>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment