diff options
Diffstat (limited to 'packages/website/ts/@next')
-rw-r--r-- | packages/website/ts/@next/components/container.tsx | 30 | ||||
-rw-r--r-- | packages/website/ts/@next/components/logo.tsx | 2 | ||||
-rw-r--r-- | packages/website/ts/@next/components/text.tsx | 3 |
3 files changed, 5 insertions, 30 deletions
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<ContainerProps>` - 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<ContainerProps> = props => { - const { children } = props; - - return ( - <StyledContainer {...props}> - {children} - </StyledContainer> - ); -}; 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<HeadingProps> = 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. <Text /> with a props asElement so we can use it +// for literally anything = export const Paragraph = styled.p<ParagraphProps>` font-size: ${props => PARAGRAPH_SIZES[props.size || 'default']}; margin-bottom: ${props => !props.noMargin && '30px'}; |