zecfoundation
/
zepio
mirror of https://github.com/ZcashFoundation/zepio.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feature: split Divider component

This commit is contained in:
George Lima 2018-12-20 11:10:03 -03:00
parent a8b2fadcae
commit 04ba5a3dc6
2 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/components/divider.js Normal file
View File

@ -0,0 +1,9 @@
// @flow
import styled from 'styled-components';
export const Divider = styled.div`
width: 100%;
height: 1px;
background-color: ${props => props.color || props.theme.colors.text};
opacity: ${props => props.opacity || 1};
`;

10
app/components/header.js
View File

@ -5,6 +5,7 @@ import styled from 'styled-components';
import { ZcashLogo } from './zcash-logo';
import { TextComponent } from './text';
import { Divider } from './divider';
const Wrapper = styled.div`
height: ${props => props.theme.headerHeight};
@ -44,13 +45,6 @@ const Title = styled(TextComponent)`
text-transform: capitalize;
`;
const Divider = styled.div`
width: 100%;
background-color: ${props => props.theme.colors.text};
height: 1px;
opacity: 0.1;
`;
type Props = {
title: string,
};
@ -62,7 +56,7 @@ export const HeaderComponent = ({ title }: Props) => (
</LogoWrapper>
<TitleWrapper>
<Title value={title} />
<Divider />
<Divider opacity={0.1} />
</TitleWrapper>
</Wrapper>
);