Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2024-11-22 08:36:33 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix sticky on Edge + IE11

Browse Source
This commit is contained in:
Roman Hotsiy 2017-11-20 12:05:54 +02:00
parent c17178f28f
commit 6d7fd547b1
No known key found for this signature in database
GPG Key ID: 5CB7B3ACABA57CB0
3 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
e2e/standalone.e2e.ts
View File

@ -11,7 +11,7 @@ describe('Standalone bundle test', function() {
cy
.visit('e2e/standalone.html')
.get('.menu-content li')
.click({ multiple: true });
.click({ multiple: true, force: true });
});
});
@ -27,7 +27,7 @@ describe('Standalone bundle test', function() {
cy
.visit('e2e/standalone.html')
.get('.menu-content li')
.click({ multiple: true });
.click({ multiple: true, force: true });
});
});
});

8
src/components/Redoc/Redoc.tsx
View File

@ -19,17 +19,17 @@ export interface RedocProps {
};
}
const stickyfill = Stickyfill();
export class Redoc extends React.Component<RedocProps> {
stickyfill = Stickyfill();
stickyElement: Element;
componentDidMount() {
this.props.store.menu.updateOnHash();
this.stickyfill.add(this.stickyElement);
stickyfill.add(this.stickyElement);
}
componentWillUnmount() {
this.stickyfill.remove(this.stickyElement);
stickyfill.remove(this.stickyElement);
}
render() {
@ -39,7 +39,7 @@ export class Redoc extends React.Component<RedocProps> {
<RedocWrap className="redoc-wrap">
<StickySidebar
className="menu-content"
ref={el => {
innerRef={el => {
this.stickyElement = el;
}}
>

5
src/components/Redoc/elements.tsx
View File

@ -34,7 +34,7 @@ export const RedocWrap = styled.div`
`;
export const StickySidebar = styled.div`
min-width: ${props => props.theme.menu.width};
width: ${props => props.theme.menu.width};
background-color: ${props => props.theme.menu.backgroundColor};
overflow: hidden;
display: flex;
@ -42,7 +42,7 @@ export const StickySidebar = styled.div`
transform: translateZ(0);
max-height: 100vh;
height: 100vh;
position: sticky;
position: -webkit-sticky;
top: 0;
@ -51,4 +51,5 @@ export const StickySidebar = styled.div`
export const ApiContent = styled.div`
z-index: 10;
position: relative;
width: calc(100% - ${props => props.theme.menu.width});
`;