diff options
Diffstat (limited to 'packages/website/ts')
11 files changed, 44 insertions, 56 deletions
diff --git a/packages/website/ts/components/documentation/docs_logo.tsx b/packages/website/ts/components/documentation/docs_logo.tsx index 6f3c3c6e8..b727fea36 100644 --- a/packages/website/ts/components/documentation/docs_logo.tsx +++ b/packages/website/ts/components/documentation/docs_logo.tsx @@ -9,11 +9,9 @@ export interface DocsLogoProps { export const DocsLogo: React.StatelessComponent<DocsLogoProps> = props => { return ( - <div style={props.containerStyle}> - <Link to={WebsitePaths.Docs}> - <img src="/images/docs_logo.svg" height={props.height} /> - </Link> - </div> + <Link to={WebsitePaths.Docs}> + <img src="/images/docs_logo.svg" height={props.height} /> + </Link> ); }; diff --git a/packages/website/ts/components/documentation/docs_top_bar.tsx b/packages/website/ts/components/documentation/docs_top_bar.tsx index 3fea1c714..0b563a76b 100644 --- a/packages/website/ts/components/documentation/docs_top_bar.tsx +++ b/packages/website/ts/components/documentation/docs_top_bar.tsx @@ -68,7 +68,7 @@ export class DocsTopBar extends React.Component<DocsTopBarProps, DocsTopBarState <Container className="col col-2 sm-hide xs-hide"> <Link to={WebsitePaths.Home} - style={{ color: colors.linkSectionGrey }} + fontColor={colors.linkSectionGrey} className="flex items-center text-decoration-none" > <i className="zmdi zmdi-chevron-left bold" style={{ fontSize: 16 }} /> @@ -86,7 +86,9 @@ export class DocsTopBar extends React.Component<DocsTopBarProps, DocsTopBarState </Container> </Container> <Container className="lg-hide md-hide"> - <DocsLogo height={30} containerStyle={{ paddingTop: 6, paddingLeft: 18 }} /> + <Container paddingTop="6px" paddingLeft="18px"> + <DocsLogo height={30} /> + </Container> </Container> <Container className="md-hide lg-hide absolute" right="18px" top="12px"> <i diff --git a/packages/website/ts/components/dropdowns/developers_drop_down.tsx b/packages/website/ts/components/dropdowns/developers_drop_down.tsx index ac1d82c75..e3039420e 100644 --- a/packages/website/ts/components/dropdowns/developers_drop_down.tsx +++ b/packages/website/ts/components/dropdowns/developers_drop_down.tsx @@ -119,14 +119,7 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps, <div>{this._renderLinkSection(usefulLinksToLinkInfo)}</div> </div> </div> - <Link - to={WebsitePaths.Docs} - style={{ - color: colors.lightBlueA700, - fontWeight: 'bold', - fontSize: 14, - }} - > + <Link to={WebsitePaths.Docs} fontColor={colors.lightBlueA700}> <div style={{ padding: '0.9rem', @@ -134,6 +127,8 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps, backgroundColor: colors.lightBgGrey, borderBottomLeftRadius: 4, borderBottomRightRadius: 4, + fontWeight: 'bold', + fontSize: 14, }} > {this.props.translate.get(Key.ViewAllDocumentation, Deco.Upper)} @@ -159,10 +154,6 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps, ); } private _renderLinkSection(links: ALink[]): React.ReactNode { - const linkStyle: React.CSSProperties = { - color: colors.lightBlueA700, - fontFamily: 'Roboto, Roboto Mono', - }; const numLinks = links.length; let i = 0; const renderLinks = _.map(links, (link: ALink) => { @@ -179,8 +170,10 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps, const linkText = this.props.translate.get(link.title as Key, Deco.Cap); return ( <div className={`pr1 pt1 ${!isLast && 'pb1'}`} key={`dev-dropdown-link-${link.title}`}> - <Link to={to} type={type} shouldOpenInNewTab={!!link.shouldOpenInNewTab} style={linkStyle}> - {linkText} + <Link to={to} type={type} shouldOpenInNewTab={!!link.shouldOpenInNewTab}> + <Text fontFamily="Roboto, Roboto Mono" fontColor={colors.lightBlueA700}> + {linkText} + </Text> </Link> </div> ); diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx index 99939ce43..c1bbadfde 100644 --- a/packages/website/ts/components/fill_order.tsx +++ b/packages/website/ts/components/fill_order.tsx @@ -323,7 +323,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> { return ( <div> Order successfully filled. See the trade details in your{' '} - <Link to={`${WebsitePaths.Portal}/trades`} style={{ color: colors.white }}> + <Link to={`${WebsitePaths.Portal}/trades`} fontColor={colors.white}> trade history </Link> </div> diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index 02770c073..d90f2f708 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -12,11 +12,6 @@ import { Translate } from 'ts/utils/translate'; const ICON_DIMENSION = 16; -const linkStyle = { - color: colors.white, - cursor: 'pointer', -}; - const languageToMenuTitle = { [Language.English]: 'English', [Language.Russian]: 'Русский', @@ -187,7 +182,7 @@ export class Footer extends React.Component<FooterProps, FooterState> { const iconIfExists = titleToIcon[link.title]; return ( <div key={link.title} className="sm-center" style={{ fontSize: 13, paddingTop: 25 }}> - <Link to={link.to} type={link.type} style={linkStyle} className="text-decoration-none"> + <Link to={link.to} type={link.type} fontColor={colors.white} className="text-decoration-none"> <div> {!_.isUndefined(iconIfExists) ? ( <div className="inline-block"> diff --git a/packages/website/ts/components/inputs/token_amount_input.tsx b/packages/website/ts/components/inputs/token_amount_input.tsx index 562f670e2..134d1cc76 100644 --- a/packages/website/ts/components/inputs/token_amount_input.tsx +++ b/packages/website/ts/components/inputs/token_amount_input.tsx @@ -111,7 +111,8 @@ export class TokenAmountInput extends React.Component<TokenAmountInputProps, Tok Insufficient allowance.{' '} <Link to={`${WebsitePaths.Portal}/account`} - style={{ cursor: 'pointer', color: colors.darkestGrey, textDecoration: 'underline' }} + textDecoration="underline" + fontColor={colors.darkestGrey} > Set allowance </Link> diff --git a/packages/website/ts/components/top_bar/top_bar_menu_item.tsx b/packages/website/ts/components/top_bar/top_bar_menu_item.tsx index d5ee96850..c88db95fa 100644 --- a/packages/website/ts/components/top_bar/top_bar_menu_item.tsx +++ b/packages/website/ts/components/top_bar/top_bar_menu_item.tsx @@ -37,7 +37,7 @@ export class TopBarMenuItem extends React.Component<TopBarMenuItemProps, TopBarM ); return ( <div className={`center ${this.props.className}`} style={{ ...this.props.style, color: menuItemColor }}> - <Link to={this.props.path} type={this.props.linkType} style={{ color: linkColor }}> + <Link to={this.props.path} type={this.props.linkType} fontColor={linkColor}> {itemContent} </Link> </div> diff --git a/packages/website/ts/components/ui/custom_menu_item.tsx b/packages/website/ts/components/ui/custom_menu_item.tsx index 11f61b336..c25da6be6 100644 --- a/packages/website/ts/components/ui/custom_menu_item.tsx +++ b/packages/website/ts/components/ui/custom_menu_item.tsx @@ -4,7 +4,6 @@ import * as React from 'react'; interface CustomMenuItemProps { to: string; - style?: React.CSSProperties; onClick?: () => void; className?: string; } @@ -30,7 +29,7 @@ export class CustomMenuItem extends React.Component<CustomMenuItemProps, CustomM opacity: this.state.isHovering ? 0.5 : 1, }; return ( - <Link to={this.props.to} style={this.props.style}> + <Link to={this.props.to}> <div onClick={this.props.onClick.bind(this)} className={`mx-auto ${this.props.className}`} diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx index f9d7456c1..2fbd946ae 100644 --- a/packages/website/ts/pages/about/about.tsx +++ b/packages/website/ts/pages/about/about.tsx @@ -376,7 +376,7 @@ export class About extends React.Component<AboutProps, AboutState> { }} > We are seeking outstanding candidates to{' '} - <Link to={WebsitePaths.Careers} style={{ color: 'black', textDecoration: 'underline' }}> + <Link to={WebsitePaths.Careers} textDecoration="underline" fontColor="black"> join our team </Link> . We value passion, diversity and unique perspectives. diff --git a/packages/website/ts/pages/documentation/home.tsx b/packages/website/ts/pages/documentation/home.tsx index 7e34136a8..abe0ae6af 100644 --- a/packages/website/ts/pages/documentation/home.tsx +++ b/packages/website/ts/pages/documentation/home.tsx @@ -446,12 +446,14 @@ export class Home extends React.Component<HomeProps, HomeState> { <Container borderBottom={this.state.isSidebarScrolling ? `1px solid ${colors.grey300}` : 'none'} > - <DocsLogo height={36} containerStyle={{ paddingTop: 30, paddingBottom: 10 }} /> + <Container paddingTop="30px" paddingLeft="10px" paddingBottom="8px"> + <DocsLogo height={36} /> + </Container> </Container> <div style={{ ...scrollableContainerStyles, - paddingTop: 35, + paddingTop: 27, overflow: this.state.isHoveringSidebar ? 'auto' : 'hidden', }} onMouseEnter={this._onSidebarHover.bind(this, true)} @@ -557,7 +559,7 @@ export class Home extends React.Component<HomeProps, HomeState> { <Container className="md-col lg-col md-col-4 lg-col-4"> <Link to={pkg.link.to} - style={{ color: colors.lightLinkBlue }} + fontColor={colors.lightLinkBlue} type={pkg.link.type} shouldOpenInNewTab={!!pkg.link.shouldOpenInNewTab} > @@ -578,23 +580,24 @@ export class Home extends React.Component<HomeProps, HomeState> { </Text> </Container> <Container className="md-col lg-col md-col-2 lg-col-2 sm-pb2 relative"> - <Link - to={pkg.link.to} - className="absolute" - style={{ right: 0, color: colors.lightLinkBlue }} - type={pkg.link.type} - shouldOpenInNewTab={!!pkg.link.shouldOpenInNewTab} - > - <Container className="flex"> - <Container>{this.props.translate.get(Key.More, Deco.Cap)}</Container> - <Container paddingTop="1px" paddingLeft="6px"> - <i - className="zmdi zmdi-chevron-right bold" - style={{ fontSize: 18, color: colors.lightLinkBlue }} - /> + <Container position="absolute" right="0px"> + <Link + to={pkg.link.to} + fontColor={colors.lightLinkBlue} + type={pkg.link.type} + shouldOpenInNewTab={!!pkg.link.shouldOpenInNewTab} + > + <Container className="flex"> + <Container>{this.props.translate.get(Key.More, Deco.Cap)}</Container> + <Container paddingTop="1px" paddingLeft="6px"> + <i + className="zmdi zmdi-chevron-right bold" + style={{ fontSize: 18, color: colors.lightLinkBlue }} + /> + </Container> </Container> - </Container> - </Link> + </Link> + </Container> </Container> </Container> </Container> diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index c819cd8a1..395cdabf8 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -317,10 +317,7 @@ export class Landing extends React.Component<LandingProps, LandingState> { }} > {this.props.translate.get(Key.FullListPrompt)}{' '} - <Link - to={WebsitePaths.Portal} - style={{ color: colors.landingLinkGrey, textDecoration: 'underline' }} - > + <Link to={WebsitePaths.Portal} textDecoration="underline" fontColor={colors.landingLinkGrey}> {this.props.translate.get(Key.FullListLink)} </Link> </div> |