aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/components/dropdowns/developers_drop_down.tsx48
-rw-r--r--packages/website/ts/components/nested_sidebar_menu.tsx92
-rw-r--r--packages/website/ts/pages/documentation/developers_page.tsx164
-rw-r--r--packages/website/ts/pages/documentation/doc_page.tsx2
-rw-r--r--packages/website/ts/pages/documentation/docs_home.tsx23
-rw-r--r--packages/website/ts/pages/wiki/wiki.tsx18
-rw-r--r--packages/website/ts/types.ts6
-rw-r--r--packages/website/ts/utils/utils.ts4
8 files changed, 235 insertions, 122 deletions
diff --git a/packages/website/ts/components/dropdowns/developers_drop_down.tsx b/packages/website/ts/components/dropdowns/developers_drop_down.tsx
index f5d21535a..6e85c1499 100644
--- a/packages/website/ts/components/dropdowns/developers_drop_down.tsx
+++ b/packages/website/ts/components/dropdowns/developers_drop_down.tsx
@@ -24,7 +24,7 @@ const gettingStartedKeyToLinkInfo2: ALink[] = [
to: `${WebsitePaths.Wiki}#Ethereum-Development`,
},
{
- title: Key.UseSharedLiquidity,
+ title: Key.UseNetworkedLiquidity,
to: `${WebsitePaths.Wiki}#Find,-Submit,-Fill-Order-From-Relayer`,
},
];
@@ -89,26 +89,22 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps,
);
}
private _renderDropdownMenu(): React.ReactNode {
+ const sectionPadding = '28px';
const dropdownMenu = (
<Container>
- <Container padding="1.75rem">
- {this._renderTitle('Getting started')}
- <Container className="flex">
- <Container className="pr4 mr2">
- {this._renderLinkSection(gettingStartedKeyToLinkInfo1)}
- </Container>
- <Container>{this._renderLinkSection(gettingStartedKeyToLinkInfo2)}</Container>
+ <Container className="flex" padding={sectionPadding}>
+ <Container paddingRight="45px">
+ {this._renderLinkSection(gettingStartedKeyToLinkInfo1, 'Getting started')}
</Container>
+ <Container>{this._renderLinkSection(gettingStartedKeyToLinkInfo2)}</Container>
</Container>
<Container width="100%" height="1px" backgroundColor={colors.grey300} />
- <Container className="flex" padding="1.75rem">
- <Container className="pr4 mr2">
- <Container>{this._renderTitle('Popular docs')}</Container>
- <Container>{this._renderLinkSection(popularDocsToLinkInfos)}</Container>
+ <Container className="flex" padding={sectionPadding}>
+ <Container paddingRight="62px">
+ <Container>{this._renderLinkSection(popularDocsToLinkInfos, 'Popular docs')}</Container>
</Container>
<Container>
- <Container>{this._renderTitle('Useful links')}</Container>
- <Container>{this._renderLinkSection(usefulLinksToLinkInfo)}</Container>
+ <Container>{this._renderLinkSection(usefulLinksToLinkInfo, 'Useful links')}</Container>
</Container>
</Container>
<Link to={WebsitePaths.Docs} fontColor={colors.lightBlueA700}>
@@ -127,16 +123,7 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps,
);
return dropdownMenu;
}
- private _renderTitle(title: string): React.ReactNode {
- return (
- <Container paddingBottom="12px">
- <Text letterSpacing={1} fontColor={colors.linkSectionGrey} fontSize="14px" fontWeight={600}>
- {title.toUpperCase()}
- </Text>
- </Container>
- );
- }
- private _renderLinkSection(links: ALink[]): React.ReactNode {
+ private _renderLinkSection(links: ALink[], title: string = ''): React.ReactNode {
const numLinks = links.length;
let i = 0;
const renderLinks = _.map(links, (link: ALink) => {
@@ -159,6 +146,17 @@ export class DevelopersDropDown extends React.Component<DevelopersDropDownProps,
</Container>
);
});
- return <Container>{renderLinks}</Container>;
+ return (
+ <Container>
+ <Container height="33px">
+ {!_.isEmpty(title) && (
+ <Text letterSpacing={1} fontColor={colors.linkSectionGrey} fontSize="14px" fontWeight={600}>
+ {title.toUpperCase()}
+ </Text>
+ )}
+ </Container>
+ {renderLinks}
+ </Container>
+ );
}
}
diff --git a/packages/website/ts/components/nested_sidebar_menu.tsx b/packages/website/ts/components/nested_sidebar_menu.tsx
new file mode 100644
index 000000000..db7d55261
--- /dev/null
+++ b/packages/website/ts/components/nested_sidebar_menu.tsx
@@ -0,0 +1,92 @@
+import { ALink, colors, Link, utils as sharedUtils } from '@0x/react-shared';
+import { ObjectMap } from '@0x/types';
+import * as _ from 'lodash';
+import * as React from 'react';
+import { Button } from 'ts/components/ui/button';
+import { Text } from 'ts/components/ui/text';
+
+export interface NestedSidebarMenuProps {
+ sectionNameToLinks: ObjectMap<ALink[]>;
+ sidebarHeader?: React.ReactNode;
+ shouldReformatMenuItemNames?: boolean;
+}
+
+export const NestedSidebarMenu = (props: NestedSidebarMenuProps) => {
+ const navigation = _.map(props.sectionNameToLinks, (links: ALink[], sectionName: string) => {
+ const finalSectionName = sharedUtils.convertCamelCaseToSpaces(sectionName);
+ const menuItems = _.map(links, (link, i) => {
+ const menuItemTitle = props.shouldReformatMenuItemNames
+ ? _.capitalize(sharedUtils.convertDashesToSpaces(link.title))
+ : link.title;
+ const finalLink = {
+ ...link,
+ title: menuItemTitle,
+ };
+ return <MenuItem key={`menu-item-${menuItemTitle}`} link={finalLink} />;
+ });
+ // tslint:disable-next-line:no-unused-variable
+ return (
+ <div key={`section-${sectionName}`} className="py1" style={{ color: colors.greyTheme }}>
+ <Text fontSize="14px" letterSpacing="0.5" className="py1 pl1">
+ {finalSectionName.toUpperCase()}
+ </Text>
+ {menuItems}
+ </div>
+ );
+ });
+ return (
+ <div>
+ {props.sidebarHeader}
+ <div>{navigation}</div>
+ </div>
+ );
+};
+
+export interface MenuItemProps {
+ link: ALink;
+}
+
+export interface MenuItemState {
+ isActive: boolean;
+}
+
+export class MenuItem extends React.Component<MenuItemProps, MenuItemState> {
+ constructor(props: MenuItemProps) {
+ super(props);
+ const isActive = window.location.hash.slice(1) === props.link.to;
+ this.state = {
+ isActive,
+ };
+ }
+ public render(): React.ReactNode {
+ const isActive = this.state.isActive;
+ return (
+ <Link
+ to={this.props.link.to}
+ shouldOpenInNewTab={this.props.link.shouldOpenInNewTab}
+ onActivityChanged={this._onActivityChanged.bind(this)}
+ >
+ <Button
+ borderRadius="4px"
+ padding="0.4em 0.375em"
+ width="100%"
+ backgroundColor={isActive ? colors.lightLinkBlue : colors.grey100}
+ fontSize="14px"
+ textAlign="left"
+ >
+ <Text
+ fontWeight={isActive ? 'bold' : 'normal'}
+ fontColor={isActive ? colors.white : colors.grey800}
+ >
+ {this.props.link.title}
+ </Text>
+ </Button>
+ </Link>
+ );
+ }
+ private _onActivityChanged(isActive: boolean): void {
+ this.setState({
+ isActive,
+ });
+ }
+}
diff --git a/packages/website/ts/pages/documentation/developers_page.tsx b/packages/website/ts/pages/documentation/developers_page.tsx
index 934a4cc36..361dbc86e 100644
--- a/packages/website/ts/pages/documentation/developers_page.tsx
+++ b/packages/website/ts/pages/documentation/developers_page.tsx
@@ -1,4 +1,4 @@
-import { colors, constants as sharedConstants } from '@0x/react-shared';
+import { colors, constants as sharedConstants, utils as sharedUtils } from '@0x/react-shared';
import * as _ from 'lodash';
import * as React from 'react';
import DocumentTitle = require('react-document-title');
@@ -6,13 +6,34 @@ import { DocsLogo } from 'ts/components/documentation/docs_logo';
import { DocsTopBar } from 'ts/components/documentation/docs_top_bar';
import { Container } from 'ts/components/ui/container';
import { Dispatcher } from 'ts/redux/dispatcher';
-import { ScreenWidths } from 'ts/types';
+import { media } from 'ts/style/media';
+import { styled } from 'ts/style/theme';
+import { BrowserType, OperatingSystemType, ScreenWidths } from 'ts/types';
import { Translate } from 'ts/utils/translate';
import { utils } from 'ts/utils/utils';
const THROTTLE_TIMEOUT = 100;
const TOP_BAR_HEIGHT = 80;
-const SCROLLER_WIDTH = 4;
+const browserType = utils.getBrowserType();
+let SCROLLBAR_WIDTH;
+switch (browserType) {
+ case BrowserType.Firefox:
+ // HACK: Firefox doesn't allow styling of their scrollbar's.
+ // Source: https://stackoverflow.com/questions/6165472/custom-css-scrollbar-for-firefox
+ const os = utils.getOperatingSystem();
+ SCROLLBAR_WIDTH = os === OperatingSystemType.Windows ? 17 : 15;
+ break;
+
+ case BrowserType.Edge:
+ // Edge's scrollbar is placed outside of the div content and doesn't
+ // need to be accounted for
+ SCROLLBAR_WIDTH = 0;
+ break;
+
+ default:
+ SCROLLBAR_WIDTH = 4;
+}
+const SIDEBAR_PADDING = 22;
export interface DevelopersPageProps {
location: Location;
@@ -24,11 +45,70 @@ export interface DevelopersPageProps {
}
export interface DevelopersPageState {
- isHoveringSidebar: boolean;
- isHoveringMainContent: boolean;
isSidebarScrolling: boolean;
}
+const isUserOnMobile = sharedUtils.isUserOnMobile();
+
+const scrollableContainerStyles = `
+ position: absolute;
+ top: ${TOP_BAR_HEIGHT}px;
+ left: 0px;
+ bottom: 0px;
+ right: 0px;
+ overflow-x: hidden;
+ overflow-y: scroll;
+ -webkit-overflow-scrolling: touch;
+ /* Required for hide/show onHover of scrollbar on Microsoft Edge */
+ -ms-overflow-style: -ms-autohiding-scrollbar;
+`;
+
+interface SidebarContainerProps {
+ className?: string;
+}
+
+const SidebarContainer =
+ styled.div <
+ SidebarContainerProps >
+ `
+ ${scrollableContainerStyles}
+ padding-top: 27px;
+ padding-left: ${SIDEBAR_PADDING}px;
+ padding-right: ${SIDEBAR_PADDING}px;
+ overflow: hidden;
+ &:hover {
+ overflow: auto;
+ padding-right: ${SIDEBAR_PADDING - SCROLLBAR_WIDTH}px;
+ }
+`;
+
+interface MainContentContainerProps {
+ className?: string;
+}
+
+const MainContentContainer =
+ styled.div <
+ MainContentContainerProps >
+ `
+ ${scrollableContainerStyles}
+ padding-top: 0px;
+ padding-left: 50px;
+ padding-right: 50px;
+ overflow: ${isUserOnMobile ? 'auto' : 'hidden'};
+ &:hover {
+ padding-right: ${50 - SCROLLBAR_WIDTH}px;
+ overflow: auto;
+ }
+ ${media.small`
+ padding-left: 20px;
+ padding-right: 20px;
+ &:hover {
+ padding-right: ${20 - SCROLLBAR_WIDTH}px;
+ overflow: auto;
+ }
+ `}
+`;
+
export class DevelopersPage extends React.Component<DevelopersPageProps, DevelopersPageState> {
private readonly _throttledScreenWidthUpdate: () => void;
private readonly _throttledSidebarScrolling: () => void;
@@ -38,8 +118,6 @@ export class DevelopersPage extends React.Component<DevelopersPageProps, Develop
this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT);
this._throttledSidebarScrolling = _.throttle(this._onSidebarScroll.bind(this), THROTTLE_TIMEOUT);
this.state = {
- isHoveringSidebar: false,
- isHoveringMainContent: false,
isSidebarScrolling: false,
};
}
@@ -57,20 +135,8 @@ export class DevelopersPage extends React.Component<DevelopersPageProps, Develop
window.clearInterval(this._sidebarScrollClearingInterval);
}
public render(): React.ReactNode {
- const scrollableContainerStyles: React.CSSProperties = {
- position: 'absolute',
- top: 80,
- left: 0,
- bottom: 0,
- right: 0,
- overflowX: 'hidden',
- overflowY: 'scroll',
- minHeight: `calc(100vh - ${TOP_BAR_HEIGHT}px)`,
- WebkitOverflowScrolling: 'touch',
- };
const isSmallScreen = this.props.screenWidth === ScreenWidths.Sm;
const mainContentPadding = isSmallScreen ? 20 : 50;
- const sidebarPadding = 22;
return (
<Container
className="flex items-center overflow-hidden"
@@ -79,7 +145,7 @@ export class DevelopersPage extends React.Component<DevelopersPageProps, Develop
colors.white
} 50%, ${colors.white} 100%)`}
>
- <DocumentTitle title="0x Docs DevelopersPage" />
+ <DocumentTitle title="0x Docs" />
<Container className="flex mx-auto" height="100vh">
<Container
className="sm-hide xs-hide relative"
@@ -96,28 +162,11 @@ export class DevelopersPage extends React.Component<DevelopersPageProps, Develop
<DocsLogo height={36} />
</Container>
</Container>
- <div
- style={{
- ...scrollableContainerStyles,
- paddingTop: 27,
- overflow: this.state.isHoveringSidebar ? 'auto' : 'hidden',
- }}
- onMouseEnter={this._onSidebarHover.bind(this, true)}
- onMouseLeave={this._onSidebarHover.bind(this, false)}
- onWheel={this._throttledSidebarScrolling}
- >
- <div
- style={{
- paddingBottom: 100,
- paddingLeft: sidebarPadding,
- paddingRight: this.state.isHoveringSidebar
- ? sidebarPadding - SCROLLER_WIDTH
- : sidebarPadding,
- }}
- >
+ <SidebarContainer onWheel={this._throttledSidebarScrolling}>
+ <Container paddingBottom="100px">
{this.props.screenWidth !== ScreenWidths.Sm && this.props.sidebar}
- </div>
- </div>
+ </Container>
+ </SidebarContainer>
</Container>
<Container
className="relative"
@@ -133,43 +182,14 @@ export class DevelopersPage extends React.Component<DevelopersPageProps, Develop
sidebar={this.props.sidebar}
/>
</Container>
- <div
- id={sharedConstants.SCROLL_CONTAINER_ID}
- className="absolute"
- style={{
- ...scrollableContainerStyles,
- paddingTop: 0,
- paddingLeft: mainContentPadding,
- paddingRight: this.state.isHoveringMainContent
- ? mainContentPadding - SCROLLER_WIDTH
- : mainContentPadding,
- overflow: this.state.isHoveringMainContent ? 'auto' : 'hidden',
- }}
- onMouseEnter={this._onMainContentHover.bind(this, true)}
- onMouseOver={this._onMainContentHover.bind(this, true)}
- onMouseLeave={this._onMainContentHover.bind(this, false)}
- >
+ <MainContentContainer id={sharedConstants.SCROLL_CONTAINER_ID}>
{this.props.mainContent}
- </div>
+ </MainContentContainer>
</Container>
</Container>
</Container>
);
}
- private _onSidebarHover(isHovering: boolean, _event: React.FormEvent<HTMLInputElement>): void {
- if (isHovering !== this.state.isHoveringSidebar) {
- this.setState({
- isHoveringSidebar: isHovering,
- });
- }
- }
- private _onMainContentHover(isHovering: boolean, _event: React.FormEvent<HTMLInputElement>): void {
- if (isHovering !== this.state.isHoveringMainContent) {
- this.setState({
- isHoveringMainContent: isHovering,
- });
- }
- }
private _onSidebarScroll(_event: React.FormEvent<HTMLInputElement>): void {
this.setState({
isSidebarScrolling: true,
diff --git a/packages/website/ts/pages/documentation/doc_page.tsx b/packages/website/ts/pages/documentation/doc_page.tsx
index 7157abfc9..28bf2dba1 100644
--- a/packages/website/ts/pages/documentation/doc_page.tsx
+++ b/packages/website/ts/pages/documentation/doc_page.tsx
@@ -6,13 +6,13 @@ import {
SupportedDocJson,
TypeDocUtils,
} from '@0x/react-docs';
-import { NestedSidebarMenu } from '@0x/react-shared';
import findVersions = require('find-versions');
import * as _ from 'lodash';
import CircularProgress from 'material-ui/CircularProgress';
import * as React from 'react';
import semverSort = require('semver-sort');
import { SidebarHeader } from 'ts/components/documentation/sidebar_header';
+import { NestedSidebarMenu } from 'ts/components/nested_sidebar_menu';
import { Container } from 'ts/components/ui/container';
import { DevelopersPage } from 'ts/pages/documentation/developers_page';
import { Dispatcher } from 'ts/redux/dispatcher';
diff --git a/packages/website/ts/pages/documentation/docs_home.tsx b/packages/website/ts/pages/documentation/docs_home.tsx
index 74fd0135c..bbbee2d2d 100644
--- a/packages/website/ts/pages/documentation/docs_home.tsx
+++ b/packages/website/ts/pages/documentation/docs_home.tsx
@@ -1,8 +1,9 @@
-import { ALink, colors, Link, NestedSidebarMenu } from '@0x/react-shared';
+import { ALink, colors, Link } from '@0x/react-shared';
import { ObjectMap } from '@0x/types';
import * as _ from 'lodash';
import * as React from 'react';
import { OverviewContent } from 'ts/components/documentation/overview_content';
+import { NestedSidebarMenu } from 'ts/components/nested_sidebar_menu';
import { Button } from 'ts/components/ui/button';
import { DevelopersPage } from 'ts/pages/documentation/developers_page';
import { Dispatcher } from 'ts/redux/dispatcher';
@@ -37,9 +38,9 @@ const TUTORIALS: TutorialInfo[] = [
},
{
iconUrl: '/images/developers/tutorials/use_shared_liquidity.svg',
- description: Key.UseSharedLiquidityDescription,
+ description: Key.UseNetworkedLiquidityDescription,
link: {
- title: Key.UseSharedLiquidity,
+ title: Key.UseNetworkedLiquidity,
to: `${WebsitePaths.Wiki}#Find,-Submit,-Fill-Order-From-Relayer`,
},
},
@@ -194,7 +195,7 @@ const CATEGORY_TO_PACKAGES: ObjectMap<Package[]> = {
},
{
description:
- "ERCdex's Javascript SDK for trading on their relayer, as well as other Aquaduct partner relayers",
+ "ERCdEX's Javascript SDK for trading on their relayer, as well as other Aquaduct partner relayers",
link: {
title: 'Aquaduct',
to: 'https://www.npmjs.com/package/aqueduct',
@@ -219,26 +220,26 @@ const CATEGORY_TO_PACKAGES: ObjectMap<Package[]> = {
},
},
{
- description: "The ERC dEX Trade Widget let's any website provide token liquidity to it's users",
+ description: "The ERCdEX Trade Widget let's any website provide token liquidity to it's users",
link: {
to: 'https://github.com/ERCdEX/widget',
- title: 'ERCdex Widget',
+ title: 'ERCdEX Widget',
shouldOpenInNewTab: true,
},
},
{
- description: "ERCdex's Java SDK for trading on their relayer, as well as other Aquaduct partner relayers",
+ description: "ERCdEX's Java SDK for trading on their relayer, as well as other Aquaduct partner relayers",
link: {
to: 'https://github.com/ERCdEX/java',
- title: 'ERCdex Java SDK',
+ title: 'ERCdEX Java SDK',
shouldOpenInNewTab: true,
},
},
{
- description: "ERCdex's Python SDK for trading on their relayer, as well as other Aquaduct partner relayers",
+ description: "ERCdEX's Python SDK for trading on their relayer, as well as other Aquaduct partner relayers",
link: {
to: 'https://github.com/ERCdEX/python',
- title: 'ERCdex Python SDK',
+ title: 'ERCdEX Python SDK',
shouldOpenInNewTab: true,
},
},
@@ -368,7 +369,7 @@ export class DocsHome extends React.Component<DocsHomeProps, DocsHomeState> {
>
<Button
borderRadius="4px"
- padding="0.4em 6px"
+ padding="0.4em 0.375em"
width="100%"
fontColor={colors.grey800}
fontSize="14px"
diff --git a/packages/website/ts/pages/wiki/wiki.tsx b/packages/website/ts/pages/wiki/wiki.tsx
index fdca61e39..c1802b1f8 100644
--- a/packages/website/ts/pages/wiki/wiki.tsx
+++ b/packages/website/ts/pages/wiki/wiki.tsx
@@ -5,7 +5,6 @@ import {
HeaderSizes,
Link,
MarkdownSection,
- NestedSidebarMenu,
utils as sharedUtils,
} from '@0x/react-shared';
import { ObjectMap } from '@0x/types';
@@ -13,6 +12,7 @@ import * as _ from 'lodash';
import CircularProgress from 'material-ui/CircularProgress';
import * as React from 'react';
import { SidebarHeader } from 'ts/components/documentation/sidebar_header';
+import { NestedSidebarMenu } from 'ts/components/nested_sidebar_menu';
import { Button } from 'ts/components/ui/button';
import { Container } from 'ts/components/ui/container';
import { DevelopersPage } from 'ts/pages/documentation/developers_page';
@@ -49,9 +49,6 @@ export class Wiki extends React.Component<WikiProps, WikiState> {
isHoveringSidebar: false,
};
}
- public componentDidMount(): void {
- window.addEventListener('hashchange', this._onHashChanged.bind(this), false);
- }
public componentWillMount(): void {
// tslint:disable-next-line:no-floating-promises
this._fetchArticlesBySectionAsync();
@@ -59,7 +56,6 @@ export class Wiki extends React.Component<WikiProps, WikiState> {
public componentWillUnmount(): void {
this._isUnmounted = true;
clearTimeout(this._wikiBackoffTimeoutId);
- window.removeEventListener('hashchange', this._onHashChanged.bind(this), false);
}
public render(): React.ReactNode {
const sectionNameToLinks = _.isUndefined(this.state.articlesBySection)
@@ -73,10 +69,14 @@ export class Wiki extends React.Component<WikiProps, WikiState> {
{this._renderWikiArticles()}
</div>
);
+ const isSmallScreen = this.props.screenWidth === ScreenWidths.Sm;
const sidebar = _.isUndefined(this.state.articlesBySection) ? (
<div />
) : (
- <NestedSidebarMenu sidebarHeader={this._renderSidebarHeader()} sectionNameToLinks={sectionNameToLinks} />
+ <NestedSidebarMenu
+ sidebarHeader={isSmallScreen ? this._renderSidebarHeader() : undefined}
+ sectionNameToLinks={sectionNameToLinks}
+ />
);
return (
<DevelopersPage
@@ -99,7 +99,7 @@ export class Wiki extends React.Component<WikiProps, WikiState> {
>
<Button
borderRadius="4px"
- padding="0.4em 6px"
+ padding="0.4em 0.375em"
width="100%"
fontColor={colors.grey800}
fontSize="14px"
@@ -194,8 +194,4 @@ export class Wiki extends React.Component<WikiProps, WikiState> {
}
return sectionNameToLinks;
}
- private _onHashChanged(_event: any): void {
- const hash = window.location.hash.slice(1);
- sharedUtils.scrollToHash(hash, sharedConstants.SCROLL_CONTAINER_ID);
- }
}
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index f85317c7b..22bfd2cb4 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -468,8 +468,8 @@ export enum Key {
DevelopOnEthereumDescription = 'DEVELOP_ON_ETHEREUM_DESCRIPTION',
OrderBasics = 'ORDER_BASICS',
OrderBasicsDescription = 'ORDER_BASICS_DESCRIPTION',
- UseSharedLiquidity = 'USE_SHARED_LIQUIDITY',
- UseSharedLiquidityDescription = 'USE_SHARED_LIQUIDITY_DESCRIPTION',
+ UseNetworkedLiquidity = 'USE_NETWORKED_LIQUIDITY',
+ UseNetworkedLiquidityDescription = 'USE_NETWORKED_LIQUIDITY_DESCRIPTION',
ViewAllDocumentation = 'VIEW_ALL_DOCUMENTATION',
Sandbox = 'SANDBOX',
Github = 'GITHUB',
@@ -590,6 +590,8 @@ export enum BrowserType {
Chrome = 'Chrome',
Firefox = 'Firefox',
Opera = 'Opera',
+ Safari = 'Safari',
+ Edge = 'Edge',
Other = 'Other',
}
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index d4ad5f611..87aa48018 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -413,6 +413,10 @@ export const utils = {
return BrowserType.Firefox;
} else if (bowser.opera) {
return BrowserType.Opera;
+ } else if (bowser.msedge) {
+ return BrowserType.Edge;
+ } else if (bowser.safari) {
+ return BrowserType.Safari;
} else {
return BrowserType.Other;
}
generated by cgit v1.2.3 (git 2.25.1) at 2024-09-20 22:51:12 +0800