From 31d07fdac80a2a546646b1eb232fa7dd6319ce83 Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Mon, 19 Nov 2018 17:27:00 +0100
Subject: rename all files and directories to lowercase

---
 packages/dev-tools-pages/ts/components/footer.tsx | 132 ++++++++++++++++++++++
 1 file changed, 132 insertions(+)
 create mode 100644 packages/dev-tools-pages/ts/components/footer.tsx

(limited to 'packages/dev-tools-pages/ts/components/footer.tsx')

diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx
new file mode 100644
index 000000000..a278fdfee
--- /dev/null
+++ b/packages/dev-tools-pages/ts/components/footer.tsx
@@ -0,0 +1,132 @@
+import * as React from 'react';
+import styled from 'styled-components';
+
+import { context as compiler } from 'ts/context/compiler';
+import { context as cov } from 'ts/context/cov';
+import { context as profiler } from 'ts/context/profiler';
+import { context as trace } from 'ts/context/trace';
+import MainIcon from 'ts/icons/logos/0x.svg';
+import { media } from 'ts/variables';
+
+import { Container } from './Container';
+import { Alpha, Beta } from './Typography';
+
+const tools = [trace, cov, compiler, profiler];
+
+const Footer: React.StatelessComponent<{}> = () => (
+    <StyledFooter>
+        <Container>
+            <Top>
+                <Alpha>Other tools by 0x</Alpha>
+                <List>
+                    {tools.map(({ title, subtitle, icon }) => (
+                        <ListItem key={title}>
+                            <ListLink href="#">
+                                <Icon as={icon} />
+                                <div>
+                                    <Beta>{title}</Beta>
+                                    <p>{subtitle}</p>
+                                </div>
+                            </ListLink>
+                        </ListItem>
+                    ))}
+                </List>
+            </Top>
+            <Media as="aside">
+                <Icon as={MainIcon} />
+                <Small>
+                    0x is an open, permissionless protocol allowing for tokens to be traded on the Ethereum blockchain.
+                </Small>
+            </Media>
+        </Container>
+    </StyledFooter>
+);
+
+const StyledFooter = styled.footer`
+    background-color: ${props => props.theme.colors.secondary};
+    padding-top: 6.25rem;
+    padding-bottom: 5.4375rem;
+
+    ${media.small`padding-top: 2.5rem;`};
+`;
+
+const Top = styled.div`
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 9.375rem;
+
+    ${media.medium`
+        display: block;
+        margin-bottom: 5.3125rem;
+    `};
+
+    ${Alpha} {
+        ${media.medium`margin-bottom: 3.8125rem;`};
+    }
+`;
+
+const Icon = styled.div`
+    margin-right: 1.3125rem;
+    flex-shrink: 0;
+    ${media.small`margin-right: 0.9375rem`};
+`;
+
+const Media = styled.div`
+    display: flex;
+    align-items: center;
+
+    ${Icon} {
+        margin-top: 0.5rem;
+        align-self: flex-start;
+    }
+`;
+
+const List = styled.ul`
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    width: 66.693548387%;
+    display: flex;
+    flex-wrap: wrap;
+
+    ${media.medium`
+        width: 100%;
+    `};
+
+    ${media.small`
+        display: block;
+    `};
+`;
+
+const ListItem = styled.li`
+    margin-bottom: 3.3125rem;
+    padding-right: 1rem;
+    flex-basis: 50%;
+    :nth-last-of-type(-n + 2) {
+        margin-bottom: 0;
+
+        ${media.small`margin-bottom: 1.875rem`};
+    }
+
+    ${media.small`
+        margin-bottom: 1.875rem
+        :last-of-type {
+            margin-bottom: 0;
+        }
+    `};
+`;
+
+const ListLink = styled.a`
+    display: flex;
+    align-items: center;
+    :hover {
+        color: ${props => props.theme.colors.dark};
+    }
+`;
+
+const Small = styled.small`
+    font-size: 1em;
+    max-width: 37.5rem;
+`;
+
+export { Footer };
-- 
cgit v1.2.3


