aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website')
-rw-r--r--packages/website/package.json6
-rw-r--r--packages/website/public/images/developers/tutorials/integrate_0x_instant.svg3
-rw-r--r--packages/website/public/index.html2
-rw-r--r--packages/website/translations/english.json3
-rw-r--r--packages/website/ts/pages/documentation/docs_home.tsx8
-rw-r--r--packages/website/ts/pages/instant/fee_percentage_slider.tsx60
-rw-r--r--packages/website/ts/types.ts2
7 files changed, 52 insertions, 32 deletions
diff --git a/packages/website/package.json b/packages/website/package.json
index b0b0c8340..0ac4c9db6 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -1,6 +1,6 @@
{
"name": "@0x/website",
- "version": "0.0.61",
+ "version": "0.0.63",
"engines": {
"node": ">=6.12"
},
@@ -20,7 +20,7 @@
"author": "Fabio Berger",
"license": "Apache-2.0",
"dependencies": {
- "@0x/asset-buyer": "^3.0.2",
+ "@0x/asset-buyer": "^3.0.4",
"@0x/contract-addresses": "^2.0.0",
"@0x/contract-wrappers": "^4.1.1",
"@0x/json-schemas": "^2.1.2",
@@ -42,7 +42,7 @@
"blockies": "^0.0.2",
"bowser": "^1.9.3",
"deep-equal": "^1.0.1",
- "ethereum-types": "^1.1.2",
+ "ethereum-types": "^1.1.4",
"ethereumjs-util": "^5.1.1",
"find-versions": "^2.0.0",
"jsonschema": "^1.2.0",
diff --git a/packages/website/public/images/developers/tutorials/integrate_0x_instant.svg b/packages/website/public/images/developers/tutorials/integrate_0x_instant.svg
new file mode 100644
index 000000000..e9c9278a8
--- /dev/null
+++ b/packages/website/public/images/developers/tutorials/integrate_0x_instant.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="39" viewBox="0 0 32 39" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 1L1 23.242H16L16.0412 38L31 15.7159H16V1Z" stroke="#3289F1" stroke-width="1.5" stroke-miterlimit="10" stroke-linejoin="round"/>
+</svg>
diff --git a/packages/website/public/index.html b/packages/website/public/index.html
index 3f013f128..538eca6d9 100644
--- a/packages/website/public/index.html
+++ b/packages/website/public/index.html
@@ -23,7 +23,7 @@
<link rel="stylesheet" href="/css/basscss_responsive_type_scale.css" />
</head>
- <body>
+ <body style="margin: 0px; min-width: 355px;">
<!-- Heap SDK -->
<script type="text/javascript">
(window.heap = window.heap || []),
diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json
index 78f29d0f6..2914ffead 100644
--- a/packages/website/translations/english.json
+++ b/packages/website/translations/english.json
@@ -92,6 +92,9 @@
"ORDER_BASICS_DESCRIPTION": "Tutorial on how to create, validate and fill an order using 0x",
"USE_NETWORKED_LIQUIDITY": "use networked liquidity",
"USE_NETWORKED_LIQUIDITY_DESCRIPTION": "Learn how to tap into networked liquidity using the Standard Relayer API",
+ "INTEGRATE_0X_INSTANT": "add seamless purchasing of crypto assets to your website or app",
+ "INTEGRATE_0X_INSTANT_DESCRIPTION":
+ "learn how to use 0x Instant or AssetBuyer to give your users the power of purchasing crypto assets using 0x",
"VIEW_ALL_DOCUMENTATION": "view all documentation",
"SANDBOX": "0x.js sandbox",
"GITHUB": "github",
diff --git a/packages/website/ts/pages/documentation/docs_home.tsx b/packages/website/ts/pages/documentation/docs_home.tsx
index f68d2892f..9dc779e96 100644
--- a/packages/website/ts/pages/documentation/docs_home.tsx
+++ b/packages/website/ts/pages/documentation/docs_home.tsx
@@ -44,6 +44,14 @@ const TUTORIALS: TutorialInfo[] = [
to: `${WebsitePaths.Wiki}#Find,-Submit,-Fill-Order-From-Relayer`,
},
},
+ {
+ iconUrl: '/images/developers/tutorials/integrate_0x_instant.svg',
+ description: Key.Integrate0xInstantDescription,
+ link: {
+ title: Key.Integrate0xInstant,
+ to: `${WebsitePaths.Wiki}#Get-Started-With-Instant`,
+ },
+ },
];
const CATEGORY_TO_PACKAGES: ObjectMap<Package[]> = {
diff --git a/packages/website/ts/pages/instant/fee_percentage_slider.tsx b/packages/website/ts/pages/instant/fee_percentage_slider.tsx
index 176240f2e..d76cee58f 100644
--- a/packages/website/ts/pages/instant/fee_percentage_slider.tsx
+++ b/packages/website/ts/pages/instant/fee_percentage_slider.tsx
@@ -1,23 +1,52 @@
import Slider from 'rc-slider';
-//import 'rc-slider/assets/index.css';
+import 'rc-slider/assets/index.css';
import * as React from 'react';
-import styled from 'styled-components';
import { Text } from 'ts/components/ui/text';
import { colors } from 'ts/style/colors';
+import { injectGlobal } from 'ts/style/theme';
const SliderWithTooltip = (Slider as any).createSliderWithTooltip(Slider);
// tslint:disable-next-line:no-unused-expression
+injectGlobal`
+ .rc-slider-tooltip-inner {
+ box-shadow: none !important;
+ background-color: ${colors.white} !important;
+ border-radius: 4px !important;
+ padding: 3px 12px !important;
+ height: auto !important;
+ position: relative;
+ top: 7px;
+ &: after {
+ border: solid transparent;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-width: 6px;
+ bottom: 100%;
+ left: 100%;
+ border-bottom-color: ${colors.white};
+ margin-left: -60%;
+ }
+ }
+ .rc-slider-disabled {
+ background-color: inherit !important;
+ }
+`;
export interface FeePercentageSliderProps {
value: number;
+ isDisabled: boolean;
onChange: (value: number) => void;
}
export class FeePercentageSlider extends React.Component<FeePercentageSliderProps> {
public render(): React.ReactNode {
return (
- <StyledSlider
+ <SliderWithTooltip
+ disabled={this.props.isDisabled}
min={0}
max={0.05}
step={0.0025}
@@ -46,28 +75,3 @@ export class FeePercentageSlider extends React.Component<FeePercentageSliderProp
return <Text fontColor={colors.black} fontSize="14px" fontWeight={700}>{`${(value * 100).toFixed(2)}%`}</Text>;
};
}
-
-const StyledSlider = styled(SliderWithTooltip)`
- .rc-slider-tooltip-inner {
- box-shadow: none !important;
- background-color: ${colors.white} !important;
- border-radius: 4px !important;
- padding: 3px 12px !important;
- height: auto !important;
- position: relative;
- top: 7px;
- &:after {
- border: solid transparent;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none;
- border-width: 6px;
- bottom: 100%;
- left: 100%;
- border-bottom-color: ${colors.white};
- margin-left: -60%;
- }
- }
-`;
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index a668681d5..73e248713 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -480,6 +480,8 @@ export enum Key {
OrderBasicsDescription = 'ORDER_BASICS_DESCRIPTION',
UseNetworkedLiquidity = 'USE_NETWORKED_LIQUIDITY',
UseNetworkedLiquidityDescription = 'USE_NETWORKED_LIQUIDITY_DESCRIPTION',
+ Integrate0xInstant = 'INTEGRATE_0X_INSTANT',
+ Integrate0xInstantDescription = 'INTEGRATE_0X_INSTANT_DESCRIPTION',
ViewAllDocumentation = 'VIEW_ALL_DOCUMENTATION',
Sandbox = 'SANDBOX',
Github = 'GITHUB',