diff --git a/packages/react-shared/CHANGELOG.json b/packages/react-shared/CHANGELOG.json index 23e0d7f7e3..9ef0d079f4 100644 --- a/packages/react-shared/CHANGELOG.json +++ b/packages/react-shared/CHANGELOG.json @@ -1,4 +1,14 @@ [ + { + "version": "1.1.0", + "changes": [ + { + "note": + "Change implementation to use react-router-dom NavLink instead of Link. Expose `activeStyle` prop.", + "pr": 1448 + } + ] + }, { "version": "1.0.25", "changes": [ diff --git a/packages/react-shared/src/components/link.tsx b/packages/react-shared/src/components/link.tsx index 089e6e2ba8..2fb19ac113 100644 --- a/packages/react-shared/src/components/link.tsx +++ b/packages/react-shared/src/components/link.tsx @@ -1,13 +1,13 @@ import * as _ from 'lodash'; import * as React from 'react'; -import { Link as ReactRounterLink } from 'react-router-dom'; +import { NavLink as ReactRounterLink } from 'react-router-dom'; import { Link as ScrollLink } from 'react-scroll'; import * as validUrl from 'valid-url'; import { LinkType } from '../types'; import { constants } from '../utils/constants'; -interface BaseLinkProps { +export interface BaseLinkProps { to: string; shouldOpenInNewTab?: boolean; className?: string; @@ -18,11 +18,15 @@ interface BaseLinkProps { fontColor?: string; } -interface ScrollLinkProps extends BaseLinkProps { +export interface ScrollLinkProps extends BaseLinkProps { onActivityChanged?: (isActive: boolean) => void; } -type LinkProps = BaseLinkProps & ScrollLinkProps; +export interface ReactLinkProps extends BaseLinkProps { + activeStyle?: React.CSSProperties; +} + +export type LinkProps = ReactLinkProps & ScrollLinkProps; export interface LinkState {} @@ -94,6 +98,7 @@ export class Link extends React.Component { onMouseOver={this.props.onMouseOver} onMouseEnter={this.props.onMouseEnter} onMouseLeave={this.props.onMouseLeave} + activeStyle={this.props.activeStyle} > {this.props.children} diff --git a/packages/react-shared/src/index.ts b/packages/react-shared/src/index.ts index a693f2a363..285e1c6b45 100644 --- a/packages/react-shared/src/index.ts +++ b/packages/react-shared/src/index.ts @@ -3,7 +3,7 @@ export { MarkdownLinkBlock } from './components/markdown_link_block'; export { MarkdownCodeBlock } from './components/markdown_code_block'; export { MarkdownSection } from './components/markdown_section'; export { SectionHeader } from './components/section_header'; -export { Link } from './components/link'; +export { Link, LinkProps } from './components/link'; export { HeaderSizes, Styles, EtherscanLinkSuffixes, Networks, ALink } from './types'; diff --git a/packages/website/ts/@next/components/aboutPageLayout.tsx b/packages/website/ts/@next/components/aboutPageLayout.tsx index 7d98804bb9..86a94ae2b9 100644 --- a/packages/website/ts/@next/components/aboutPageLayout.tsx +++ b/packages/website/ts/@next/components/aboutPageLayout.tsx @@ -1,3 +1,4 @@ +import * as _ from 'lodash'; import * as React from 'react'; import styled from 'styled-components'; @@ -14,7 +15,8 @@ interface Props { title: string; description: React.ReactNode | string; linkLabel?: string; - linkUrl?: string; + href?: string; + to?: string; children?: React.ReactNode; } @@ -22,31 +24,32 @@ export const AboutPageLayout = (props: Props) => (
- Mission - Team - Press - Jobs - + Mission + Team + Press + Jobs + - - - - {props.title} - + + + {props.title} - - {props.description} - + + {props.description} + - {(props.linkLabel && props.linkUrl) && - - {props.linkLabel} - - } + {props.linkLabel && + (props.href || props.to) && ( + + {props.linkLabel} + + )}
@@ -56,13 +59,13 @@ export const AboutPageLayout = (props: Props) => ( ); const AnimatedHeading = styled(Heading)` - ${addFadeInAnimation('0.5s')} + ${addFadeInAnimation('0.5s')}; `; const AnimatedParagraph = styled(Paragraph)` - ${addFadeInAnimation('0.5s', '0.15s')} + ${addFadeInAnimation('0.5s', '0.15s')}; `; const AnimatedLink = styled(Button)` - ${addFadeInAnimation('0.6s', '0.3s')} + ${addFadeInAnimation('0.6s', '0.3s')}; `; diff --git a/packages/website/ts/@next/components/dropdowns/dropdown_developers.tsx b/packages/website/ts/@next/components/dropdowns/dropdown_developers.tsx index dfd351d321..96d88846b8 100644 --- a/packages/website/ts/@next/components/dropdowns/dropdown_developers.tsx +++ b/packages/website/ts/@next/components/dropdowns/dropdown_developers.tsx @@ -1,63 +1,73 @@ +import { Link } from '@0x/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; -import {Link as RouterLink} from 'react-router-dom'; -import styled, {withTheme} from 'styled-components'; +import styled, { withTheme } from 'styled-components'; -import {Button} from 'ts/@next/components/button'; -import {Column, FlexWrap, WrapGrid} from 'ts/@next/components/newLayout'; -import {ThemeValuesInterface} from 'ts/@next/components/siteWrap'; -import {Heading} from 'ts/@next/components/text'; +import { Button } from 'ts/@next/components/button'; +import { Column, FlexWrap, WrapGrid } from 'ts/@next/components/newLayout'; +import { ThemeValuesInterface } from 'ts/@next/components/siteWrap'; +import { Heading } from 'ts/@next/components/text'; +import { WebsitePaths } from 'ts/types'; +import { constants } from 'ts/utils/constants'; interface Props { theme: ThemeValuesInterface; } -const introData = [ +interface LinkConfig { + label: string; + url: string; + shouldOpenInNewTab?: boolean; +} + +const introData: LinkConfig[] = [ { label: 'Build a relayer', - url: 'https://0x.org/wiki#Build-A-Relayer', + url: `${WebsitePaths.Wiki}#Build-A-Relayer`, }, { label: 'Develop on Ethereum', - url: 'https://0x.org/wiki#Ethereum-Development', + url: `${WebsitePaths.Wiki}#Ethereum-Development`, }, { label: 'Make & take orders', - url: 'https://0x.org/wiki#Create,-Validate,-Fill-Order', + url: `${WebsitePaths.Wiki}#Create,-Validate,-Fill-Order`, }, { label: 'Use networked liquidity', - url: 'https://0x.org/wiki#Find,-Submit,-Fill-Order-From-Relayer', + url: `${WebsitePaths.Wiki}#Find,-Submit,-Fill-Order-From-Relayer`, }, ]; -const docsData = [ +const docsData: LinkConfig[] = [ { label: '0x.js', - url: 'https://0x.org/docs/0x.js', + url: WebsitePaths.ZeroExJs, }, { label: '0x Connect', - url: 'https://0x.org/docs/connect', + url: WebsitePaths.Connect, }, { label: 'Smart Contract', - url: 'https://0x.org/docs/contracts', + url: WebsitePaths.SmartContracts, }, ]; -const linksData = [ +const linksData: LinkConfig[] = [ { label: 'Wiki', - url: 'https://0x.org/wiki', + url: WebsitePaths.Wiki, }, { label: 'Github', - url: 'https://github.com/0xProject', + url: constants.URL_GITHUB_ORG, + shouldOpenInNewTab: true, }, { - label: 'Whitepaper', - url: 'https://github.com/0xProject/0x-protocol-specification/blob/master/v2/v2-specification.md', + label: 'Protocol specification', + url: constants.URL_PROTOCOL_SPECIFICATION, + shouldOpenInNewTab: true, }, ]; @@ -65,25 +75,16 @@ export const DropdownDevelopers: React.FunctionComponent = withTheme((pro <>
- + Getting Started {_.map(introData, (item, index) => (
  • - + {item.label} - +
    • ))}     @@ -91,51 +92,44 @@ export const DropdownDevelopers: React.FunctionComponent = withTheme((pro - + Popular Docs
      {_.map(docsData, (item, index) => (
    • - + {item.label} - +
      • ))}
    - + Useful Links
      {_.map(linksData, (item, index) => (
    • - + {item.label} - +
      • ))}
    - + View All Documentation @@ -174,7 +168,7 @@ const StyledWrap = styled(FlexWrap)` opacity: 0.15; position: absolute; top: 0; - left:0; + left: 0; } `; diff --git a/packages/website/ts/@next/components/footer.tsx b/packages/website/ts/@next/components/footer.tsx index 155f469799..1e4d7789b4 100644 --- a/packages/website/ts/@next/components/footer.tsx +++ b/packages/website/ts/@next/components/footer.tsx @@ -1,3 +1,4 @@ +import { Link as SmartLink } from '@0x/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import MediaQuery from 'react-responsive'; @@ -8,11 +9,12 @@ import { Logo } from 'ts/@next/components/logo'; import { Column, FlexWrap, WrapGrid } from 'ts/@next/components/newLayout'; import { NewsletterForm } from 'ts/@next/components/newsletter_form'; import { WebsitePaths } from 'ts/types'; +import { constants } from 'ts/utils/constants'; interface LinkInterface { text: string; url: string; - newWindow?: boolean; + shouldOpenInNewTab?: boolean; } interface LinkRows { @@ -37,9 +39,9 @@ const linkRows: LinkRows[] = [ { heading: 'Developers', links: [ - { url: '#', text: 'Documentation' }, - { url: '#', text: 'GitHub' }, - { url: '#', text: 'Whitepaper' }, + { url: WebsitePaths.Docs, text: 'Documentation' }, + { url: constants.URL_GITHUB_ORG, text: 'GitHub', shouldOpenInNewTab: true }, + { url: constants.URL_PROTOCOL_SPECIFICATION, text: 'Protogcol Spec', shouldOpenInNewTab: true }, ], }, { @@ -49,7 +51,7 @@ const linkRows: LinkRows[] = [ { url: WebsitePaths.AboutMission, text: 'Mission' }, { url: WebsitePaths.AboutTeam, text: 'Team' }, { url: WebsitePaths.AboutJobs, text: 'Jobs' }, - { url: WebsitePaths.AboutPress, text: 'Press Kit' }, + { url: WebsitePaths.AboutPress, text: 'Press' }, { url: WebsitePaths.Ecosystem, text: 'Grant Program' }, ], }, @@ -57,10 +59,10 @@ const linkRows: LinkRows[] = [ heading: 'Community', isOnMobile: true, links: [ - { url: '#', text: 'Twitter' }, - { url: '#', text: 'Rocket Chat' }, - { url: '#', text: 'Facebook' }, - { url: '#', text: 'Reddit' }, + { url: constants.URL_TWITTER, text: 'Twitter', shouldOpenInNewTab: true }, + { url: constants.URL_ZEROEX_CHAT, text: 'Discord Chat', shouldOpenInNewTab: true }, + { url: constants.URL_FACEBOOK, text: 'Facebook', shouldOpenInNewTab: true }, + { url: constants.URL_REDDIT, text: 'Reddit', shouldOpenInNewTab: true }, ], }, ]; @@ -78,9 +80,7 @@ export const Footer: React.StatelessComponent = () => ( {_.map(linkRows, (row: LinkRows, index) => ( - - {row.heading} - + {row.heading} @@ -93,15 +93,15 @@ export const Footer: React.StatelessComponent = () => ( ); const LinkList = (props: LinkListProps) => ( - - {_.map(props.links, (link, index) => ( -
  • - - {link.text} - -
    • - ))} -     + + {_.map(props.links, (link, index) => ( +
  • + + {link.text} + +
    • + ))} +     ); const FooterWrap = styled.footer` @@ -154,7 +154,7 @@ const List = styled.ul` } `; -const Link = styled(ReactRouterLink)` +const Link = styled(SmartLink)` color: inherit; opacity: 0.5; display: block; diff --git a/packages/website/ts/@next/components/header.tsx b/packages/website/ts/@next/components/header.tsx index 544a7daf1f..e6b49e3956 100644 --- a/packages/website/ts/@next/components/header.tsx +++ b/packages/website/ts/@next/components/header.tsx @@ -1,8 +1,8 @@ +import { Link } from '@0x/react-shared'; import _ from 'lodash'; import * as React from 'react'; import MediaQuery from 'react-responsive'; -import { NavLink as ReactRouterLink } from 'react-router-dom'; -import styled, { withTheme } from 'styled-components'; +import styled, { css, withTheme } from 'styled-components'; import Headroom from 'react-headroom'; @@ -15,6 +15,7 @@ import { MobileNav } from 'ts/@next/components/mobileNav'; import { FlexWrap } from 'ts/@next/components/newLayout'; import { ThemeValuesInterface } from 'ts/@next/components/siteWrap'; import { WebsitePaths } from 'ts/types'; +import { constants } from 'ts/utils/constants'; interface HeaderProps { location?: Location; @@ -29,6 +30,7 @@ interface NavItemProps { text?: string; dropdownWidth?: number; dropdownComponent?: React.ReactNode; + shouldOpenInNewTab?: boolean; } interface DropdownWrapInterface { @@ -43,14 +45,12 @@ const navItems: NavItemProps[] = [ }, { id: 'products', - url: '#', text: 'Products', dropdownComponent: DropdownProducts, dropdownWidth: 280, }, { id: 'developers', - url: '#', text: 'Developers', dropdownComponent: DropdownDevelopers, dropdownWidth: 480, @@ -62,7 +62,8 @@ const navItems: NavItemProps[] = [ }, { id: 'blog', - url: 'https://blog.0x.org/latest', + url: constants.URL_BLOG, + shouldOpenInNewTab: true, text: 'Blog', }, ]; @@ -72,7 +73,7 @@ class HeaderBase extends React.Component { if (this.props.isNavToggled) { this.props.toggleMobileNav(); } - } + }; public render(): React.ReactNode { const { isNavToggled, toggleMobileNav, theme } = this.props; @@ -81,25 +82,16 @@ class HeaderBase extends React.Component { - + - + - {_.map(navItems, (link, index) => ( - - ))} + {_.map(navItems, (link, index) => )} - + Trade on 0x @@ -118,23 +110,30 @@ export const Header = withTheme(HeaderBase); const NavItem = (props: { link: NavItemProps; key: string }) => { const { link } = props; const Subnav = link.dropdownComponent; - + const linkElement = _.isUndefined(link.url) ? ( + {link.text} + ) : ( + + {link.text} + + ); return ( - - {link.text} - + {linkElement} - {link.dropdownComponent && + {link.dropdownComponent && ( - } + )} ); }; -const StyledHeader = styled.header` +const StyledHeader = + styled.header < + HeaderProps > + ` padding: 30px; background-color: ${props => props.theme.bgColor}; `; @@ -157,9 +156,7 @@ const LinkWrap = styled.li` } `; -const StyledNavLink = styled(ReactRouterLink).attrs({ - activeStyle: { opacity: 1 }, -})` +const linkStyles = css` color: ${props => props.theme.textColor}; opacity: 0.5; transition: opacity 0.35s; @@ -171,15 +168,25 @@ const StyledNavLink = styled(ReactRouterLink).attrs({ } `; -const HeaderWrap = styled(FlexWrap)` - justify-content: space-between; - align-items: center; +const StyledNavLink = styled(Link).attrs({ + activeStyle: { opacity: 1 }, +})` + ${linkStyles}; +`; - @media (max-width: 800px) { - padding-top: 0; - display: flex; - padding-bottom: 0; - } +const StyledAnchor = styled.a` + ${linkStyles}; +`; + +const HeaderWrap = styled(FlexWrap)` + justify-content: space-between; + align-items: center; + + @media (max-width: 800px) { + padding-top: 0; + display: flex; + padding-bottom: 0; + } `; const NavLinks = styled.ul` @@ -192,7 +199,10 @@ const NavLinks = styled.ul` } `; -const DropdownWrap = styled.div` +const DropdownWrap = + styled.div < + DropdownWrapInterface > + ` width: ${props => props.width || 280}px; padding: 15px 0; border: 1px solid transparent; diff --git a/packages/website/ts/@next/components/link.tsx b/packages/website/ts/@next/components/link.tsx index 001bc3713f..a7711451b4 100644 --- a/packages/website/ts/@next/components/link.tsx +++ b/packages/website/ts/@next/components/link.tsx @@ -1,5 +1,5 @@ +import { Link as SmartLink } from '@0x/react-shared'; import * as React from 'react'; -import { Link as ReactRouterLink } from 'react-router-dom'; import styled from 'styled-components'; interface LinkInterface { @@ -13,7 +13,7 @@ interface LinkInterface { theme?: { textColor: string; }; - target?: string; + shouldOpenInNewTab?: boolean; } export const Link = (props: LinkInterface) => { @@ -44,7 +44,7 @@ export const LinkWrap = styled.div` `; const StyledLink = - styled(ReactRouterLink) < + styled(SmartLink) < LinkInterface > ` display: ${props => !props.isBlock && 'inline-flex'}; diff --git a/packages/website/ts/@next/components/mobileNav.tsx b/packages/website/ts/@next/components/mobileNav.tsx index 8b5ffd7e8f..122036b9a9 100644 --- a/packages/website/ts/@next/components/mobileNav.tsx +++ b/packages/website/ts/@next/components/mobileNav.tsx @@ -2,9 +2,9 @@ import * as React from 'react'; import MediaQuery from 'react-responsive'; import styled from 'styled-components'; -import {Link} from 'react-router-dom'; +import { Link } from 'react-router-dom'; -import {WrapGrid, WrapProps} from 'ts/@next/components/newLayout'; +import { WrapGrid, WrapProps } from 'ts/@next/components/newLayout'; import { WebsitePaths } from 'ts/types'; interface Props { @@ -24,14 +24,10 @@ export class MobileNav extends React.PureComponent {
    • - - 0x Instant - + 0x Instant
    • - - 0x Launch Kit - + 0x Launch Kit
    @@ -39,39 +35,36 @@ export class MobileNav extends React.PureComponent {
  • - - Why 0x - + Why 0x
  • - - About - + About
  • - + Blog
    • - {isToggled && - - } + {isToggled && }     ); } } -const Wrap = styled.nav<{ isToggled: boolean }>` +const Wrap = + styled.nav < + { isToggled: boolean } > + ` width: 100%; height: 357px; background-color: ${props => props.theme.mobileNavBgUpper}; color: ${props => props.theme.mobileNavColor}; - transition: ${props => props.isToggled ? 'visibility 0s, transform 0.5s' : 'visibility 0s 0.5s, transform 0.5s'}; - transform: translate3d(0, ${props => props.isToggled ? 0 : '-100%'}, 0); + transition: ${props => (props.isToggled ? 'visibility 0s, transform 0.5s' : 'visibility 0s 0.5s, transform 0.5s')}; + transform: translate3d(0, ${props => (props.isToggled ? 0 : '-100%')}, 0); visibility: ${props => !props.isToggled && 'hidden'}; position: fixed; display: flex; @@ -103,13 +96,19 @@ const Overlay = styled.div` cursor: pointer; `; -const Section = styled.div<{ isDark?: boolean }>` +const Section = + styled.div < + { isDark: boolean } > + ` width: 100%; padding: 15px 30px; background-color: ${props => props.isDark && props.theme.mobileNavBgLower}; `; -const Grid = styled(WrapGrid)` +const Grid = + styled(WrapGrid) < + WrapProps > + ` justify-content: flex-start; li { diff --git a/packages/website/ts/@next/pages/about/jobs.tsx b/packages/website/ts/@next/pages/about/jobs.tsx index 1e9d546095..4dc9d8002e 100644 --- a/packages/website/ts/@next/pages/about/jobs.tsx +++ b/packages/website/ts/@next/pages/about/jobs.tsx @@ -7,6 +7,7 @@ import { Column, FlexWrap, Section } from 'ts/@next/components/newLayout'; import { Heading, Paragraph } from 'ts/@next/components/text'; import { WebsiteBackendJobInfo } from 'ts/types'; import { backendClient } from 'ts/utils/backend_client'; +import { constants } from 'ts/utils/constants'; const OPEN_POSITIONS_HASH = 'positions'; @@ -95,7 +96,7 @@ export class NextAboutJobs extends React.Component } linkLabel="Our mission and values" - linkUrl="/about/mission" + href={constants.URL_MISSION_AND_VALUES_BLOG_POST} >
    diff --git a/packages/website/ts/@next/pages/about/mission.tsx b/packages/website/ts/@next/pages/about/mission.tsx index 78602f8ada..35aac684b6 100644 --- a/packages/website/ts/@next/pages/about/mission.tsx +++ b/packages/website/ts/@next/pages/about/mission.tsx @@ -7,21 +7,25 @@ import { Definition } from 'ts/@next/components/definition'; import { Image } from 'ts/@next/components/image'; import { Column, Section } from 'ts/@next/components/newLayout'; import { Heading } from 'ts/@next/components/text'; +import { constants } from 'ts/utils/constants'; const values = [ { title: 'Do The Right Thing', - description: 'We acknowledge the broad subjectivity behind doing “the right thing,” and are committed to rigorously exploring its nuance in our decision making. We believe this responsibility drives our decision making above all else, and pledge to act in the best interest of our peers, community, and society as a whole.', + description: + 'We acknowledge the broad subjectivity behind doing “the right thing,” and are committed to rigorously exploring its nuance in our decision making. We believe this responsibility drives our decision making above all else, and pledge to act in the best interest of our peers, community, and society as a whole.', icon: 'right-thing', }, { title: 'Consistently Ship', - description: 'Achieving our mission requires dedication and diligence. We aspire to be an organization that consistently ships. We set high-impact goals that are rooted in data and pride ourselves in consistently outputting outstanding results across the organization.', + description: + 'Achieving our mission requires dedication and diligence. We aspire to be an organization that consistently ships. We set high-impact goals that are rooted in data and pride ourselves in consistently outputting outstanding results across the organization.', icon: 'consistently-ship', }, { title: 'Focus on Long-term Impact', - description: 'We anticipate that over time, awareness of the fundamentally disruptive nature of frictionless global exchange will cause some to see this technology as a threat. There will be setbacks, some will claim that this technology is too disruptive, and we will face adversity. Persistence and a healthy long-term focus will see us through these battles.', + description: + 'We anticipate that over time, awareness of the fundamentally disruptive nature of frictionless global exchange will cause some to see this technology as a threat. There will be setbacks, some will claim that this technology is too disruptive, and we will face adversity. Persistence and a healthy long-term focus will see us through these battles.', icon: 'long-term-impact', }, ]; @@ -31,15 +35,11 @@ export const NextAboutMission = () => ( title="Creating a tokenized world where all value can flow freely." description="0x is important infrastructure for the emerging crypto economy and enables markets to be created that couldn't have existed before. As more assets become tokenized, public blockchains provide the opportunity to establish a new financial stack that is more efficient, transparent, and equitable than any system in the past." linkLabel="Our mission and values" - linkUrl="#" + href={constants.URL_MISSION_AND_VALUES_BLOG_POST} >
    - 0x Offices + 0x Offices
    diff --git a/packages/website/ts/@next/pages/about/press.tsx b/packages/website/ts/@next/pages/about/press.tsx index 7d8dfccabe..ef04506cf3 100644 --- a/packages/website/ts/@next/pages/about/press.tsx +++ b/packages/website/ts/@next/pages/about/press.tsx @@ -22,26 +22,31 @@ const highlights: HighlightProps[] = [ { logo: '/images/@next/press/logo-forbes.png', title: 'Forbes', - text: '0x Instant is aiming to aid businesses and developers such as news sites, crypto wallets, dApps or price trackers to monetize or add a new revenue stream to their existing pipeline.', - href: '#', + text: + '0x Instant is aiming to aid businesses and developers such as news sites, crypto wallets, dApps or price trackers to monetize or add a new revenue stream to their existing pipeline.', + href: + 'https://www.forbes.com/sites/rebeccacampbell1/2018/12/06/0x-launches-instant-delivers-an-easy-and-flexible-way-to-buy-crypto-tokens/#bfb73a843561', }, { logo: '/images/@next/press/logo-venturebeat.png', title: 'VentureBeat', text: '0x leads the way for ‘tokenization’ of the world, and collectible game items are next', - href: '#', + href: + 'https://venturebeat.com/2018/09/24/0x-leads-the-way-for-tokenization-of-the-world-and-collectible-game-items-are-next/', }, { logo: '/images/@next/press/logo-fortune.png', title: 'Fortune', - text: 'In the future, many traditional investments like real estate and corporate shares will come in the form of digital tokens that are bought and transferred on a blockchain.', - href: '#', + text: + 'In the future, many traditional investments like real estate and corporate shares will come in the form of digital tokens that are bought and transferred on a blockchain.', + href: 'http://fortune.com/2018/09/06/0x-harbor-blockchain/', }, { logo: '/images/@next/press/logo-techcrunch.png', title: 'TechCrunch', - text: '0x allows any developer to quickly build their own decentralized cryptocurrency exchange and decide their own fees.', - href: '#', + text: + '0x allows any developer to quickly build their own decentralized cryptocurrency exchange and decide their own fees.', + href: 'https://techcrunch.com/2018/07/16/0x/', }, ]; @@ -51,7 +56,7 @@ export const NextAboutPress = () => ( description={ <> - Want to write about 0x? Get in touch, or download our press kit. + Want to write about 0x? Get in touch. {_.map(highlights, (highlight, index) => ( @@ -72,7 +77,9 @@ export const Highlight: React.FunctionComponent = (props: Hi {highlight.text} - + ); diff --git a/packages/website/ts/@next/pages/about/team.tsx b/packages/website/ts/@next/pages/about/team.tsx index bf8d02095d..421cacb249 100644 --- a/packages/website/ts/@next/pages/about/team.tsx +++ b/packages/website/ts/@next/pages/about/team.tsx @@ -64,7 +64,7 @@ const team: TeamMember[] = [ { imageUrl: '/images/@next/team/blake.jpg', name: 'Blake Henderson', - title: 'operations associate', + title: 'ecosystem programs lead', }, { imageUrl: '/images/@next/team/zack.jpg', @@ -89,7 +89,7 @@ const team: TeamMember[] = [ { imageUrl: '/images/@next/team/melo.jpg', name: 'Mel Oberto', - title: 'office ops / executive assistant', + title: 'people operations associate', }, { imageUrl: '/images/@next/team/alexb.jpg', @@ -181,22 +181,14 @@ export const NextAboutTeam = () => ( title="We are a global, growing team" description="We are a distributed team with backgrounds in engineering, academic research, business, and design. The 0x Core Team is passionate about accelerating the adoption decentralized technology and believe in its potential to be an equalizing force in the world. Join us and do the most impactful work of your life." linkLabel="Join the team" - linkUrl={WebsitePaths.AboutJobs} + to={WebsitePaths.AboutJobs} > -
    +
    0x Team - + {_.map(team, (info: TeamMember, index: number) => ( @@ -205,21 +197,12 @@ export const NextAboutTeam = () => (
    -
    +
    Advisors - + {_.map(advisors, (info: TeamMember, index: number) => ( @@ -239,9 +222,11 @@ const StyledGrid = styled.div` const Member = ({ name, title, imageUrl }: TeamMember) => ( - {name}/ + {name} {name} - {title} + + {title} + ); @@ -252,12 +237,13 @@ const StyledMember = styled.div` margin-right: 15px; @media (max-width: 600px) { - &:nth-child(2n+1) { + &:nth-child(2n + 1) { clear: left; } } - img, svg { + img, + svg { width: 100%; height: auto; object-fit: contain; @@ -268,7 +254,7 @@ const StyledMember = styled.div` width: calc(33.3333% - 30px); margin-right: 20px; - &:nth-child(3n+1) { + &:nth-child(3n + 1) { clear: left; } } @@ -276,11 +262,11 @@ const StyledMember = styled.div` @media (min-width: 900px) { width: calc(25% - 30px); - &:nth-child(3n+1) { + &:nth-child(3n + 1) { clear: none; } - &:nth-child(4n+1) { + &:nth-child(4n + 1) { clear: left; } } diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index 61daa1103b..dc597b18fa 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -209,7 +209,7 @@ export class EthWrappers extends React.Component
    The{' '} - + canonical WETH {' '} contract is updated when necessary. Unwrap outdated WETH in order to
 retrieve your ETH and move diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 915d28aaa6..f7a66c8368 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -192,6 +192,7 @@ render( component={LazySolCompilerDocumentation} /> +
    diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index b54ec94b65..e4df199900 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -359,7 +359,7 @@ export enum WebsitePaths { LaunchKit = '/launch-kit', Instant = '/instant', Community = '/community', - Ecosystem = '/ecosystem', + Ecosystem = '/eap', MarketMaker = '/market-maker', Why = '/why', Whitepaper = '/pdfs/0x_white_paper.pdf', diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts index 236f2021b9..ada8de549f 100644 --- a/packages/website/ts/utils/constants.ts +++ b/packages/website/ts/utils/constants.ts @@ -74,7 +74,7 @@ export const constants = { URL_ANGELLIST: 'https://angel.co/0xproject/jobs', URL_APACHE_LICENSE: 'http://www.apache.org/licenses/LICENSE-2.0', URL_BITLY_API: 'https://api-ssl.bitly.com', - URL_BLOG: 'https://blog.0x.org/latest', + URL_BLOG: 'https://blog.0xproject.com/latest', URL_DISCOURSE_FORUM: 'https://forum.0x.org', URL_ECOSYSTEM_APPLY: 'https://0x.smapply.io/', URL_ECOSYSTEM_BLOG_POST: 'https://blog.0xproject.com/announcing-the-0x-ecosystem-acceleration-program-89d1cb89d565', @@ -98,17 +98,19 @@ export const constants = { URL_SANDBOX: 'https://codesandbox.io/s/1qmjyp7p5j', URL_STANDARD_RELAYER_API_GITHUB: 'https://github.com/0xProject/standard-relayer-api/blob/master/README.md', URL_TWITTER: 'https://twitter.com/0xproject', + URL_FACEBOOK: 'https://www.facebook.com/0xProject/', URL_WETH_IO: 'https://weth.io/', + URL_CANONICAL_WETH_POST: 'https://blog.0xproject.com/canonical-weth-a9aa7d0279dd', URL_ZEROEX_CHAT, URL_LAUNCH_KIT: 'https://github.com/0xProject/0x-launch-kit', - URL_LAUNCH_KIT_BLOG_POST: 'https://blog.0x.org/introducing-the-0x-launch-kit-4acdc3453585', + URL_LAUNCH_KIT_BLOG_POST: 'https://blog.0xproject.com/introducing-the-0x-launch-kit-4acdc3453585', URL_WEB3_DOCS: 'https://github.com/ethereum/wiki/wiki/JavaScript-API', URL_WEB3_DECODED_LOG_ENTRY_EVENT: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L123', URL_WEB3_LOG_ENTRY_EVENT: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L127', URL_WEB3_PROVIDER_DOCS: 'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L150', URL_BIGNUMBERJS_GITHUB: 'http://mikemcl.github.io/bignumber.js', - URL_MISSION_AND_VALUES_BLOG_POST: 'https://blog.0x.org/the-0x-mission-and-values-181a58706f9f', + URL_MISSION_AND_VALUES_BLOG_POST: 'https://blog.0xproject.com/the-0x-mission-and-values-181a58706f9f', DEVELOPER_TOPBAR_LINKS: [ { title: Key.Wiki, diff --git a/yarn.lock b/yarn.lock index b74d7b7f0e..f0faee8560 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2087,6 +2087,10 @@ aes-js@^0.2.3: version "0.2.4" resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-0.2.4.tgz#94b881ab717286d015fa219e08fb66709dda5a3d" +aes-js@^3.1.1: + version "3.1.2" + resolved "https://registry.npmjs.org/aes-js/-/aes-js-3.1.2.tgz#db9aabde85d5caabbfc0d4f2a4446960f627146a" + agent-base@4, agent-base@^4.1.0, agent-base@~4.2.0: version "4.2.1" resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9" @@ -3652,7 +3656,7 @@ bs-logger@0.x: dependencies: fast-json-stable-stringify "^2.0.0" -bs58@=4.0.1: +bs58@=4.0.1, bs58@^4.0.0: version "4.0.1" resolved "https://registry.yarnpkg.com/bs58/-/bs58-4.0.1.tgz#be161e76c354f6f788ae4071f63f34e8c4f0a42a" dependencies: @@ -3675,6 +3679,14 @@ bs58check@^1.0.8: bs58 "^3.1.0" create-hash "^1.1.0" +bs58check@^2.1.2: + version "2.1.2" + resolved "https://registry.npmjs.org/bs58check/-/bs58check-2.1.2.tgz#53b018291228d82a5aa08e7d796fdafda54aebfc" + dependencies: + bs58 "^4.0.0" + create-hash "^1.1.0" + safe-buffer "^5.1.2" + bser@^2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz#9ac78d3ed5d915804fd87acb158bc797147a1719" @@ -6365,6 +6377,19 @@ ethereumjs-wallet@0.6.0: utf8 "^2.1.1" uuid "^2.0.1" +ethereumjs-wallet@~0.6.0: + version "0.6.2" + resolved "https://registry.npmjs.org/ethereumjs-wallet/-/ethereumjs-wallet-0.6.2.tgz#67244b6af3e8113b53d709124b25477b64aeccda" + dependencies: + aes-js "^3.1.1" + bs58check "^2.1.2" + ethereumjs-util "^5.2.0" + hdkey "^1.0.0" + safe-buffer "^5.1.2" + scrypt.js "^0.2.0" + utf8 "^3.0.0" + uuid "^3.3.2" + ethers@~4.0.4: version "4.0.4" resolved "https://registry.yarnpkg.com/ethers/-/ethers-4.0.4.tgz#d3f85e8b27f4b59537e06526439b0fb15b44dc65" @@ -7281,7 +7306,7 @@ ganache-core@0xProject/ganache-core#monorepo-dep: ethereumjs-tx "0xProject/ethereumjs-tx#fake-tx-include-signature-by-default" ethereumjs-util "^5.2.0" ethereumjs-vm "2.3.5" - ethereumjs-wallet "0.6.0" + ethereumjs-wallet "~0.6.0" fake-merkle-patricia-tree "~1.0.1" heap "~0.2.6" js-scrypt "^0.2.0" @@ -8019,6 +8044,14 @@ hdkey@^0.7.0, hdkey@^0.7.1: coinstring "^2.0.0" secp256k1 "^3.0.1" +hdkey@^1.0.0: + version "1.1.0" + resolved "https://registry.npmjs.org/hdkey/-/hdkey-1.1.0.tgz#e74e7b01d2c47f797fa65d1d839adb7a44639f29" + dependencies: + coinstring "^2.0.0" + safe-buffer "^5.1.1" + secp256k1 "^3.0.1" + he@1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd" @@ -16602,6 +16635,10 @@ utf8@^2.1.1: version "2.1.2" resolved "https://registry.yarnpkg.com/utf8/-/utf8-2.1.2.tgz#1fa0d9270e9be850d9b05027f63519bf46457d96" +utf8@^3.0.0: + version "3.0.0" + resolved "https://registry.npmjs.org/utf8/-/utf8-3.0.0.tgz#f052eed1364d696e769ef058b183df88c87f69d1" + util-deprecate@~1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"