feat(lsg): justify layout children

meetalva · Dec 6, 2017 · c8046fd · c8046fd
1 parent 51ac9ed
commit c8046fd
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/src/lsg/patterns/layout/demo.tsx b/src/lsg/patterns/layout/demo.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 import styled from 'styled-components';
 
 const StyledTestDiv = styled.div`
+	flex-grow: 1;
 	padding: 20px 10px;
 	background: ${colors.greenLight.toString()};
 
@@ -13,7 +14,7 @@ const StyledTestDiv = styled.div`
 `;
 
 const LayoutDemo: React.StatelessComponent<void> = (): JSX.Element => (
-	<Layout directionVertical={true}>
+	<div>
 		<Layout directionVertical={true}>
 			<StyledTestDiv>Vertical</StyledTestDiv>
 			<StyledTestDiv>Vertical</StyledTestDiv>
@@ -24,7 +25,7 @@ const LayoutDemo: React.StatelessComponent<void> = (): JSX.Element => (
 			<StyledTestDiv>Horizontal</StyledTestDiv>
 			<StyledTestDiv>Horizontal</StyledTestDiv>
 		</Layout>
-	</Layout>
+	</div>
 );
 
 export default LayoutDemo;
diff --git a/src/lsg/patterns/layout/index.tsx b/src/lsg/patterns/layout/index.tsx
@@ -8,6 +8,7 @@ export interface LayoutProps {
 
 const StyledLayout = styled.div`
 	display: flex;
+	justify-content: space-between;
 	${(props: LayoutProps) => props.directionVertical
 		? 'flex-direction: column;'
 		: ''