aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/components/aboutPageLayout.tsx23
-rw-r--r--packages/website/ts/components/animatedChatIcon.tsx5
-rw-r--r--packages/website/ts/components/banner.tsx5
-rw-r--r--packages/website/ts/components/button.tsx5
-rw-r--r--packages/website/ts/components/definition.tsx10
-rw-r--r--packages/website/ts/components/dialogs/blockchain_err_dialog.tsx8
-rw-r--r--packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx27
-rw-r--r--packages/website/ts/components/fill_order.tsx17
-rw-r--r--packages/website/ts/components/fill_warning_dialog.tsx3
-rw-r--r--packages/website/ts/components/hamburger.tsx10
-rw-r--r--packages/website/ts/components/header.tsx49
-rw-r--r--packages/website/ts/components/hero.tsx15
-rw-r--r--packages/website/ts/components/icon.tsx10
-rw-r--r--packages/website/ts/components/image.tsx5
-rw-r--r--packages/website/ts/components/link.tsx5
-rw-r--r--packages/website/ts/components/logo.tsx5
-rw-r--r--packages/website/ts/components/mobileNav.tsx15
-rw-r--r--packages/website/ts/components/modals/input.tsx5
-rw-r--r--packages/website/ts/components/modals/modal_contact.tsx16
-rw-r--r--packages/website/ts/components/nested_sidebar_menu.tsx4
-rw-r--r--packages/website/ts/components/newLayout.tsx30
-rw-r--r--packages/website/ts/components/newsletter_form.tsx26
-rw-r--r--packages/website/ts/components/portal/portal.tsx3
-rw-r--r--packages/website/ts/components/sections/landing/clients.tsx7
-rw-r--r--packages/website/ts/components/siteWrap.tsx5
-rw-r--r--packages/website/ts/components/text.tsx10
-rw-r--r--packages/website/ts/components/token_balances.tsx11
-rw-r--r--packages/website/ts/components/ui/party.tsx50
-rw-r--r--packages/website/ts/constants/globalStyle.tsx4
-rw-r--r--packages/website/ts/containers/asset_buyer_documentation.ts7
-rw-r--r--packages/website/ts/containers/connect_documentation.ts7
-rw-r--r--packages/website/ts/containers/contract_wrappers_documentation.ts7
-rw-r--r--packages/website/ts/containers/docs_home.ts7
-rw-r--r--packages/website/ts/containers/ethereum_types_documentation.ts7
-rw-r--r--packages/website/ts/containers/faq.ts5
-rw-r--r--packages/website/ts/containers/json_schemas_documentation.ts7
-rw-r--r--packages/website/ts/containers/migrations_documentation.ts7
-rw-r--r--packages/website/ts/containers/not_found.ts7
-rw-r--r--packages/website/ts/containers/order_utils_documentation.ts7
-rw-r--r--packages/website/ts/containers/order_watcher_documentation.ts7
-rw-r--r--packages/website/ts/containers/portal.ts7
-rw-r--r--packages/website/ts/containers/smart_contracts_documentation.ts7
-rw-r--r--packages/website/ts/containers/sol_compiler_documentation.ts7
-rw-r--r--packages/website/ts/containers/subproviders_documentation.ts7
-rw-r--r--packages/website/ts/containers/web3_wrapper_documentation.ts7
-rw-r--r--packages/website/ts/containers/wiki.ts5
-rw-r--r--packages/website/ts/containers/zero_ex_js_documentation.ts7
-rw-r--r--packages/website/ts/pages/about/jobs.tsx4
-rw-r--r--packages/website/ts/pages/documentation/developers_page.tsx10
-rw-r--r--packages/website/ts/pages/faq/faq.tsx20
-rw-r--r--packages/website/ts/pages/instant.tsx50
-rw-r--r--packages/website/ts/pages/instant/config_generator.tsx7
-rw-r--r--packages/website/ts/pages/why.tsx11
53 files changed, 256 insertions, 356 deletions
diff --git a/packages/website/ts/components/aboutPageLayout.tsx b/packages/website/ts/components/aboutPageLayout.tsx
index a2fd9dd72..51c1a661e 100644
--- a/packages/website/ts/components/aboutPageLayout.tsx
+++ b/packages/website/ts/components/aboutPageLayout.tsx
@@ -38,18 +38,17 @@ export const AboutPageLayout = (props: Props) => (
{props.description}
</AnimatedParagraph>
- {props.linkLabel &&
- (props.href || props.to) && (
- <AnimatedLink
- to={props.to}
- href={props.href}
- target={!_.isUndefined(props.href) ? '_blank' : undefined}
- isWithArrow={true}
- isAccentColor={true}
- >
- {props.linkLabel}
- </AnimatedLink>
- )}
+ {props.linkLabel && (props.href || props.to) && (
+ <AnimatedLink
+ to={props.to}
+ href={props.href}
+ target={!_.isUndefined(props.href) ? '_blank' : undefined}
+ isWithArrow={true}
+ isAccentColor={true}
+ >
+ {props.linkLabel}
+ </AnimatedLink>
+ )}
</Column>
</Column>
</Section>
diff --git a/packages/website/ts/components/animatedChatIcon.tsx b/packages/website/ts/components/animatedChatIcon.tsx
index 9a86e244c..770536259 100644
--- a/packages/website/ts/components/animatedChatIcon.tsx
+++ b/packages/website/ts/components/animatedChatIcon.tsx
@@ -98,9 +98,6 @@ const Rays = styled.g`
transform-origin: 50% 50%;
`;
-const Dot =
- styled.circle <
- { delay: number } >
- `
+const Dot = styled.circle<{ delay: number }>`
animation: ${fadeInOut} 4s ${props => `${props.delay}s`} infinite;
`;
diff --git a/packages/website/ts/components/banner.tsx b/packages/website/ts/components/banner.tsx
index 76fc1d09e..ce3fd499a 100644
--- a/packages/website/ts/components/banner.tsx
+++ b/packages/website/ts/components/banner.tsx
@@ -123,10 +123,7 @@ const ButtonWrap = styled.div`
// Note let's refactor this
// is it absolutely necessary to have a stateless component
// to pass props down into the styled icon?
-const Border =
- styled.div <
- BorderProps >
- `
+const Border = styled.div<BorderProps>`
position: absolute;
background-image: ${props =>
props.isBottom ? 'url(/images/banner/bottomofcta.png);' : 'url(/images/banner/topofcta.png);'};
diff --git a/packages/website/ts/components/button.tsx b/packages/website/ts/components/button.tsx
index 569038ae0..31a74e599 100644
--- a/packages/website/ts/components/button.tsx
+++ b/packages/website/ts/components/button.tsx
@@ -58,10 +58,7 @@ Button.defaultProps = {
borderColor: 'rgba(255, 255, 255, .4)',
};
-const ButtonBase =
- styled.button <
- ButtonInterface >
- `
+const ButtonBase = styled.button<ButtonInterface>`
appearance: none;
border: 1px solid transparent;
display: inline-block;
diff --git a/packages/website/ts/components/definition.tsx b/packages/website/ts/components/definition.tsx
index 92fe54f38..bd7a40425 100644
--- a/packages/website/ts/components/definition.tsx
+++ b/packages/website/ts/components/definition.tsx
@@ -69,10 +69,7 @@ export const Definition = (props: Props) => (
</Wrap>
);
-const Wrap =
- styled.div <
- Props >
- `
+const Wrap = styled.div<Props>`
max-width: ${props => props.isInline && '354px'};
& + & {
@@ -97,10 +94,7 @@ const Wrap =
}
`;
-const TextWrap =
- styled.div <
- Props >
- `
+const TextWrap = styled.div<Props>`
width: 100%;
max-width: 560px;
diff --git a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx
index a0114d898..1c47903db 100644
--- a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx
+++ b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx
@@ -148,15 +148,17 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp
If you are using{' '}
<a href={constants.URL_METAMASK_CHROME_STORE} target="_blank">
Metamask
- </a>, you can switch networks in the top left corner of the extension popover.
+ </a>
+ , you can switch networks in the top left corner of the extension popover.
</div>
<h4>Parity Signer</h4>
<div>
If using the{' '}
<a href={constants.URL_PARITY_CHROME_STORE} target="_blank">
Parity Signer Chrome extension
- </a>, make sure to start your local Parity node with `parity ui` or `parity --chain Kovan ui` in
- order to connect to mainnet \ or Kovan respectively.
+ </a>
+ , make sure to start your local Parity node with `parity ui` or `parity --chain Kovan ui` in order
+ to connect to mainnet \ or Kovan respectively.
</div>
</div>
);
diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
index 9b9421f1a..5ca272b1a 100644
--- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
+++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
@@ -111,20 +111,19 @@ export class EthWethConversionDialog extends React.Component<
)}
<div className="pt1" style={{ fontSize: 12 }}>
<div className="left">1 ETH = 1 WETH</div>
- {this.props.direction === Side.Receive &&
- this.state.isEthTokenBalanceLoaded && (
- <div
- className="right"
- onClick={this._onMaxClick.bind(this)}
- style={{
- color: colors.darkBlue,
- textDecoration: 'underline',
- cursor: 'pointer',
- }}
- >
- Max
- </div>
- )}
+ {this.props.direction === Side.Receive && this.state.isEthTokenBalanceLoaded && (
+ <div
+ className="right"
+ onClick={this._onMaxClick.bind(this)}
+ style={{
+ color: colors.darkBlue,
+ textDecoration: 'underline',
+ cursor: 'pointer',
+ }}
+ >
+ Max
+ </div>
+ )}
</div>
</div>
</div>
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 3d0203573..2fa2b94a0 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -173,15 +173,14 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
private _renderOrderJsonNotices(): React.ReactNode {
return (
<div>
- {!_.isUndefined(this.props.initialOrder) &&
- !this.state.didOrderValidationRun && (
- <div className="pt2">
- <span className="pr1">
- <i className="zmdi zmdi-spinner zmdi-hc-spin" />
- </span>
- <span>Validating order...</span>
- </div>
- )}
+ {!_.isUndefined(this.props.initialOrder) && !this.state.didOrderValidationRun && (
+ <div className="pt2">
+ <span className="pr1">
+ <i className="zmdi zmdi-spinner zmdi-hc-spin" />
+ </span>
+ <span>Validating order...</span>
+ </div>
+ )}
{!_.isEmpty(this.state.orderJSONErrMsg) && (
<Alert type={AlertTypes.ERROR} message={this.state.orderJSONErrMsg} />
)}
diff --git a/packages/website/ts/components/fill_warning_dialog.tsx b/packages/website/ts/components/fill_warning_dialog.tsx
index feb72c2ee..5be09e6c2 100644
--- a/packages/website/ts/components/fill_warning_dialog.tsx
+++ b/packages/website/ts/components/fill_warning_dialog.tsx
@@ -37,7 +37,8 @@ export const FillWarningDialog = (props: FillWarningDialogProps) => {
be counterfeit. It is your responsibility to verify the token addresses on Etherscan (
<a href="https://0x.org/wiki#Verifying-Custom-Tokens" target="_blank">
See this how-to guide
- </a>) before filling an order. <b>This action may result in the loss of funds</b>.
+ </a>
+ ) before filling an order. <b>This action may result in the loss of funds</b>.
</div>
</div>
</Dialog>
diff --git a/packages/website/ts/components/hamburger.tsx b/packages/website/ts/components/hamburger.tsx
index 435d206cd..34d4ccc46 100644
--- a/packages/website/ts/components/hamburger.tsx
+++ b/packages/website/ts/components/hamburger.tsx
@@ -16,10 +16,7 @@ export const Hamburger: React.FunctionComponent<Props> = (props: Props) => {
);
};
-const StyledHamburger =
- styled.button <
- Props >
- `
+const StyledHamburger = styled.button<Props>`
background: none;
border: 0;
width: 22px;
@@ -41,9 +38,8 @@ const StyledHamburger =
height: 2px;
margin-bottom: 5px;
transform-origin: 4px 0px;
- transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
- background-color 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
- opacity 0.55s ease;
+ transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),
+ background-color 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
&:first-child {
//transform-origin: 0% 0%;
diff --git a/packages/website/ts/components/header.tsx b/packages/website/ts/components/header.tsx
index 90e097070..088f41048 100644
--- a/packages/website/ts/components/header.tsx
+++ b/packages/website/ts/components/header.tsx
@@ -87,7 +87,9 @@ class HeaderBase extends React.Component<HeaderProps> {
</Link>
<NavLinks>
- {_.map(navItems, (link, index) => <NavItem key={`navlink-${index}`} link={link} />)}
+ {_.map(navItems, (link, index) => (
+ <NavItem key={`navlink-${index}`} link={link} />
+ ))}
</NavLinks>
<MediaQuery minWidth={990}>
@@ -130,10 +132,7 @@ const NavItem = (props: { link: NavItemProps; key: string }) => {
);
};
-const StyledHeader =
- styled.header <
- HeaderProps >
- `
+const StyledHeader = styled.header<HeaderProps>`
padding: 30px;
background-color: ${props => props.theme.bgColor};
`;
@@ -200,10 +199,7 @@ const NavLinks = styled.ul`
}
`;
-const DropdownWrap =
- styled.div <
- DropdownWrapInterface >
- `
+const DropdownWrap = styled.div<DropdownWrapInterface>`
width: ${props => props.width || 280}px;
padding: 15px 0;
border: 1px solid transparent;
@@ -219,27 +215,28 @@ const DropdownWrap =
transition: opacity 0.35s, transform 0.35s, visibility 0s 0.35s;
z-index: 20;
- &:after, &:before {
- bottom: 100%;
- left: 50%;
- border: solid transparent;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none;
+ &:after,
+ &:before {
+ bottom: 100%;
+ left: 50%;
+ border: solid transparent;
+ content: ' ';
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
}
&:after {
- border-color: rgba(255, 255, 255, 0);
- border-bottom-color: ${props => props.theme.dropdownBg};
- border-width: 10px;
- margin-left: -10px;
+ border-color: rgba(255, 255, 255, 0);
+ border-bottom-color: ${props => props.theme.dropdownBg};
+ border-width: 10px;
+ margin-left: -10px;
}
&:before {
- border-color: rgba(255, 0, 0, 0);
- border-bottom-color: ${props => props.theme.dropdownBorderColor};
- border-width: 11px;
- margin-left: -11px;
+ border-color: rgba(255, 0, 0, 0);
+ border-bottom-color: ${props => props.theme.dropdownBorderColor};
+ border-width: 11px;
+ margin-left: -11px;
}
@media (max-width: 768px) {
diff --git a/packages/website/ts/components/hero.tsx b/packages/website/ts/components/hero.tsx
index a662ee3a5..c326e0292 100644
--- a/packages/website/ts/components/hero.tsx
+++ b/packages/website/ts/components/hero.tsx
@@ -28,10 +28,7 @@ interface WrapProps {
isFullWidth?: boolean;
isCenteredMobile?: boolean;
}
-const Wrap =
- styled.div <
- WrapProps >
- `
+const Wrap = styled.div<WrapProps>`
width: calc(100% - 60px);
margin: 0 auto;
@@ -53,10 +50,7 @@ interface TitleProps {
isLarge?: any;
maxWidth?: string;
}
-const Title =
- styled.h1 <
- TitleProps >
- `
+const Title = styled.h1<TitleProps>`
font-size: ${props => (props.isLarge ? '80px' : '50px')};
font-weight: 300;
line-height: 1.1;
@@ -87,10 +81,7 @@ const Description = styled.p`
}
`;
-const Content =
- styled.div <
- { width: string } >
- `
+const Content = styled.div<{ width: string }>`
width: 100%;
@media (min-width: 768px) {
diff --git a/packages/website/ts/components/icon.tsx b/packages/website/ts/components/icon.tsx
index 165e999b9..60e4d04ee 100644
--- a/packages/website/ts/components/icon.tsx
+++ b/packages/website/ts/components/icon.tsx
@@ -32,10 +32,7 @@ export const Icon: React.FunctionComponent<IconProps> = (props: IconProps) => {
return null;
};
-export const InlineIconWrap =
- styled.div <
- PaddingInterface >
- `
+export const InlineIconWrap = styled.div<PaddingInterface>`
margin: ${props => getCSSPadding(props.margin)};
display: flex;
align-items: center;
@@ -54,10 +51,7 @@ const _getSize = (size: string | number = 'small'): string => {
return `${size}px`;
};
-const StyledIcon =
- styled.figure <
- IconProps >
- `
+const StyledIcon = styled.figure<IconProps>`
width: ${props => _getSize(props.size)};
height: ${props => _getSize(props.size)};
margin: ${props => getCSSPadding(props.margin)};
diff --git a/packages/website/ts/components/image.tsx b/packages/website/ts/components/image.tsx
index 65b2a9705..0137cfc97 100644
--- a/packages/website/ts/components/image.tsx
+++ b/packages/website/ts/components/image.tsx
@@ -12,9 +12,6 @@ const ImageClass: React.FunctionComponent<Props> = (props: Props) => {
return <img {...props} />;
};
-export const Image =
- styled(ImageClass) <
- Props >
- `
+export const Image = styled(ImageClass)<Props>`
margin: ${props => props.isCentered && `0 auto`};
`;
diff --git a/packages/website/ts/components/link.tsx b/packages/website/ts/components/link.tsx
index 080a0abcc..a66985acc 100644
--- a/packages/website/ts/components/link.tsx
+++ b/packages/website/ts/components/link.tsx
@@ -44,10 +44,7 @@ export const LinkWrap = styled.div`
}
`;
-const StyledLink =
- styled(SmartLink) <
- LinkInterface >
- `
+const StyledLink = styled(SmartLink)<LinkInterface>`
display: ${props => !props.isBlock && 'inline-flex'};
color: ${props => props.color || props.theme.linkColor};
text-align: center;
diff --git a/packages/website/ts/components/logo.tsx b/packages/website/ts/components/logo.tsx
index 19aeb901e..f89be0711 100644
--- a/packages/website/ts/components/logo.tsx
+++ b/packages/website/ts/components/logo.tsx
@@ -23,10 +23,7 @@ const StyledLogo = styled.div`
}
`;
-const Icon =
- styled(LogoIcon) <
- LogoInterface >
- `
+const Icon = styled(LogoIcon)<LogoInterface>`
flex-shrink: 0;
path {
diff --git a/packages/website/ts/components/mobileNav.tsx b/packages/website/ts/components/mobileNav.tsx
index 573d21596..d43bbe50e 100644
--- a/packages/website/ts/components/mobileNav.tsx
+++ b/packages/website/ts/components/mobileNav.tsx
@@ -55,10 +55,7 @@ export class MobileNav extends React.PureComponent<Props> {
}
}
-const Wrap =
- styled.nav <
- { isToggled: boolean } >
- `
+const Wrap = styled.nav<{ isToggled: boolean }>`
width: 100%;
height: 357px;
background-color: ${props => props.theme.mobileNavBgUpper};
@@ -99,19 +96,13 @@ const Overlay = styled.div`
interface SectionProps {
isDark?: boolean;
}
-const Section =
- styled.div <
- SectionProps >
- `
+const Section = styled.div<SectionProps>`
width: 100%;
padding: 15px 30px;
background-color: ${props => (props.isDark ? props.theme.mobileNavBgLower : 'transparent')};
`;
-const Grid =
- styled(WrapGrid) <
- WrapProps >
- `
+const Grid = styled(WrapGrid)<WrapProps>`
justify-content: flex-start;
li {
diff --git a/packages/website/ts/components/modals/input.tsx b/packages/website/ts/components/modals/input.tsx
index 8cfcc9763..c72e53aa0 100644
--- a/packages/website/ts/components/modals/input.tsx
+++ b/packages/website/ts/components/modals/input.tsx
@@ -60,10 +60,7 @@ const StyledInput = styled.input`
}
`;
-const InputWrapper =
- styled.div <
- InputProps >
- `
+const InputWrapper = styled.div<InputProps>`
position: relative;
flex-grow: ${props => props.width === InputWidth.Full && 1};
width: ${props => props.width === InputWidth.Half && `calc(50% - 15px)`};
diff --git a/packages/website/ts/components/modals/modal_contact.tsx b/packages/website/ts/components/modals/modal_contact.tsx
index 7414df7d9..62c1062a3 100644
--- a/packages/website/ts/components/modals/modal_contact.tsx
+++ b/packages/website/ts/components/modals/modal_contact.tsx
@@ -361,28 +361,22 @@ const StyledDialogContent = styled(DialogContent)`
}
`;
-const Form =
- styled.form <
- FormProps >
- `
+const Form = styled.form<FormProps>`
position: relative;
- transition: opacity 0.30s ease-in-out, visibility 0.30s ease-in-out;
+ transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
opacity: ${props => props.isSuccessful && `0`};
visibility: ${props => props.isSuccessful && `hidden`};
`;
-const Confirmation =
- styled.div <
- FormProps >
- `
+const Confirmation = styled.div<FormProps>`
position: absolute;
top: 50%;
text-align: center;
width: 100%;
left: 0;
- transition: opacity 0.30s ease-in-out, visibility 0.30s ease-in-out;
- transition-delay: 0.40s;
+ transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
+ transition-delay: 0.4s;
padding: 60px 60px;
transform: translateY(-50%);
opacity: ${props => (props.isSuccessful ? `1` : `0`)};
diff --git a/packages/website/ts/components/nested_sidebar_menu.tsx b/packages/website/ts/components/nested_sidebar_menu.tsx
index 4d4bc4617..56df880f3 100644
--- a/packages/website/ts/components/nested_sidebar_menu.tsx
+++ b/packages/website/ts/components/nested_sidebar_menu.tsx
@@ -77,8 +77,8 @@ export class MenuItem extends React.Component<MenuItemProps, MenuItemState> {
isActive
? colors.lightLinkBlue
: this.props.screenWidth === ScreenWidths.Sm
- ? 'white'
- : colors.grey100
+ ? 'white'
+ : colors.grey100
}
fontSize="14px"
textAlign="left"
diff --git a/packages/website/ts/components/newLayout.tsx b/packages/website/ts/components/newLayout.tsx
index 28e7653c5..07691a02a 100644
--- a/packages/website/ts/components/newLayout.tsx
+++ b/packages/website/ts/components/newLayout.tsx
@@ -54,10 +54,7 @@ export const Section: React.FunctionComponent<SectionProps> = (props: SectionPro
);
};
-export const Column =
- styled.div <
- ColumnProps >
- `
+export const Column = styled.div<ColumnProps>`
width: ${props => props.width};
max-width: ${props => props.maxWidth};
padding: ${props => props.padding};
@@ -71,10 +68,7 @@ export const Column =
}
`;
-export const FlexWrap =
- styled.div <
- FlexProps >
- `
+export const FlexWrap = styled.div<FlexProps>`
max-width: 1500px;
margin: 0 auto;
padding: ${props => props.padding};
@@ -85,18 +79,12 @@ export const FlexWrap =
}
`;
-export const WrapSticky =
- styled.div <
- WrapProps >
- `
+export const WrapSticky = styled.div<WrapProps>`
position: sticky;
top: ${props => props.offsetTop || '60px'};
`;
-const SectionBase =
- styled.section <
- SectionProps >
- `
+const SectionBase = styled.section<SectionProps>`
width: ${props => !props.isFullWidth && 'calc(100% - 60px)'};
max-width: 1500px;
margin: 0 auto;
@@ -110,10 +98,7 @@ const SectionBase =
}
`;
-const Wrap =
- styled(FlexWrap) <
- WrapProps >
- `
+const Wrap = styled(FlexWrap)<WrapProps>`
width: ${props => props.wrapWidth || 'calc(100% - 60px)'};
width: ${props => props.bgColor && 'calc(100% - 60px)'};
max-width: ${props => !props.isFullWidth && (props.maxWidth || '895px')};
@@ -121,10 +106,7 @@ const Wrap =
margin: 0 auto;
`;
-export const WrapGrid =
- styled(Wrap) <
- WrapProps >
- `
+export const WrapGrid = styled(Wrap)<WrapProps>`
display: flex;
flex-wrap: ${props => props.isWrapped && `wrap`};
justify-content: ${props => (props.isCentered ? `center` : 'space-between')};
diff --git a/packages/website/ts/components/newsletter_form.tsx b/packages/website/ts/components/newsletter_form.tsx
index bd61e3f4d..e5fd95646 100644
--- a/packages/website/ts/components/newsletter_form.tsx
+++ b/packages/website/ts/components/newsletter_form.tsx
@@ -117,10 +117,7 @@ const StyledForm = styled.form`
margin-top: 27px;
`;
-const StyledInput =
- styled.input <
- InputProps >
- `
+const StyledInput = styled.input<InputProps>`
appearance: none;
background-color: transparent;
border: 0;
@@ -132,7 +129,7 @@ const StyledInput =
width: 100%;
&::placeholder {
- color: #B1B1B1; // #9D9D9D on light theme
+ color: #b1b1b1; // #9D9D9D on light theme
}
`;
@@ -140,14 +137,11 @@ const InputWrapper = styled.div`
position: relative;
`;
-const InnerInputWrapper =
- styled.div <
- ArrowProps >
- `
+const InnerInputWrapper = styled.div<ArrowProps>`
opacity: ${props => props.isSubmitted && 0};
visibility: ${props => props.isSubmitted && 'hidden'};
transition: opacity 0.25s ease-in-out, visibility 0.25s ease-in-out;
- transition-delay: 0.30s;
+ transition-delay: 0.3s;
`;
const SubmitButton = styled.button`
@@ -174,11 +168,8 @@ const Text = styled.p`
margin-top: 15px;
`;
-const SuccessText =
- styled.p <
- ArrowProps >
- `
- color: #B1B1B1;
+const SuccessText = styled.p<ArrowProps>`
+ color: #b1b1b1;
font-size: 1rem;
font-weight: 300;
line-height: 1.2em;
@@ -194,10 +185,7 @@ const SuccessText =
transition-delay: 0.55s;
`;
-const Arrow =
- styled.svg <
- ArrowProps >
- `
+const Arrow = styled.svg<ArrowProps>`
transform: ${props => props.isSubmitted && `translateX(44px)`};
transition: transform 0.25s ease-in-out;
`;
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 94ab63ac6..6d7c90573 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -447,7 +447,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
render={this._renderAccountManagementItem.bind(this, item)}
/>
);
- })}}
+ })}
+ }
<Route render={this._renderNotFoundMessage.bind(this)} />
</Switch>
<PortalDisclaimerDialog
diff --git a/packages/website/ts/components/sections/landing/clients.tsx b/packages/website/ts/components/sections/landing/clients.tsx
index 9a68fbf4c..4d83a1d2f 100644
--- a/packages/website/ts/components/sections/landing/clients.tsx
+++ b/packages/website/ts/components/sections/landing/clients.tsx
@@ -86,10 +86,7 @@ export const SectionLandingClients = () => (
</Section>
);
-const StyledProject =
- styled.div <
- StyledProjectInterface >
- `
+const StyledProject = styled.div<StyledProjectInterface>`
flex-shrink: 0;
img {
@@ -99,7 +96,7 @@ const StyledProject =
}
@media (min-width: 768px) {
- width: auto;
+ width: auto;
height: 50px;
margin: 30px;
}
diff --git a/packages/website/ts/components/siteWrap.tsx b/packages/website/ts/components/siteWrap.tsx
index 316896dbb..1f0902105 100644
--- a/packages/website/ts/components/siteWrap.tsx
+++ b/packages/website/ts/components/siteWrap.tsx
@@ -140,10 +140,7 @@ export class SiteWrap extends React.Component<Props, State> {
}
}
-const Main =
- styled.main <
- MainProps >
- `
+const Main = styled.main<MainProps>`
transition: transform 0.5s, opacity 0.5s;
opacity: ${props => props.isNavToggled && '0.5'};
`;
diff --git a/packages/website/ts/components/text.tsx b/packages/website/ts/components/text.tsx
index 10f272e73..a47e61ef3 100644
--- a/packages/website/ts/components/text.tsx
+++ b/packages/website/ts/components/text.tsx
@@ -27,10 +27,7 @@ interface ParagraphProps extends BaseTextInterface {
fontWeight?: string | number;
}
-const StyledHeading =
- styled.h1 <
- HeadingProps >
- `
+const StyledHeading = styled.h1<HeadingProps>`
max-width: ${props => props.maxWidth};
color: ${props => props.color || props.theme.textColor};
display: ${props => props.isFlex && `inline-flex`};
@@ -64,10 +61,7 @@ Heading.defaultProps = {
// Note: this would be useful to be implemented the same way was "Heading"
// and be more generic. e.g. <Text /> with a props asElement so we can use it
// for literally anything =
-export const Paragraph =
- styled.p <
- ParagraphProps >
- `
+export const Paragraph = styled.p<ParagraphProps>`
font-size: ${props => `var(--${props.size || 'default'}Paragraph)`};
font-weight: ${props => props.fontWeight || 300};
margin-bottom: ${props => !props.isNoMargin && (props.marginBottom || '30px')};
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 92aecf046..2ed0229c8 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -354,12 +354,11 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
{tokenState.isLoaded ? (
<span>
{this._renderAmount(tokenState.balance, token.decimals)} {token.symbol}
- {this.state.isZRXSpinnerVisible &&
- token.symbol === ZRX_TOKEN_SYMBOL && (
- <span className="pl1">
- <i className="zmdi zmdi-spinner zmdi-hc-spin" />
- </span>
- )}
+ {this.state.isZRXSpinnerVisible && token.symbol === ZRX_TOKEN_SYMBOL && (
+ <span className="pl1">
+ <i className="zmdi zmdi-spinner zmdi-hc-spin" />
+ </span>
+ )}
</span>
) : (
<i className="zmdi zmdi-spinner zmdi-hc-spin" />
diff --git a/packages/website/ts/components/ui/party.tsx b/packages/website/ts/components/ui/party.tsx
index f9e0967d4..a14b94d8a 100644
--- a/packages/website/ts/components/ui/party.tsx
+++ b/packages/website/ts/components/ui/party.tsx
@@ -94,14 +94,17 @@ export class Party extends React.Component<PartyProps, PartyState> {
<ReactTooltip id={registeredTooltipId}>
{isRegistered ? (
<div>
- This token address was found in the token registry<br />
+ This token address was found in the token registry
+ <br />
smart contract and is therefore believed to be a<br />
legitimate token.
</div>
) : (
<div>
- This token is not included in the token registry<br />
- smart contract. We cannot guarantee the legitimacy<br />
+ This token is not included in the token registry
+ <br />
+ smart contract. We cannot guarantee the legitimacy
+ <br />
of this token. Make sure to verify its address on Etherscan.
</div>
)}
@@ -109,27 +112,28 @@ export class Party extends React.Component<PartyProps, PartyState> {
</div>
</div>
)}
- {!_.isUndefined(this.props.hasUniqueNameAndSymbol) &&
- !this.props.hasUniqueNameAndSymbol && (
- <div>
- <div
- data-tip={true}
- data-for={uniqueNameAndSymbolTooltipId}
- className="mx-auto"
- style={{ fontSize: 13, width: 127 }}
- >
- <span style={{ color: colors.red500 }}>
- <i className="zmdi zmdi-alert-octagon" />
- </span>{' '}
- <span>Suspicious token</span>
- <ReactTooltip id={uniqueNameAndSymbolTooltipId}>
- This token shares it's name, symbol or both with<br />
- a token in the 0x Token Registry but it has a different<br />
- smart contract address. This is most likely a scam token!
- </ReactTooltip>
- </div>
+ {!_.isUndefined(this.props.hasUniqueNameAndSymbol) && !this.props.hasUniqueNameAndSymbol && (
+ <div>
+ <div
+ data-tip={true}
+ data-for={uniqueNameAndSymbolTooltipId}
+ className="mx-auto"
+ style={{ fontSize: 13, width: 127 }}
+ >
+ <span style={{ color: colors.red500 }}>
+ <i className="zmdi zmdi-alert-octagon" />
+ </span>{' '}
+ <span>Suspicious token</span>
+ <ReactTooltip id={uniqueNameAndSymbolTooltipId}>
+ This token shares it's name, symbol or both with
+ <br />
+ a token in the 0x Token Registry but it has a different
+ <br />
+ smart contract address. This is most likely a scam token!
+ </ReactTooltip>
</div>
- )}
+ </div>
+ )}
</div>
</div>
);
diff --git a/packages/website/ts/constants/globalStyle.tsx b/packages/website/ts/constants/globalStyle.tsx
index 5abb758c5..ef7ec9426 100644
--- a/packages/website/ts/constants/globalStyle.tsx
+++ b/packages/website/ts/constants/globalStyle.tsx
@@ -11,9 +11,7 @@ export interface GlobalStyle {
}
const GlobalStyles = withTheme(
- createGlobalStyle <
- GlobalStyle >
- `
+ createGlobalStyle<GlobalStyle>`
${cssReset};
html {
diff --git a/packages/website/ts/containers/asset_buyer_documentation.ts b/packages/website/ts/containers/asset_buyer_documentation.ts
index 815176e47..a75c6d861 100644
--- a/packages/website/ts/containers/asset_buyer_documentation.ts
+++ b/packages/website/ts/containers/asset_buyer_documentation.ts
@@ -40,6 +40,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/connect_documentation.ts b/packages/website/ts/containers/connect_documentation.ts
index 19fd0ee56..1cfc0702e 100644
--- a/packages/website/ts/containers/connect_documentation.ts
+++ b/packages/website/ts/containers/connect_documentation.ts
@@ -45,6 +45,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/contract_wrappers_documentation.ts b/packages/website/ts/containers/contract_wrappers_documentation.ts
index dec95ae62..bbabce7a7 100644
--- a/packages/website/ts/containers/contract_wrappers_documentation.ts
+++ b/packages/website/ts/containers/contract_wrappers_documentation.ts
@@ -40,6 +40,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/docs_home.ts b/packages/website/ts/containers/docs_home.ts
index e0ca439a6..2a6dac0e2 100644
--- a/packages/website/ts/containers/docs_home.ts
+++ b/packages/website/ts/containers/docs_home.ts
@@ -26,6 +26,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch),
});
-export const DocsHome: React.ComponentClass<DocsHomeProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocsHomeComponent,
-);
+export const DocsHome: React.ComponentClass<DocsHomeProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocsHomeComponent);
diff --git a/packages/website/ts/containers/ethereum_types_documentation.ts b/packages/website/ts/containers/ethereum_types_documentation.ts
index 9b668d515..e6e4d4067 100644
--- a/packages/website/ts/containers/ethereum_types_documentation.ts
+++ b/packages/website/ts/containers/ethereum_types_documentation.ts
@@ -36,6 +36,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/faq.ts b/packages/website/ts/containers/faq.ts
index a2b5735f6..da5b71bdd 100644
--- a/packages/website/ts/containers/faq.ts
+++ b/packages/website/ts/containers/faq.ts
@@ -22,4 +22,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch),
});
-export const FAQ: React.ComponentClass<FAQProps> = connect(mapStateToProps, mapDispatchToProps)(FAQComponent);
+export const FAQ: React.ComponentClass<FAQProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(FAQComponent);
diff --git a/packages/website/ts/containers/json_schemas_documentation.ts b/packages/website/ts/containers/json_schemas_documentation.ts
index 3862ba878..1090265e7 100644
--- a/packages/website/ts/containers/json_schemas_documentation.ts
+++ b/packages/website/ts/containers/json_schemas_documentation.ts
@@ -65,6 +65,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/migrations_documentation.ts b/packages/website/ts/containers/migrations_documentation.ts
index dd5db3ac6..bae84dfea 100644
--- a/packages/website/ts/containers/migrations_documentation.ts
+++ b/packages/website/ts/containers/migrations_documentation.ts
@@ -61,6 +61,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch),
});
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/not_found.ts b/packages/website/ts/containers/not_found.ts
index f384dab89..825c021ec 100644
--- a/packages/website/ts/containers/not_found.ts
+++ b/packages/website/ts/containers/not_found.ts
@@ -22,6 +22,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch),
});
-export const NotFound: React.ComponentClass<NotFoundProps> = connect(mapStateToProps, mapDispatchToProps)(
- NotFoundComponent,
-);
+export const NotFound: React.ComponentClass<NotFoundProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(NotFoundComponent);
diff --git a/packages/website/ts/containers/order_utils_documentation.ts b/packages/website/ts/containers/order_utils_documentation.ts
index 4996c329a..8d83357ca 100644
--- a/packages/website/ts/containers/order_utils_documentation.ts
+++ b/packages/website/ts/containers/order_utils_documentation.ts
@@ -41,6 +41,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/order_watcher_documentation.ts b/packages/website/ts/containers/order_watcher_documentation.ts
index f3d3bada8..149ffdd2a 100644
--- a/packages/website/ts/containers/order_watcher_documentation.ts
+++ b/packages/website/ts/containers/order_watcher_documentation.ts
@@ -41,6 +41,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/portal.ts b/packages/website/ts/containers/portal.ts
index 5661e0a97..db41a3ec3 100644
--- a/packages/website/ts/containers/portal.ts
+++ b/packages/website/ts/containers/portal.ts
@@ -87,6 +87,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch),
});
-export const Portal: React.ComponentClass<PortalComponentProps> = connect(mapStateToProps, mapDispatchToProps)(
- PortalComponent,
-);
+export const Portal: React.ComponentClass<PortalComponentProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(PortalComponent);
diff --git a/packages/website/ts/containers/smart_contracts_documentation.ts b/packages/website/ts/containers/smart_contracts_documentation.ts
index 7c0de5515..d94e285a7 100644
--- a/packages/website/ts/containers/smart_contracts_documentation.ts
+++ b/packages/website/ts/containers/smart_contracts_documentation.ts
@@ -91,6 +91,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/sol_compiler_documentation.ts b/packages/website/ts/containers/sol_compiler_documentation.ts
index e899e9627..31117372b 100644
--- a/packages/website/ts/containers/sol_compiler_documentation.ts
+++ b/packages/website/ts/containers/sol_compiler_documentation.ts
@@ -45,6 +45,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/subproviders_documentation.ts b/packages/website/ts/containers/subproviders_documentation.ts
index c7fb807a6..2ac0360ab 100644
--- a/packages/website/ts/containers/subproviders_documentation.ts
+++ b/packages/website/ts/containers/subproviders_documentation.ts
@@ -44,6 +44,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/web3_wrapper_documentation.ts b/packages/website/ts/containers/web3_wrapper_documentation.ts
index ad286da1a..73fea90ed 100644
--- a/packages/website/ts/containers/web3_wrapper_documentation.ts
+++ b/packages/website/ts/containers/web3_wrapper_documentation.ts
@@ -40,6 +40,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/containers/wiki.ts b/packages/website/ts/containers/wiki.ts
index 069b0ae54..f4f2f6ec6 100644
--- a/packages/website/ts/containers/wiki.ts
+++ b/packages/website/ts/containers/wiki.ts
@@ -25,4 +25,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch),
});
-export const Wiki: React.ComponentClass<WikiProps> = connect(mapStateToProps, mapDispatchToProps)(WikiComponent);
+export const Wiki: React.ComponentClass<WikiProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(WikiComponent);
diff --git a/packages/website/ts/containers/zero_ex_js_documentation.ts b/packages/website/ts/containers/zero_ex_js_documentation.ts
index 5da8d5e52..0e4765656 100644
--- a/packages/website/ts/containers/zero_ex_js_documentation.ts
+++ b/packages/website/ts/containers/zero_ex_js_documentation.ts
@@ -72,6 +72,7 @@ const docsInfoConfig: DocsInfoConfig = {
};
const mapStateToProps = getMapStateToProps(docsInfoConfig);
-export const Documentation: React.ComponentClass<DocPageProps> = connect(mapStateToProps, mapDispatchToProps)(
- DocPageComponent,
-);
+export const Documentation: React.ComponentClass<DocPageProps> = connect(
+ mapStateToProps,
+ mapDispatchToProps,
+)(DocPageComponent);
diff --git a/packages/website/ts/pages/about/jobs.tsx b/packages/website/ts/pages/about/jobs.tsx
index ee1aa6cef..85c25a75f 100644
--- a/packages/website/ts/pages/about/jobs.tsx
+++ b/packages/website/ts/pages/about/jobs.tsx
@@ -151,7 +151,9 @@ export class NextAboutJobs extends React.Component<NextAboutJobsProps, NextAbout
<Section id={OPEN_POSITIONS_HASH} isFlex={true} maxWidth="1170px" wrapWidth="100%">
<Column>
<Heading size="medium">
- Current<br />Openings
+ Current
+ <br />
+ Openings
</Heading>
</Column>
diff --git a/packages/website/ts/pages/documentation/developers_page.tsx b/packages/website/ts/pages/documentation/developers_page.tsx
index 78376a0f2..0b725c514 100644
--- a/packages/website/ts/pages/documentation/developers_page.tsx
+++ b/packages/website/ts/pages/documentation/developers_page.tsx
@@ -68,10 +68,7 @@ interface SidebarContainerProps {
className?: string;
}
-const SidebarContainer =
- styled.div <
- SidebarContainerProps >
- `
+const SidebarContainer = styled.div<SidebarContainerProps>`
${scrollableContainerStyles}
padding-top: 27px;
padding-left: ${SIDEBAR_PADDING}px;
@@ -87,10 +84,7 @@ interface MainContentContainerProps {
className?: string;
}
-const MainContentContainer =
- styled.div <
- MainContentContainerProps >
- `
+const MainContentContainer = styled.div<MainContentContainerProps>`
${scrollableContainerStyles}
padding-top: 0px;
padding-left: 50px;
diff --git a/packages/website/ts/pages/faq/faq.tsx b/packages/website/ts/pages/faq/faq.tsx
index 8cde7224e..548db1d1d 100644
--- a/packages/website/ts/pages/faq/faq.tsx
+++ b/packages/website/ts/pages/faq/faq.tsx
@@ -36,17 +36,16 @@ const sections: FAQSection[] = [
<div>
At its core, 0x is an open and non-rent seeking protocol that facilitates trustless, low
friction exchange of Ethereum-based assets. Developers can use 0x as a platform to build
- exchange applications on top of (<a
- href={`${configs.BASE_URL}${WebsitePaths.ZeroExJs}#introduction`}
- target="blank"
- >
+ exchange applications on top of (
+ <a href={`${configs.BASE_URL}${WebsitePaths.ZeroExJs}#introduction`} target="blank">
0x.js
</a>{' '}
is a Javascript library for interacting with the 0x protocol). For end users, 0x will be the
infrastructure of a wide variety of user-facing applications i.e.{' '}
<a href={`${configs.BASE_URL}${WebsitePaths.Portal}`} target="blank">
0x Portal
- </a>, a decentralized application that facilitates trustless trading of Ethereum-based tokens
+ </a>
+ , a decentralized application that facilitates trustless trading of Ethereum-based tokens
between known counterparties.
</div>
),
@@ -253,7 +252,8 @@ const sections: FAQSection[] = [
target="_blank"
>
development roadmap
- </a>.
+ </a>
+ .
</div>
),
},
@@ -360,7 +360,8 @@ const sections: FAQSection[] = [
target="_blank"
>
here
- </a>.
+ </a>
+ .
</div>
),
},
@@ -380,8 +381,9 @@ const sections: FAQSection[] = [
Join our{' '}
<a href={constants.URL_ZEROEX_CHAT} target="_blank">
Discord
- </a>! As an open source project, 0x will rely on a worldwide community of passionate developers
- to contribute proposals, ideas and code.
+ </a>
+ ! As an open source project, 0x will rely on a worldwide community of passionate developers to
+ contribute proposals, ideas and code.
</div>
),
},
diff --git a/packages/website/ts/pages/instant.tsx b/packages/website/ts/pages/instant.tsx
index b97bb35a4..586665d5b 100644
--- a/packages/website/ts/pages/instant.tsx
+++ b/packages/website/ts/pages/instant.tsx
@@ -100,7 +100,7 @@ export class Next0xInstant extends React.Component<Props> {
<div>
{[...Array(18)].map((item, index) => (
<Card key={`card-${index}`} index={index}>
- <img src={`/images/0x-instant/widget-${index % 6 + 1}.png`} />
+ <img src={`/images/0x-instant/widget-${(index % 6) + 1}.png`} />
</Card>
))}
</div>
@@ -189,13 +189,10 @@ const fadeUp = keyframes`
}
`;
-const ConfiguratorSection =
- styled(Section) <
- SectionProps >
- `
- @media (max-width: ${CONFIGURATOR_MIN_WIDTH_PX}px) {
- display: none;
- }
+const ConfiguratorSection = styled(Section)<SectionProps>`
+ @media (max-width: ${CONFIGURATOR_MIN_WIDTH_PX}px) {
+ display: none;
+ }
`;
// width = 370 * 12
@@ -233,29 +230,26 @@ const MarqueeWrap = styled.div`
}
`;
-const Card =
- styled.div <
- { index: number } >
- `
- opacity: 0;
- flex-shrink: 0;
- transform: translateY(10px);
- will-change: opacity, transform;
- animation: ${fadeUp} 0.75s ${props => `${props.index * 0.05}s`} forwards;
-
- img {
- height: auto;
- }
+const Card = styled.div<{ index: number }>`
+ opacity: 0;
+ flex-shrink: 0;
+ transform: translateY(10px);
+ will-change: opacity, transform;
+ animation: ${fadeUp} 0.75s ${props => `${props.index * 0.05}s`} forwards;
- @media (min-width: 768px) {
img {
- width: 370px;
+ height: auto;
}
- }
- @media (max-width: 768px) {
- img {
- width: 300px;
+ @media (min-width: 768px) {
+ img {
+ width: 370px;
+ }
+ }
+
+ @media (max-width: 768px) {
+ img {
+ width: 300px;
+ }
}
- }
`;
diff --git a/packages/website/ts/pages/instant/config_generator.tsx b/packages/website/ts/pages/instant/config_generator.tsx
index e43d47119..29fce85db 100644
--- a/packages/website/ts/pages/instant/config_generator.tsx
+++ b/packages/website/ts/pages/instant/config_generator.tsx
@@ -318,13 +318,10 @@ interface CheckboxTextProps {
isSelected?: boolean;
}
-const CheckboxText =
- styled.span <
- CheckboxTextProps >
- `
+const CheckboxText = styled.span<CheckboxTextProps>`
font-size: 14px;
line-height: 18px;
- color: ${props => (props.isSelected ? colors.brandDark : '#666666')}
+ color: ${props => (props.isSelected ? colors.brandDark : '#666666')};
`;
const OptionalAction = styled(OptionalText)`
diff --git a/packages/website/ts/pages/why.tsx b/packages/website/ts/pages/why.tsx
index 197ce5fc9..a0ed5f95a 100644
--- a/packages/website/ts/pages/why.tsx
+++ b/packages/website/ts/pages/why.tsx
@@ -229,10 +229,7 @@ interface SectionProps {
isNotRelative?: boolean;
}
-const SectionWrap =
- styled.div <
- SectionProps >
- `
+const SectionWrap = styled.div<SectionProps>`
position: ${props => !props.isNotRelative && 'relative'};
& + & {
@@ -258,10 +255,7 @@ const SectionWrap =
interface SectionTitleProps {
isNoBorder?: boolean;
}
-const SectionTitle =
- styled(Heading) <
- SectionTitleProps >
- `
+const SectionTitle = styled(Heading)<SectionTitleProps>`
position: relative;
${props =>
@@ -278,7 +272,6 @@ const SectionTitle =
}
`}
-
@media (max-width: 768px) {
&:before {
width: calc(100vw - 60px);