arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-25 00:18:07 +00:00
Code Issues Releases Wiki Activity

Fix background of "<aside/>" elemnt

Browse Source
This commit is contained in:
Vasek Mlejnsky 2018-08-27 09:12:19 +02:00
parent 4cd52f3ecf
commit f7b50bbb01
1 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/js/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js
View File

@ -7,6 +7,7 @@ import * as React from 'react';
import raf from 'raf'; import raf from 'raf';
import { getViewportHeight, getScrollY } from 'utils/windowUtils'; import { getViewportHeight, getScrollY } from 'utils/windowUtils';
import styled from 'styled-components'; import styled from 'styled-components';
import colors from 'config/colors';
type Props = { type Props = {
location: string, location: string,
@ -14,6 +15,15 @@ type Props = {
children?: React.Node, children?: React.Node,
} }
const AsideWrapper = styled.aside`
position: relative;
width: 320px;
min-width: 320px;
border-right: 1px solid ${colors.DIVIDER};
overflow-x: hidden;
background: ${colors.MAIN};
`;
const StickyContainerWrapper = styled.div` const StickyContainerWrapper = styled.div`
position: relative; position: relative;
top: 0; top: 0;
@ -137,8 +147,8 @@ export default class StickyContainer extends React.PureComponent<Props> {
render() { render() {
return ( return (
<aside <AsideWrapper
ref={(node) => { this.aside = node; }} innerRef={(node) => { this.aside = node; }}
onScroll={this.handleScroll} onScroll={this.handleScroll}
onTouchStart={this.handleScroll} onTouchStart={this.handleScroll}
onTouchMove={this.handleScroll} onTouchMove={this.handleScroll}
@ -149,7 +159,7 @@ export default class StickyContainer extends React.PureComponent<Props> {
> >
{this.props.children} {this.props.children}
</StickyContainerWrapper> </StickyContainerWrapper>
</aside> </AsideWrapper>
); );
} }
} }