crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed tabs => code_tabs. Changed notification signature. Removed old unused code (docs view duplicate)

Browse Source
This commit is contained in:
Piotr Janosz
2019-07-09 15:41:49 +02:00
committed by fabioberger
parent ac3a6426e8
commit db062154d1
6 changed files with 14 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/website/md/new-docs/usage.mdx
View File

@@ -39,6 +39,7 @@ const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);
```
```python canRun
# this is a python comment
import { TruffleArtifactAdapter } from '@0x/sol-coverage';
const projectRoot = '.';
const solcVersion = '0.5.0';
@@ -116,9 +117,9 @@ open coverage/index.html
### Notifications
<Notification text="This is' a pretty standard notification" />
<Notification text="This is an indication that something isn’t quite right" type="alert" />
<Notification text="This is a success message" type="success" />
<Notification>This is a standard notification</Notification>
<Notification type="alert">Something isn’t quite right</Notification>
<Notification type="success">This is a success message</Notification>
### Lists

4
packages/website/ts/components/docs/tabs.tsx → packages/website/ts/components/docs/code_tabs.tsx
View File

@@ -15,12 +15,12 @@ interface ITabProps {
selectedTabClassName?: string;
}
interface ICodeTabs {
interface ICodeTabsProps {
children: React.ReactNode;
tabs: string[];
}
export const CodeTabs: React.FC<ICodeTabs> = ({ children, tabs }) => {
export const CodeTabs: React.FC<ICodeTabsProps> = ({ children, tabs }) => {
return (
<Tabs>
<TabList>

6
packages/website/ts/components/docs/notification.tsx
View File

@@ -8,13 +8,13 @@ interface INotificationWrapperProps {
}
interface INotificationProps extends INotificationWrapperProps {
text: string;
children: string;
}
export const Notification: React.FC<INotificationProps> = ({ type = 'standard', text }) => (
export const Notification: React.FC<INotificationProps> = ({ children, type = 'standard' }) => (
<NotificationWrapper type={type}>
{themeSettings[type].icon}
<NotificationText>{text}</NotificationText>
<NotificationText>{children}</NotificationText>
</NotificationWrapper>
);

8
packages/website/ts/pages/docs/page_template.tsx
View File

@@ -2,6 +2,7 @@ import React from 'react';
import styled from 'styled-components';
import { Code } from 'ts/components/docs/code';
import { Tab, TabList, TabPanel, Tabs } from 'ts/components/docs/code_tabs';
import { FeatureLink } from 'ts/components/docs/feature_link';
import { HelpCallout } from 'ts/components/docs/help_callout';
import { HelpfulCta } from 'ts/components/docs/helpful_cta';
@@ -16,7 +17,6 @@ import { SiteWrap } from 'ts/components/docs/siteWrap';
import { IStepLinkConfig } from 'ts/components/docs/step_link';
import { StepLinks } from 'ts/components/docs/step_links';
import { Table } from 'ts/components/docs/table';
import { Tab, TabList, TabPanel, Tabs } from 'ts/components/docs/tabs';
import { TutorialSteps } from 'ts/components/docs/tutorial_steps';
import { UnorderedList } from 'ts/components/docs/unordered_list';
import { DocumentTitle } from 'ts/components/document_title';
@@ -42,9 +42,9 @@ export const DocsPageTemplate: React.FC = () => {
<Heading asElement="h2" size="default">
Notifications
</Heading>
<Notification text="This is' a pretty standard information callout" />
<Notification text="This is an indication that something isn’t quite right" type="alert" />
<Notification text="This is a success message" type="success" />
<Notification>This is a standard information callout</Notification>
<Notification type="alert">This is an indication that something isn’t quite right</Notification>
<Notification type="success">This is a success message</Notification>
<Heading asElement="h2" size="default">
Tutorial Steps
</Heading>

2
packages/website/ts/pages/docs/view.tsx
View File

@@ -7,6 +7,7 @@ import { MDXProvider } from '@mdx-js/react';
import CircularProgress from 'material-ui/CircularProgress';
import { Code } from 'ts/components/docs/code';
import { CodeTabs } from 'ts/components/docs/code_tabs';
import { HelpCallout } from 'ts/components/docs/help_callout';
import { HelpfulCta } from 'ts/components/docs/helpful_cta';
import { Hero } from 'ts/components/docs/hero';
@@ -15,7 +16,6 @@ import { InlineLink } from 'ts/components/docs/inline_link';
import { Notification } from 'ts/components/docs/notification';
import { SiteWrap } from 'ts/components/docs/siteWrap';
import { Table } from 'ts/components/docs/table';
import { CodeTabs } from 'ts/components/docs/tabs';
import { TutorialSteps } from 'ts/components/docs/tutorial_steps';
import { UnorderedList } from 'ts/components/docs/unordered_list';
import { DocumentTitle } from 'ts/components/document_title';

141
packages/website/ts/pages/docs/view_OLDER.tsx
View File

@@ -1,141 +0,0 @@
import React from 'react';
import { match } from 'react-router-dom';
import styled from 'styled-components';
import { MDXProvider } from '@mdx-js/react';
import { Code } from 'ts/components/docs/code';
import { HelpCallout } from 'ts/components/docs/help_callout';
import { HelpfulCta } from 'ts/components/docs/helpful_cta';
import { Hero } from 'ts/components/docs/hero';
import { Notification } from 'ts/components/docs/notification';
import { SiteWrap } from 'ts/components/docs/siteWrap';
import { Table } from 'ts/components/docs/table';
import { Tab, TabList, TabPanel, Tabs } from 'ts/components/docs/tabs';
import { TutorialSteps } from 'ts/components/docs/tutorial_steps';
import { UnorderedList } from 'ts/components/docs/unordered_list';
import { DocumentTitle } from 'ts/components/document_title';
import { Section } from 'ts/components/newLayout';
import { Heading, Paragraph } from 'ts/components/text';
import { documentConstants } from 'ts/utils/document_meta_constants';
interface Props {
history: History;
location: Location;
match: match<any>;
theme: {
bgColor: string;
textColor: string;
linkColor: string;
};
}
interface State {
title: string;
Component: JSX.Element | string;
}
export class DocsView extends React.Component<Props, State> {
public state = {
title: '',
Component: '',
mdxComponents: {
p: Paragraph,
h1: LargeHeading,
h2: H2,
h3: H3,
ol: TutorialSteps,
ul: UnorderedList,
code: Code,
table: Table,
hr: Separator,
Notification,
Tabs,
TabList,
Tab,
TabPanel,
},
};
public componentDidMount(): void {
// tslint:disable-next-line: no-console
console.log(this.props.match.params.page);
this._addComponentAsync(this.props.match.params.page);
}
public componentDidUpdate(prevProps: Props, prevState: State): void {
if (prevProps.match.params.page !== this.props.match.params.page) {
this._addComponentAsync(this.props.match.params.page);
}
}
public render(): React.ReactNode {
const { title, Component, mdxComponents } = this.state;
return (
<SiteWrap theme="light">
<DocumentTitle {...documentConstants.DOCS} />
<Hero isHome={false} title={title} />
<Section maxWidth={'1030px'} isPadded={false} padding="0 0">
<Columns>
<aside>
<h3>Sidebar</h3>
</aside>
<ContentWrapper>
<MDXProvider components={mdxComponents}>{Component ? <Component /> : null}</MDXProvider>
<HelpCallout />
<HelpfulCta />
</ContentWrapper>
</Columns>
</Section>
</SiteWrap>
);
}
private async _addComponentAsync(name: string): Promise<void> {
const component = await import(`../../../md/new-docs/${name}.mdx`).catch(e => {
return null;
});
if (!component) {
this.setState({
Component: '',
});
}
this.setState({
title: component.meta.title,
Component: component.default,
});
}
}
const Columns = styled.div`
display: grid;
grid-template-columns: 230px 1fr;
grid-column-gap: 118px;
grid-row-gap: 30px;
`;
const ContentWrapper = styled.article`
min-height: 300px;
`;
const Separator = styled.hr`
border-width: 0 0 1px;
border-color: #e4e4e4;
height: 0;
margin-top: 60px;
margin-bottom: 60px;
`;
const LargeHeading = styled(Heading).attrs({
asElement: 'h1',
})`
font-size: 2.125rem !important;
`;
const H2 = styled(Heading).attrs({
size: 'default',
asElement: 'h2',
})``;
const H3 = styled(Heading).attrs({
size: 'default',
asElement: 'h3',
})``;