diff options
author | Fabio Berger <me@fabioberger.com> | 2018-03-07 17:50:51 +0800 |
---|---|---|
committer | Fabio Berger <me@fabioberger.com> | 2018-03-07 17:50:51 +0800 |
commit | f191ba6e6990fec3f973ee78f75547e5a828785a (patch) | |
tree | f786f9eddd06022a415e55c23d2617944dca4179 /packages/react-docs/src/ts/components/documentation.tsx | |
parent | a2b89411b05fa6f2e721a49b7f90f46fad12d20b (diff) | |
download | dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.tar dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.tar.gz dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.tar.bz2 dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.tar.lz dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.tar.xz dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.tar.zst dexon-0x-contracts-f191ba6e6990fec3f973ee78f75547e5a828785a.zip |
hide sidebar scrollbar unless onHover
Diffstat (limited to 'packages/react-docs/src/ts/components/documentation.tsx')
-rw-r--r-- | packages/react-docs/src/ts/components/documentation.tsx | 23 |
1 files changed, 22 insertions, 1 deletions
diff --git a/packages/react-docs/src/ts/components/documentation.tsx b/packages/react-docs/src/ts/components/documentation.tsx index 8db9b34b4..58523a1a9 100644 --- a/packages/react-docs/src/ts/components/documentation.tsx +++ b/packages/react-docs/src/ts/components/documentation.tsx @@ -54,12 +54,20 @@ export interface DocumentationProps { topBarHeight?: number; } -export interface DocumentationState {} +export interface DocumentationState { + isHoveringSidebar: boolean; +} export class Documentation extends React.Component<DocumentationProps, DocumentationState> { public static defaultProps: Partial<DocumentationProps> = { topBarHeight: 0, }; + constructor(props: DocumentationProps) { + super(props); + this.state = { + isHoveringSidebar: false, + }; + } public componentDidUpdate(prevProps: DocumentationProps, prevState: DocumentationState) { if (!_.isEqual(prevProps.docAgnosticFormat, this.props.docAgnosticFormat)) { const hash = window.location.hash.slice(1); @@ -106,7 +114,10 @@ export class Documentation extends React.Component<DocumentationProps, Documenta ...styles.menuContainer, ...styles.mainContainers, height: `calc(100vh - ${this.props.topBarHeight}px)`, + overflow: this.state.isHoveringSidebar ? 'auto' : 'hidden', }} + onMouseEnter={this._onSidebarHover.bind(this)} + onMouseLeave={this._onSidebarHoverOff.bind(this)} > <NestedSidebarMenu selectedVersion={this.props.selectedVersion} @@ -338,4 +349,14 @@ export class Documentation extends React.Component<DocumentationProps, Documenta /> ); } + private _onSidebarHover(event: React.FormEvent<HTMLInputElement>) { + this.setState({ + isHoveringSidebar: true, + }); + } + private _onSidebarHoverOff() { + this.setState({ + isHoveringSidebar: false, + }); + } } |