1 files changed, 0 insertions, 144 deletions
diff --git a/packages/website/ts/components/banner.tsx b/packages/website/ts/components/banner.tsx
deleted file mode 100644
index ce3fd499a..000000000
--- a/packages/website/ts/components/banner.tsx
+++ /dev/null
@@ -1,144 +0,0 @@
-import * as React from 'react';
-import styled from 'styled-components';
-
-import { colors } from 'ts/style/colors';
-
-import { Button } from 'ts/components/button';
-import { ThemeInterface } from 'ts/components/siteWrap';
-import { Paragraph } from 'ts/components/text';
-
-import { Column, Section } from 'ts/components/newLayout';
-
-interface Props {
-    heading?: string;
-    subline?: string;
-    mainCta?: CTAButton;
-    secondaryCta?: CTAButton;
-    theme?: ThemeInterface;
-}
-
-interface CTAButton {
-    text: string;
-    href?: string;
-    onClick?: () => void;
-    shouldOpenInNewTab?: boolean;
-}
-
-interface BorderProps {
-    isBottom?: boolean;
-}
-
-export const Banner: React.StatelessComponent<Props> = (props: Props) => {
-    const { heading, subline, mainCta, secondaryCta } = props;
-    return (
-        <CustomSection bgColor={colors.brandDark} isFlex={true} flexBreakpoint="900px" paddingMobile="120px 0">
-            <Border />
-            <Border isBottom={true} />
-
-            <Column>
-                <CustomHeading>{heading}</CustomHeading>
-
-                {subline && (
-                    <Paragraph color={colors.white} isMuted={0.5} isNoMargin={true}>
-                        {subline}
-                    </Paragraph>
-                )}
-            </Column>
-            <Column>
-                <ButtonWrap>
-                    {mainCta && (
-                        <Button
-                            color={colors.white}
-                            isTransparent={false}
-                            href={mainCta.href}
-                            target={mainCta.shouldOpenInNewTab ? '_blank' : ''}
-                        >
-                            {mainCta.text}
-                        </Button>
-                    )}
-
-                    {secondaryCta && (
-                        <Button
-                            color={colors.white}
-                            href={secondaryCta.href}
-                            onClick={secondaryCta.onClick}
-                            isTransparent={true}
-                        >
-                            {secondaryCta.text}
-                        </Button>
-                    )}
-                </ButtonWrap>
-            </Column>
-        </CustomSection>
-    );
-};
-
-const CustomSection = styled(Section)`
-    color: ${colors.white};
-    margin-top: 30px;
-
-    @media (max-width: 900px) {
-        text-align: center;
-
-        p {
-            margin-bottom: 30px;
-        }
-
-        div:last-child {
-            margin-bottom: 0;
-        }
-    }
-`;
-
-const CustomHeading = styled.h2`
-    font-size: 34px;
-    font-weight: 400;
-    margin-bottom: 10px @media (max-width: 768px) {
-        font-size: 30px;
-    }
-`;
-
-const ButtonWrap = styled.div`
-    display: inline-block;
-
-    @media (min-width: 768px) {
-        * + * {
-            margin-left: 15px;
-        }
-    }
-
-    @media (max-width: 768px) {
-        a,
-        button {
-            display: block;
-            width: 220px;
-        }
-
-        * + * {
-            margin-top: 15px;
-        }
-    }
-`;
-
-// Note let's refactor this
-// is it absolutely necessary to have a stateless component
-// to pass props down into the styled icon?
-const Border = styled.div<BorderProps>`
-    position: absolute;
-    background-image: ${props =>
-        props.isBottom ? 'url(/images/banner/bottomofcta.png);' : 'url(/images/banner/topofcta.png);'};
-    background-position: ${props => (props.isBottom ? 'left top' : 'left bottom')};
-    left: 0;
-    width: calc(100% + 214px);
-    height: 40px;
-    top: ${props => !props.isBottom && 0};
-    bottom: ${props => props.isBottom && 0};
-    transform: translate(-112px);
-
-    @media (max-width: 768px) {
-        width: calc(100% + 82px);
-        height: 40px;
-        transform: translate(-41px);
-        background-size: auto 80px;
-    }
-`;