From 117726c6d80dd20e8b9409cec23b0c062690b0df Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Mon, 19 Nov 2018 17:35:22 +0100
Subject: fix imports after renaming

---
 packages/dev-tools-pages/ts/components/footer.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'packages/dev-tools-pages/ts/components/footer.tsx')

diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx
index a278fdfee..110d21443 100644
--- a/packages/dev-tools-pages/ts/components/footer.tsx
+++ b/packages/dev-tools-pages/ts/components/footer.tsx
@@ -8,8 +8,8 @@ import { context as trace } from 'ts/context/trace';
 import MainIcon from 'ts/icons/logos/0x.svg';
 import { media } from 'ts/variables';
 
-import { Container } from './Container';
-import { Alpha, Beta } from './Typography';
+import { Container } from './container';
+import { Alpha, Beta } from './typography';
 
 const tools = [trace, cov, compiler, profiler];
 
-- 
cgit v1.2.3


From b0c22a222e09ef8008a1ef7cf79e28b73961560a Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Tue, 20 Nov 2018 15:15:17 +0100
Subject: use lodash.map insted of array.map

---
 packages/dev-tools-pages/ts/components/footer.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'packages/dev-tools-pages/ts/components/footer.tsx')

diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx
index 110d21443..4b911ce35 100644
--- a/packages/dev-tools-pages/ts/components/footer.tsx
+++ b/packages/dev-tools-pages/ts/components/footer.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import styled from 'styled-components';
+import * as _ from 'lodash';
 
 import { context as compiler } from 'ts/context/compiler';
 import { context as cov } from 'ts/context/cov';
@@ -19,7 +20,7 @@ const Footer: React.StatelessComponent<{}> = () => (
             <Top>
                 <Alpha>Other tools by 0x</Alpha>
                 <List>
-                    {tools.map(({ title, subtitle, icon }) => (
+                    {_.map(tools, ({ title, subtitle, icon }) => (
                         <ListItem key={title}>
                             <ListLink href="#">
                                 <Icon as={icon} />
-- 
cgit v1.2.3


From f360b2edd671f7f666b3d218c1400b2fb7c75610 Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Tue, 20 Nov 2018 15:27:56 +0100
Subject: fix import order

---
 packages/dev-tools-pages/ts/components/footer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/dev-tools-pages/ts/components/footer.tsx')

diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx
index 4b911ce35..e18a255e4 100644
--- a/packages/dev-tools-pages/ts/components/footer.tsx
+++ b/packages/dev-tools-pages/ts/components/footer.tsx
@@ -1,6 +1,6 @@
+import * as _ from 'lodash';
 import * as React from 'react';
 import styled from 'styled-components';
-import * as _ from 'lodash';
 
 import { context as compiler } from 'ts/context/compiler';
 import { context as cov } from 'ts/context/cov';
-- 
cgit v1.2.3


From ad0083dfa050d664fe298de5c5e18fae021ef597 Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Tue, 20 Nov 2018 15:30:49 +0100
Subject: fix type for svg icon in footer

---
 packages/dev-tools-pages/ts/components/footer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/dev-tools-pages/ts/components/footer.tsx')

diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx
index e18a255e4..04fd9b88e 100644
--- a/packages/dev-tools-pages/ts/components/footer.tsx
+++ b/packages/dev-tools-pages/ts/components/footer.tsx
@@ -23,7 +23,7 @@ const Footer: React.StatelessComponent<{}> = () => (
                     {_.map(tools, ({ title, subtitle, icon }) => (
                         <ListItem key={title}>
                             <ListLink href="#">
-                                <Icon as={icon} />
+                                <Icon as={icon as 'svg'} />
                                 <div>
                                     <Beta>{title}</Beta>
                                     <p>{subtitle}</p>
-- 
cgit v1.2.3