aboutsummaryrefslogtreecommitdiffstats
path: root/packages/dev-tools-pages/ts/pages/Profiler.tsx
diff options
context:
space:
mode:
authorAugust Skare <post@augustskare.no>2018-10-25 19:19:56 +0800
committerGitHub <noreply@github.com>2018-10-25 19:19:56 +0800
commit43e55a963bef2a2e4740ce27d456927b020b71f2 (patch)
tree742e684d5f3275e2bcbf5288c8718def845582cd /packages/dev-tools-pages/ts/pages/Profiler.tsx
parent9cf055c1596d8abce854fea8f4e209573d6df7c8 (diff)
downloaddexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.tar
dexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.tar.gz
dexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.tar.bz2
dexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.tar.lz
dexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.tar.xz
dexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.tar.zst
dexon-sol-tools-43e55a963bef2a2e4740ce27d456927b020b71f2.zip
Feature/syntaxhighlighting (#9)
* wip code highlighting of lines * Implements gutter component * WIP: Profiler with gutter * cleaned up highlight code * Removes before content for gutter styling * Styles gutter * Add correct Profiler code content * Adds color variable for gutter gray * refactor code component width gutter and diffing
Diffstat (limited to 'packages/dev-tools-pages/ts/pages/Profiler.tsx')
-rw-r--r--packages/dev-tools-pages/ts/pages/Profiler.tsx25
1 files changed, 21 insertions, 4 deletions
diff --git a/packages/dev-tools-pages/ts/pages/Profiler.tsx b/packages/dev-tools-pages/ts/pages/Profiler.tsx
index ac88bd933..462789a16 100644
--- a/packages/dev-tools-pages/ts/pages/Profiler.tsx
+++ b/packages/dev-tools-pages/ts/pages/Profiler.tsx
@@ -9,18 +9,35 @@ import { Tabs, TabBlock } from 'ts/components/Tabs';
import Code from 'ts/components/Code';
import InlineCode from 'ts/components/InlineCode';
import { List, ListItem } from 'ts/components/List';
-import Intro from 'ts/components/Intro';
import Breakout from 'ts/components/Breakout';
+import { Intro, IntroLead, IntroAside } from 'ts/components/Intro';
function Profiler() {
return (
<Base context={context}>
- <Intro title="ra">
- <p>
+ <Intro title="Headline">
+ <IntroLead>
Sol-profiler gathers line-by-line gas usage for any transaction submitted through your provider.
This will help you find unexpected inefficiencies in parts of your smart contract, and take a
data-driven approach to optimizing it.
- </p>
+ </IntroLead>
+ <IntroAside>
+ <Code language="javascript" diff gutterLength={6} gutter={[15, 15, undefined, 21747, 20303, 1435]}>
+ {`+function() public payable {
++ deposit();
+}
++function deposit() public payabble {
++ balanceOf[msg.sender] += msg.value;
++ Deposit(msg.sender, msg.value);
+}
+-function withdraw(uint wad) public {
+- require(balanceOf[msg.sender] >= wad);
+- balanceOf[msg.sender] -= wad;
+- msg.sender.transfer(wad);
+- Withdrawal(msg.sender, wad);
+}`}
+ </Code>
+ </IntroAside>
</Intro>
<Content>
<ContentBlock main title="Get started" />