diff options
| author | fragosti <francesco.agosti93@gmail.com> | 2018-11-30 03:23:16 +0800 |
|---|---|---|
| committer | fragosti <francesco.agosti93@gmail.com> | 2018-11-30 03:23:16 +0800 |
| commit | ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4 (patch) | |
| tree | c08e304f7d1b496fab7b68faf93d4126f2075b8d /packages/website/ts/pages/instant/code_demo.tsx | |
| parent | 0f01e31cc3826df7000e0ddc35354aa9af515966 (diff) | |
| download | dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.tar dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.tar.gz dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.tar.bz2 dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.tar.lz dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.tar.xz dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.tar.zst dexon-sol-tools-ea61c7a5dbf35586e74f6fd1ccb20dffe6e7c8f4.zip | |
feat: have basic code syntax highlighting working
Diffstat (limited to 'packages/website/ts/pages/instant/code_demo.tsx')
| -rw-r--r-- | packages/website/ts/pages/instant/code_demo.tsx | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/packages/website/ts/pages/instant/code_demo.tsx b/packages/website/ts/pages/instant/code_demo.tsx new file mode 100644 index 000000000..9764227a1 --- /dev/null +++ b/packages/website/ts/pages/instant/code_demo.tsx @@ -0,0 +1,45 @@ +import * as React from 'react'; +import SyntaxHighlighter from 'react-syntax-highlighter'; +import { atelierCaveDark } from 'react-syntax-highlighter/styles/hljs'; +import { styled } from 'ts/style/theme'; + +import { Container } from 'ts/components/ui/container'; + +const CustomPre = styled.pre` + code { + background-color: inherit !important; + border-radius: 0px; + font-family: 'Roboto Mono', sans-serif; + border: none; + } +`; + +export interface CodeDemoProps {} + +export const CodeDemo: React.StatelessComponent<CodeDemoProps> = props => { + const codeString = `<head> + <script src="http://0x-instant-staging.s3-website-us-east-1.amazonaws.com/main.bundle.js"></script> +</head> +<body> + <script> + zeroExInstant.render({ + liquiditySource: 'https://api.relayer.com/sra/v2/', + affiliateInfo: { + feeRecipient: '0x50ff5828a216170cf224389f1c5b0301a5d0a230', + feePercentage: 0.03 + } + }, 'body'); + </script> +</body>`; + return ( + <SyntaxHighlighter + useInlineStyles={true} + language="html" + style={atelierCaveDark} + showLineNumbers={true} + PreTag={CustomPre} + > + {codeString} + </SyntaxHighlighter> + ); +}; |