diff options
author | August Skare <post@augustskare.no> | 2018-10-18 20:08:46 +0800 |
---|---|---|
committer | August Skare <post@augustskare.no> | 2018-10-18 20:08:46 +0800 |
commit | ac60d459696b8a68caf65a345626f47c632fb2d0 (patch) | |
tree | 0f2dd0bca19317d0176675eb7ca5eca420d9e9dd /packages/dev-tools-pages/ts/components/Compiler.tsx | |
parent | afa52e280c7e36b625e95b949f1f12933a5ab9dc (diff) | |
download | dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.tar dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.tar.gz dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.tar.bz2 dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.tar.lz dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.tar.xz dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.tar.zst dexon-0x-contracts-ac60d459696b8a68caf65a345626f47c632fb2d0.zip |
compiler component in compiler view
Diffstat (limited to 'packages/dev-tools-pages/ts/components/Compiler.tsx')
-rw-r--r-- | packages/dev-tools-pages/ts/components/Compiler.tsx | 76 |
1 files changed, 76 insertions, 0 deletions
diff --git a/packages/dev-tools-pages/ts/components/Compiler.tsx b/packages/dev-tools-pages/ts/components/Compiler.tsx new file mode 100644 index 000000000..6dcfda70c --- /dev/null +++ b/packages/dev-tools-pages/ts/components/Compiler.tsx @@ -0,0 +1,76 @@ +import * as React from 'react'; +import styled from 'styled-components'; + +import InlineCode from './InlineCode'; + +const Cards = styled.dl` + display: grid; + grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr)); + align-items: start; + grid-gap: 1.25rem; + margin-top: 0; + margin-bottom: 0; +`; + +const Card = styled.div` + background-color: #f1f4f5; + padding: 3.125rem; + padding-bottom: 2.5rem; +`; + +const Dt = styled.dt` + font-weight: 500; + display: inline; + ::after { + content: '. '; + } +`; + +const Dd = styled.dd` + display: inline; + margin-left: 0; +`; + +const cards = [ + { + title: 'Project-centric', + body: ( + <React.Fragment> + It can compile an entire project instead of only individual <InlineCode>.sol</InlineCode> files + </React.Fragment> + ), + }, + { + title: 'Incremental builds', + body: 'It only recompiles your smart contracts after they have changed.', + }, + { + title: 'Customizable artifacts', + body: + 'It allows you to store only the required compiler output in your artifacts and have complete control over your bundle size.', + }, + { + title: 'Seamless', + body: 'It auto-fetches and caches the required compiler binaries.', + }, + { + title: 'Versioning', + body: + 'It compiles each contract with the version specified at the top of its file (it even supports version ranges!).', + }, +]; + +function Compiler() { + return ( + <Cards> + {cards.map(card => ( + <Card key={card.title.split(' ').join('-')}> + <Dt>{card.title}</Dt> + <Dd>{card.body}</Dd> + </Card> + ))} + </Cards> + ); +} + +export default Compiler; |