From 78703ab370ba829faad2269b76725d1b6001226b Mon Sep 17 00:00:00 2001 From: Ezekiel Aquino Date: Mon, 3 Dec 2018 10:54:48 +0100 Subject: Some comments and cleanup --- packages/website/ts/@next/components/container.tsx | 30 ---------------------- packages/website/ts/@next/components/logo.tsx | 2 ++ packages/website/ts/@next/components/text.tsx | 3 +++ 3 files changed, 5 insertions(+), 30 deletions(-) delete mode 100644 packages/website/ts/@next/components/container.tsx diff --git a/packages/website/ts/@next/components/container.tsx b/packages/website/ts/@next/components/container.tsx deleted file mode 100644 index 58aaa8be9..000000000 --- a/packages/website/ts/@next/components/container.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import * as React from 'react'; -import styled from 'styled-components'; - -interface ContainerProps { - bgColor?: string; - removePadding?: boolean; -} - - -// are we still using this component? (i think not, so we should delete, but have notes) -// Also, i dont understand why create a styled comp and then make a stateless component that returns the same thing? -// should be enough to just export a styled component as it is understood that it takes props and a child -const StyledContainer = styled.div` - background-color: ${props => props.bgColor || 'transparent'}; - max-width: 111.111111111rem; // 2000px - margin: 0 auto; - padding: 0 1.666666667rem; // 30px - - ${props => props.removePadding && `padding: 0;`} -`; - -export const Container: React.StatelessComponent = props => { - const { children } = props; - - return ( - - {children} - - ); -}; diff --git a/packages/website/ts/@next/components/logo.tsx b/packages/website/ts/@next/components/logo.tsx index eade90c68..0b98fcf9d 100644 --- a/packages/website/ts/@next/components/logo.tsx +++ b/packages/website/ts/@next/components/logo.tsx @@ -10,6 +10,8 @@ interface LogoInterface { // Note let's refactor this +// is it absolutely necessary to have a stateless component +// to pass props down into the styled icon? const StyledLogo = styled.div` text-align: left; `; diff --git a/packages/website/ts/@next/components/text.tsx b/packages/website/ts/@next/components/text.tsx index 9e16c9411..4bc21f0fc 100644 --- a/packages/website/ts/@next/components/text.tsx +++ b/packages/website/ts/@next/components/text.tsx @@ -64,6 +64,9 @@ export const Heading: React.StatelessComponent = props => { }; // No need to declare it twice as Styled then rewrap as a stateless comp +// Note: this would be useful to be implemented the same way was "Heading" +// and be more generic. e.g. with a props asElement so we can use it +// for literally anything = export const Paragraph = styled.p` font-size: ${props => PARAGRAPH_SIZES[props.size || 'default']}; margin-bottom: ${props => !props.noMargin && '30px'}; -- cgit v1.2.3