Enable "copy" button on all code snippets that should be copy-able

6 files changed, 19 insertions, 20 deletions

diff --git a/packages/dev-tools-pages/ts/components/call_to_action.tsx b/packages/dev-tools-pages/ts/components/call_to_action.tsx
index abb92b9d3..bd255cfe1 100644
--- a/packages/dev-tools-pages/ts/components/call_to_action.tsx
+++ b/packages/dev-tools-pages/ts/components/call_to_action.tsx
@@ -9,7 +9,7 @@ import { Beta } from './typography';
 
 const CallToAction: React.StatelessComponent<ContextInterface> = ({ children }) => (
     <ThemeContext.Consumer>
-        {({ subtitle, tagline, docLink }: ContextInterface) => (
+        {({ docLink }: ContextInterface) => (
             <StyledCallToAction>
                 <CallToActionContainer>
                     <Button as="a" href={docLink} target="_blank" large={true}>
diff --git a/packages/dev-tools-pages/ts/components/code.tsx b/packages/dev-tools-pages/ts/components/code.tsx
index c4f9cee24..461a91ba3 100644
--- a/packages/dev-tools-pages/ts/components/code.tsx
+++ b/packages/dev-tools-pages/ts/components/code.tsx
@@ -139,7 +139,6 @@ class Code extends React.Component<CodeProps, CodeState> {
     public render(): React.ReactNode {
         const { language, isLight, isDiff, children, gutterLength, canCopy } = this.props;
         const { hlCode } = this.state;
-
         return (
             <Container>
                 <Base language={language} isDiff={isDiff} isLight={isLight}>
diff --git a/packages/dev-tools-pages/ts/pages/compiler.tsx b/packages/dev-tools-pages/ts/pages/compiler.tsx
index 27bbec831..407646add 100644
--- a/packages/dev-tools-pages/ts/pages/compiler.tsx
+++ b/packages/dev-tools-pages/ts/pages/compiler.tsx
@@ -44,7 +44,7 @@ const Compiler: React.StatelessComponent<{}> = () => (
 
             <ContentBlock title="Run">
                 <Breakout>
-                    <Code>cd /your_project_dir && sol-compiler</Code>
+                    <Code canCopy={true}>cd /your_project_dir && sol-compiler</Code>
                 </Breakout>
             </ContentBlock>
 
@@ -53,11 +53,11 @@ const Compiler: React.StatelessComponent<{}> = () => (
                     Configure via a <InlineCode>compiler.json</InlineCode> file.
                 </p>
                 <Breakout>
-                    <Code>mkdir compiler.json</Code>
+                    <Code canCopy={true}>mkdir compiler.json</Code>
                 </Breakout>
                 <p>Example of settings:</p>
                 <Breakout>
-                    <Code language="json">
+                    <Code language="json" canCopy={true}>
                         {`{
     "contractsDir": "contracts",
     "artifactsDir": "artifacts",
diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx
index 68b55f2a2..9d5a7d674 100644
--- a/packages/dev-tools-pages/ts/pages/coverage.tsx
+++ b/packages/dev-tools-pages/ts/pages/coverage.tsx
@@ -94,7 +94,7 @@ const Coverage: React.StatelessComponent<{}> = () => (
             </ContentBlock>
             <ContentBlock title="Installation">
                 <Breakout>
-                    <Code>npm install @0x/sol-coverage --save</Code>
+                    <Code canCopy={true}>npm install @0x/sol-coverage --save</Code>
                 </Breakout>
 
                 <p>
@@ -120,7 +120,7 @@ const Coverage: React.StatelessComponent<{}> = () => (
 
                 <Tabs>
                     <TabBlock title="Sol-compiler">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace';
 
 // Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in
@@ -128,7 +128,7 @@ const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDi
                         </Code>
                     </TabBlock>
                     <TabBlock title="Truffle">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { TruffleArtifactAdapter } from '@0x/sol-trace';
 
 const projectRoot = '.';
@@ -137,7 +137,7 @@ const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`}
                         </Code>
                     </TabBlock>
                     <TabBlock title="Custom">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { AbstractArtifactAdapter } from '@0x/sol-trace';
 
 class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...};
@@ -151,7 +151,7 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}
                 </p>
 
                 <Breakout>
-                    <Code language="javascript">
+                    <Code language="javascript" canCopy={true}>
                         {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine';
 import { CoverageSubprovider } from '@0x/sol-coverage';
 
diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx
index 1292d726c..6ee30eab9 100644
--- a/packages/dev-tools-pages/ts/pages/profiler.tsx
+++ b/packages/dev-tools-pages/ts/pages/profiler.tsx
@@ -91,7 +91,7 @@ const Profiler: React.StatelessComponent<{}> = () => (
             </ContentBlock>
             <ContentBlock title="Installation">
                 <Breakout>
-                    <Code>npm install @0x/sol-trace --save</Code>
+                    <Code canCopy={true}>npm install @0x/sol-trace --save</Code>
                 </Breakout>
 
                 <p>
@@ -117,7 +117,7 @@ const Profiler: React.StatelessComponent<{}> = () => (
 
                 <Tabs>
                     <TabBlock title="Sol-compiler">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace';
 
 // Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in
@@ -125,7 +125,7 @@ const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDi
                         </Code>
                     </TabBlock>
                     <TabBlock title="Truffle">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { TruffleArtifactAdapter } from '@0x/sol-trace';
 
 const projectRoot = '.';
@@ -134,7 +134,7 @@ const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`}
                         </Code>
                     </TabBlock>
                     <TabBlock title="Custom">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { AbstractArtifactAdapter } from '@0x/sol-trace';
 
 class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...};
@@ -148,7 +148,7 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}
                 </p>
 
                 <Breakout>
-                    <Code language="javascript">
+                    <Code language="javascript" canCopy={true}>
                         {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine';
 import { ProfilerSubprovider } from '@0x/sol-profiler';
 
diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx
index aee779ac8..cc1cd4b0a 100644
--- a/packages/dev-tools-pages/ts/pages/trace.tsx
+++ b/packages/dev-tools-pages/ts/pages/trace.tsx
@@ -61,7 +61,7 @@ const Trace: React.StatelessComponent<{}> = () => (
             </ContentBlock>
             <ContentBlock title="Installation">
                 <Breakout>
-                    <Code>npm install @0x/sol-trace --save</Code>
+                    <Code canCopy={true}>npm install @0x/sol-trace --save</Code>
                 </Breakout>
 
                 <p>
@@ -87,7 +87,7 @@ const Trace: React.StatelessComponent<{}> = () => (
 
                 <Tabs>
                     <TabBlock title="Sol-compiler">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace';
 
 // Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in
@@ -95,7 +95,7 @@ const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDi
                         </Code>
                     </TabBlock>
                     <TabBlock title="Truffle">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { TruffleArtifactAdapter } from '@0x/sol-trace';
 
 const projectRoot = '.';
@@ -104,7 +104,7 @@ const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`}
                         </Code>
                     </TabBlock>
                     <TabBlock title="Custom">
-                        <Code language="javascript">
+                        <Code language="javascript" canCopy={true}>
                             {`import { AbstractArtifactAdapter } from '@0x/sol-trace';
 
 class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...};
@@ -118,7 +118,7 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}
                 </p>
 
                 <Breakout>
-                    <Code language="javascript">
+                    <Code language="javascript" canCopy={true}>
                         {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine';
 import { RevertTraceSubprovider } from '@0x/sol-trace';