diff options
Diffstat (limited to 'packages/website/ts')
-rw-r--r-- | packages/website/ts/components/meta_tags.tsx | 25 | ||||
-rw-r--r-- | packages/website/ts/components/portal/portal.tsx | 6 | ||||
-rw-r--r-- | packages/website/ts/components/ui/container.tsx | 1 | ||||
-rw-r--r-- | packages/website/ts/index.tsx | 161 | ||||
-rw-r--r-- | packages/website/ts/pages/about/about.tsx | 13 | ||||
-rw-r--r-- | packages/website/ts/pages/jobs/jobs.tsx | 11 | ||||
-rw-r--r-- | packages/website/ts/pages/jobs/join_0x.tsx | 4 |
7 files changed, 140 insertions, 81 deletions
diff --git a/packages/website/ts/components/meta_tags.tsx b/packages/website/ts/components/meta_tags.tsx new file mode 100644 index 000000000..f6c43d23f --- /dev/null +++ b/packages/website/ts/components/meta_tags.tsx @@ -0,0 +1,25 @@ +import * as React from 'react'; +import { Helmet } from 'react-helmet'; + +export interface MetaTagsProps { + title: string; + description: string; + imgSrc?: string; +} + +export const MetaTags: React.StatelessComponent<MetaTagsProps> = ({ title, description, imgSrc }) => ( + <Helmet> + <title>{title}</title> + <meta name="description" content={description} /> + <meta property="og:title" content={title} /> + <meta property="og:description" content={description} /> + <meta property="og:type" content="website" /> + <meta property="og:image" content={imgSrc} /> + <meta name="twitter:site" content="@0xproject" /> + <meta name="twitter:image" content={imgSrc} /> + </Helmet> +); + +MetaTags.defaultProps = { + imgSrc: '/images/og_image.png', +}; diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index c61d04906..ff11880e3 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -12,6 +12,7 @@ import { PortalDisclaimerDialog } from 'ts/components/dialogs/portal_disclaimer_ import { EthWrappers } from 'ts/components/eth_wrappers'; import { FillOrder } from 'ts/components/fill_order'; import { AssetPicker } from 'ts/components/generate_order/asset_picker'; +import { MetaTags } from 'ts/components/meta_tags'; import { BackButton } from 'ts/components/portal/back_button'; import { Loading } from 'ts/components/portal/loading'; import { Menu, MenuTheme } from 'ts/components/portal/menu'; @@ -108,6 +109,8 @@ const LEFT_COLUMN_WIDTH = 346; const MENU_PADDING_LEFT = 185; const LARGE_LAYOUT_MAX_WIDTH = 1200; const SIDE_PADDING = 20; +const DOCUMENT_TITLE = '0x Portal'; +const DOCUMENT_DESCRIPTION = 'Learn about and trade on 0x Relayers'; export class Portal extends React.Component<PortalProps, PortalState> { private _blockchain: Blockchain; @@ -226,7 +229,8 @@ export class Portal extends React.Component<PortalProps, PortalState> { : TokenVisibility.TRACKED; return ( <Container> - <DocumentTitle title="0x Portal" /> + <MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} /> + <DocumentTitle title={DOCUMENT_TITLE} /> <TopBar userAddress={this.props.userAddress} networkId={this.props.networkId} diff --git a/packages/website/ts/components/ui/container.tsx b/packages/website/ts/components/ui/container.tsx index 540661ea5..f2ae68b70 100644 --- a/packages/website/ts/components/ui/container.tsx +++ b/packages/website/ts/components/ui/container.tsx @@ -35,6 +35,7 @@ export interface ContainerProps { cursor?: string; id?: string; onClick?: (event: React.MouseEvent<HTMLElement>) => void; + overflowX?: 'scroll' | 'hidden' | 'auto' | 'visible'; } export const Container: React.StatelessComponent<ContainerProps> = props => { diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index cfe8a1c9c..07f34782f 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -4,6 +4,7 @@ import { render } from 'react-dom'; import { Provider } from 'react-redux'; import { BrowserRouter as Router, Redirect, Route, Switch } from 'react-router-dom'; import * as injectTapEventPlugin from 'react-tap-event-plugin'; +import { MetaTags } from 'ts/components/meta_tags'; import { About } from 'ts/containers/about'; import { FAQ } from 'ts/containers/faq'; import { Jobs } from 'ts/containers/jobs'; @@ -71,81 +72,93 @@ const LazyEthereumTypesDocumentation = createLazyComponent('Documentation', asyn System.import<any>(/* webpackChunkName: "ethereumTypesDocs" */ 'ts/containers/ethereum_types_documentation'), ); +const DOCUMENT_TITLE = '0x: The Protocol for Trading Tokens'; +const DOCUMENT_DESCRIPTION = 'An Open Protocol For Decentralized Exchange On The Ethereum Blockchain'; + render( - <Router> - <div> - <MuiThemeProvider muiTheme={muiTheme}> - <Provider store={store}> - <div> - <Switch> - <Route exact={true} path="/" component={Landing as any} /> - <Redirect from="/otc" to={`${WebsitePaths.Portal}`} /> - <Route path={WebsitePaths.Careers} component={Jobs as any} /> - <Route path={WebsitePaths.Portal} component={LazyPortal} /> - <Route path={WebsitePaths.FAQ} component={FAQ as any} /> - <Route path={WebsitePaths.About} component={About as any} /> - <Route path={WebsitePaths.Wiki} component={Wiki as any} /> - <Route path={`${WebsitePaths.ZeroExJs}/:version?`} component={LazyZeroExJSDocumentation} /> - <Route - path={`${WebsitePaths.ContractWrappers}/:version?`} - component={LazyContractWrappersDocumentation} - /> - <Route - path={`${WebsitePaths.OrderWatcher}/:version?`} - component={LazyOrderWatcherDocumentation} - /> - <Route path={`${WebsitePaths.Connect}/:version?`} component={LazyConnectDocumentation} /> - <Route - path={`${WebsitePaths.SolCompiler}/:version?`} - component={LazySolCompilerDocumentation} - /> - <Route path={`${WebsitePaths.SolCov}/:version?`} component={LazySolCovDocumentation} /> - <Route - path={`${WebsitePaths.JSONSchemas}/:version?`} - component={LazyJSONSchemasDocumentation} - /> - <Route - path={`${WebsitePaths.Subproviders}/:version?`} - component={LazySubprovidersDocumentation} - /> - <Route - path={`${WebsitePaths.OrderUtils}/:version?`} - component={LazyOrderUtilsDocumentation} - /> - <Route - path={`${WebsitePaths.Web3Wrapper}/:version?`} - component={LazyWeb3WrapperDocumentation} - /> - <Route - path={`${WebsitePaths.SmartContracts}/:version?`} - component={LazySmartContractsDocumentation} - /> - <Route - path={`${WebsitePaths.EthereumTypes}/:version?`} - component={LazyEthereumTypesDocumentation} - /> + <div> + <MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} /> + <Router> + <div> + <MuiThemeProvider muiTheme={muiTheme}> + <Provider store={store}> + <div> + <Switch> + <Route exact={true} path="/" component={Landing as any} /> + <Redirect from="/otc" to={`${WebsitePaths.Portal}`} /> + <Route path={WebsitePaths.Careers} component={Jobs as any} /> + <Route path={WebsitePaths.Portal} component={LazyPortal} /> + <Route path={WebsitePaths.FAQ} component={FAQ as any} /> + <Route path={WebsitePaths.About} component={About as any} /> + <Route path={WebsitePaths.Wiki} component={Wiki as any} /> + <Route + path={`${WebsitePaths.ZeroExJs}/:version?`} + component={LazyZeroExJSDocumentation} + /> + <Route + path={`${WebsitePaths.ContractWrappers}/:version?`} + component={LazyContractWrappersDocumentation} + /> + <Route + path={`${WebsitePaths.OrderWatcher}/:version?`} + component={LazyOrderWatcherDocumentation} + /> + <Route + path={`${WebsitePaths.Connect}/:version?`} + component={LazyConnectDocumentation} + /> + <Route + path={`${WebsitePaths.SolCompiler}/:version?`} + component={LazySolCompilerDocumentation} + /> + <Route path={`${WebsitePaths.SolCov}/:version?`} component={LazySolCovDocumentation} /> + <Route + path={`${WebsitePaths.JSONSchemas}/:version?`} + component={LazyJSONSchemasDocumentation} + /> + <Route + path={`${WebsitePaths.Subproviders}/:version?`} + component={LazySubprovidersDocumentation} + /> + <Route + path={`${WebsitePaths.OrderUtils}/:version?`} + component={LazyOrderUtilsDocumentation} + /> + <Route + path={`${WebsitePaths.Web3Wrapper}/:version?`} + component={LazyWeb3WrapperDocumentation} + /> + <Route + path={`${WebsitePaths.SmartContracts}/:version?`} + component={LazySmartContractsDocumentation} + /> + <Route + path={`${WebsitePaths.EthereumTypes}/:version?`} + component={LazyEthereumTypesDocumentation} + /> - {/* Legacy endpoints */} - <Route - path={`${WebsiteLegacyPaths.ZeroExJs}/:version?`} - component={LazyZeroExJSDocumentation} - /> - <Route - path={`${WebsiteLegacyPaths.Web3Wrapper}/:version?`} - component={LazyWeb3WrapperDocumentation} - /> - <Route - path={`${WebsiteLegacyPaths.Deployer}/:version?`} - component={LazySolCompilerDocumentation} - /> - <Route path={WebsiteLegacyPaths.Jobs} component={Jobs as any} /> - <Route path={`${WebsitePaths.Docs}`} component={LazyZeroExJSDocumentation} /> - <Route component={NotFound as any} /> - </Switch> - </div> - </Provider> - </MuiThemeProvider> - </div> - </Router>, + {/* Legacy endpoints */} + <Route + path={`${WebsiteLegacyPaths.ZeroExJs}/:version?`} + component={LazyZeroExJSDocumentation} + /> + <Route + path={`${WebsiteLegacyPaths.Web3Wrapper}/:version?`} + component={LazyWeb3WrapperDocumentation} + /> + <Route + path={`${WebsiteLegacyPaths.Deployer}/:version?`} + component={LazySolCompilerDocumentation} + /> + <Route path={WebsiteLegacyPaths.Jobs} component={Jobs as any} /> + <Route path={`${WebsitePaths.Docs}`} component={LazyZeroExJSDocumentation} /> + <Route component={NotFound as any} /> + </Switch> + </div> + </Provider> + </MuiThemeProvider> + </div> + </Router> + </div>, document.getElementById('app'), ); diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx index b9bc906bd..aef4d0df9 100644 --- a/packages/website/ts/pages/about/about.tsx +++ b/packages/website/ts/pages/about/about.tsx @@ -27,7 +27,7 @@ const teamRow1: ProfileInfo[] = [ title: 'Co-founder & CTO', description: `Smart contract R&D. Previously fixed income trader at DRW. \ Finance at University of Illinois, Urbana-Champaign.`, - image: '/images/team/amir.jpeg', + image: '/images/team/amir.png', linkedIn: 'https://www.linkedin.com/in/abandeali1/', github: 'https://github.com/abandeali1', medium: 'https://medium.com/@abandeali1', @@ -191,6 +191,16 @@ const teamRow6: ProfileInfo[] = [ }, ]; +const teamRow7: ProfileInfo[] = [ + { + name: 'Clay Robbins', + title: 'Business Development Lead', + description: `Growth & Business Development. Previously product and partnerships at Square. Economics at Dartmouth College.`, + image: 'images/team/clay.png', + linkedIn: 'https://www.linkedin.com/in/robbinsclay/', + }, +]; + const advisors: ProfileInfo[] = [ { name: 'Fred Ehrsam', @@ -286,6 +296,7 @@ export class About extends React.Component<AboutProps, AboutState> { <div className="clearfix">{this._renderProfiles(teamRow4)}</div> <div className="clearfix">{this._renderProfiles(teamRow5)}</div> <div className="clearfix">{this._renderProfiles(teamRow6)}</div> + <div className="clearfix">{this._renderProfiles(teamRow7)}</div> </div> <div className="pt3 pb2"> <div diff --git a/packages/website/ts/pages/jobs/jobs.tsx b/packages/website/ts/pages/jobs/jobs.tsx index 5c45d79fa..cc4b1f04b 100644 --- a/packages/website/ts/pages/jobs/jobs.tsx +++ b/packages/website/ts/pages/jobs/jobs.tsx @@ -4,7 +4,9 @@ import * as React from 'react'; import * as DocumentTitle from 'react-document-title'; import { Footer } from 'ts/components/footer'; +import { MetaTags } from 'ts/components/meta_tags'; import { TopBar } from 'ts/components/top_bar/top_bar'; +import { Container } from 'ts/components/ui/container'; import { Benefits } from 'ts/pages/jobs/benefits'; import { Join0x } from 'ts/pages/jobs/join_0x'; import { Mission } from 'ts/pages/jobs/mission'; @@ -16,6 +18,8 @@ import { utils } from 'ts/utils/utils'; const OPEN_POSITIONS_HASH = 'positions'; const THROTTLE_TIMEOUT = 100; +const DOCUMENT_TITLE = 'Careers at 0x'; +const DOCUMENT_DESCRIPTION = 'Join 0x in creating a tokenized world where all value can flow freely'; export interface JobsProps { location: Location; @@ -39,8 +43,9 @@ export class Jobs extends React.Component<JobsProps, JobsState> { } public render(): React.ReactNode { return ( - <div> - <DocumentTitle title="Careers at 0x" /> + <Container overflowX="hidden"> + <MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} /> + <DocumentTitle title={DOCUMENT_TITLE} /> <TopBar blockchainIsLoaded={false} location={this.props.location} @@ -52,7 +57,7 @@ export class Jobs extends React.Component<JobsProps, JobsState> { <Benefits screenWidth={this.props.screenWidth} /> <OpenPositions hash={OPEN_POSITIONS_HASH} screenWidth={this.props.screenWidth} /> <Footer translate={this.props.translate} dispatcher={this.props.dispatcher} /> - </div> + </Container> ); } private _onJoin0xCallToActionClick(): void { diff --git a/packages/website/ts/pages/jobs/join_0x.tsx b/packages/website/ts/pages/jobs/join_0x.tsx index daddb0dcf..ec8afbd93 100644 --- a/packages/website/ts/pages/jobs/join_0x.tsx +++ b/packages/website/ts/pages/jobs/join_0x.tsx @@ -20,10 +20,10 @@ export const Join0x = (props: Join0xProps) => ( className="mx-auto inline-block align-middle py4" style={{ lineHeight: '44px', textAlign: 'center', position: 'relative' }} > - <Container className="sm-hide xs-hide md-hide" position="absolute" left="100%" marginLeft="80px"> + <Container className="sm-hide xs-hide" position="absolute" left="100%" marginLeft="80px"> <Image src="images/jobs/hero-dots-right.svg" width="400px" /> </Container> - <Container className="sm-hide xs-hide md-hide" position="absolute" right="100%" marginRight="80px"> + <Container className="sm-hide xs-hide" position="absolute" right="100%" marginRight="80px"> <Image src="images/jobs/hero-dots-left.svg" width="400px" /> </Container> <div className="h2 sm-center sm-pt3" style={{ fontFamily: 'Roboto Mono' }}> |