aboutsummaryrefslogtreecommitdiffstats
path: root/packages/dev-tools-pages/ts/pages/Compiler.tsx
diff options
context:
space:
mode:
authorMegan Pearson <megan.e.pearson@gmail.com>2018-10-22 20:24:53 +0800
committerMegan Pearson <megan.e.pearson@gmail.com>2018-10-22 20:28:05 +0800
commit63b53acd482d38d3015419a4996cf5c2bc1fdb50 (patch)
treeb4a36468f8cda1baaeeb1b23f18fe09800104b59 /packages/dev-tools-pages/ts/pages/Compiler.tsx
parentdfa03feb43e9398dbfda8aebf96b6fb63dff0989 (diff)
parent50eee9a657fe81fa0af4652f9a5a3f1892a1f1fa (diff)
downloaddexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.tar
dexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.tar.gz
dexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.tar.bz2
dexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.tar.lz
dexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.tar.xz
dexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.tar.zst
dexon-sol-tools-63b53acd482d38d3015419a4996cf5c2bc1fdb50.zip
Merge branch 'dev-tools-pages' into feature/variables
Diffstat (limited to 'packages/dev-tools-pages/ts/pages/Compiler.tsx')
-rw-r--r--packages/dev-tools-pages/ts/pages/Compiler.tsx76
1 files changed, 44 insertions, 32 deletions
diff --git a/packages/dev-tools-pages/ts/pages/Compiler.tsx b/packages/dev-tools-pages/ts/pages/Compiler.tsx
index 35c810cb3..96f26a978 100644
--- a/packages/dev-tools-pages/ts/pages/Compiler.tsx
+++ b/packages/dev-tools-pages/ts/pages/Compiler.tsx
@@ -3,8 +3,7 @@ import { render, hydrate } from 'react-dom';
import context from 'ts/context/compiler';
import Base from 'ts/components/Base';
-import Container from 'ts/components/Container';
-import Main from 'ts/components/Main';
+import Content from 'ts/components/Content';
import ContentBlock from 'ts/components/ContentBlock';
import { Tabs, TabBlock } from 'ts/components/Tabs';
import Code from 'ts/components/Code';
@@ -15,40 +14,53 @@ import CompilerComponent from 'ts/components/Compiler';
function Compiler() {
return (
<Base context={context}>
- <Container>
- <CompilerComponent />
- <Main>
- <ContentBlock title="Required steps">
- <List items={['Step 1', 'Step 2']} />
- </ContentBlock>
- <ContentBlock title="Prerequisites">
- <Code>npm install @0x/sol-trace --save</Code>
- <p>
- Sol-trace is a subprovider that needs to be prepended to your{' '}
- <a href="#">provider engine</a>. Depending on your project setup, you will need to use a
- specific ArtifactAdapter. Sol-trace ships with the{' '}
- <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with Sol-compiler and{' '}
- <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the Truffle framework. You can
- also write your own and support any artifact format.
- </p>
- </ContentBlock>
+ <CompilerComponent />
+ <Content>
+ <ContentBlock main title="Get started" />
+ <ContentBlock title="Required steps">
+ <List items={['Step 1', 'Step 2']} />
+ </ContentBlock>
+ <ContentBlock title="Prerequisites">
+ <Code>npm install @0x/sol-trace --save</Code>
+ <p>
+ Sol-trace is a subprovider that needs to be prepended to your <a href="#">provider engine</a>.
+ Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace
+ ships with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with Sol-compiler and{' '}
+ <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the Truffle framework. You can also
+ write your own and support any artifact format.
+ </p>
+ </ContentBlock>
- <ContentBlock title="Installation">
- <Tabs>
- <TabBlock title="Sol-compiler">
- <Code language="js">
- {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace';
+ <ContentBlock title="Installation">
+ <Tabs>
+ <TabBlock title="Sol-compiler">
+ <Code language="js">
+ {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace';
// Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in
const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDir);`}
- </Code>
- </TabBlock>
- <TabBlock title="Truffle">Truffle</TabBlock>
- <TabBlock title="Custom">Custom</TabBlock>
- </Tabs>
- </ContentBlock>
- </Main>
- </Container>
+ </Code>
+ </TabBlock>
+ <TabBlock title="Truffle">Truffle</TabBlock>
+ <TabBlock title="Custom">Custom</TabBlock>
+ </Tabs>
+ </ContentBlock>
+ </Content>
+ <Content dark>
+ <ContentBlock main title="Artifacts">
+ <p>
+ Sol compiler uses solidity standard JSON output format for the artifacts. This way, you can
+ define which parts of the artifact you need.
+ </p>
+ </ContentBlock>
+
+ <ContentBlock title="Production">
+ <p>
+ Sol compiler uses solidity standard JSON output format for the artifacts. This way, you can
+ define which parts of the artifact you need.
+ </p>
+ </ContentBlock>
+ </Content>
</Base>
);
}