Fixed small errors

This commit is contained in:
Piotr Janosz
2019-07-06 14:14:26 +02:00
committed by fabioberger
parent 70b797cb6d
commit d012268953
4 changed files with 34 additions and 52 deletions

View File

@@ -1,30 +1,17 @@
import { Link } from '@0x/react-shared';
import * as _ from 'lodash';
import * as React from 'react';
import styled, { withTheme } from 'styled-components';
import React from 'react';
import styled from 'styled-components';
import { Button } from 'ts/components/button';
import { SearchInput } from 'ts/components/docs/search_input';
import { Icon } from 'ts/components/icon';
import { Column, FlexWrap, WrapGrid } from 'ts/components/newLayout';
import { ThemeValuesInterface } from 'ts/components/siteWrap';
import { Heading, Paragraph } from 'ts/components/text';
import { colors } from 'ts/style/colors';
import { WebsitePaths } from 'ts/types';
import { constants } from 'ts/utils/constants';
export interface StepLinkConfig {
export interface IStepLinkConfig {
title: string;
url: string;
shouldOpenInNewTab?: boolean;
}
interface WrapperProps {}
export const StepLink: React.FunctionComponent<StepLinkConfig> = (props: StepLinkConfig) => (
<>
<Wrapper href={props.url}>
<Text>{props.title}</Text>
export const StepLink: React.FC<IStepLinkConfig> = props => (
<StepLinkWrapper href={props.url}>
<StepLinkText>{props.title}</StepLinkText>
<svg width="14" height="14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
fillRule="evenodd"
@@ -33,11 +20,10 @@ export const StepLink: React.FunctionComponent<StepLinkConfig> = (props: StepLin
fill="currentColor"
/>
</svg>
</Wrapper>
</>
</StepLinkWrapper>
);
const Wrapper = styled.a<WrapperProps>`
const StepLinkWrapper = styled.a`
color: ${colors.brandDark};
padding: 21px 25px 19px;
display: flex;
@@ -54,6 +40,6 @@ const Wrapper = styled.a<WrapperProps>`
}
`;
const Text = styled.span`
const StepLinkText = styled.span`
font-size: 1.25rem;
`;

View File

@@ -1,27 +1,23 @@
import * as _ from 'lodash';
import * as React from 'react';
import styled, { withTheme } from 'styled-components';
import React from 'react';
import styled from 'styled-components';
import { IStepLinkConfig, StepLink } from 'ts/components/docs/step_link';
import { StepLink, StepLinkConfig } from 'ts/components/docs/step_link';
import { colors } from 'ts/style/colors';
export interface LinkProps {
links: StepLinkConfig[];
export interface ILinkProps {
links: IStepLinkConfig[];
}
export const StepLinks: React.FunctionComponent<LinkProps> = (props: LinkProps) => (
<Wrapper>
{props.links.map((shortcut, index) => (
<StepLink key={`step-${index}`} {...shortcut} />
export const StepLinks: React.FC<ILinkProps> = ({ links }) => (
<StepLinksWrapper>
{links.map((link, index) => (
<StepLink key={`step-${index}`} {...link} />
))}
</Wrapper>
</StepLinksWrapper>
);
StepLinks.defaultProps = {
links: [],
};
const Wrapper = styled.div`
const StepLinksWrapper = styled.div`
background-color: ${colors.backgroundLight};
border: 1px solid #dbdfdd;
margin-bottom: 1.875rem;

View File

@@ -4,9 +4,9 @@ import styled from 'styled-components';
import { Button } from 'ts/components/button';
import { CommunityLink, ICommunityLinkProps } from 'ts/components/docs/community_link';
import { Hero } from 'ts/components/docs/hero';
import { ShortcutLink, IShortcutLinkProps } from 'ts/components/docs/shortcut_link';
import { IShortcutLinkProps, ShortcutLink } from 'ts/components/docs/shortcut_link';
import { SiteWrap } from 'ts/components/docs/siteWrap';
import { StepLinkConfig } from 'ts/components/docs/step_link';
import { IStepLinkConfig } from 'ts/components/docs/step_link';
import { StepLinks } from 'ts/components/docs/step_links';
import { DocumentTitle } from 'ts/components/document_title';
import { Section } from 'ts/components/newLayout';
@@ -116,7 +116,7 @@ const shortcuts: IShortcutLinkProps[] = [
},
];
const usefulLinks: StepLinkConfig[] = [
const usefulLinks: IStepLinkConfig[] = [
{
title: 'Core Concepts',
url: '/docs/core-concepts',

View File

@@ -13,7 +13,7 @@ import { Resource } from 'ts/components/docs/resource/resource';
import { ChapterLinks } from 'ts/components/docs/sidebar/chapter_links';
import { FilterGroup, Filters } from 'ts/components/docs/sidebar/filters';
import { SiteWrap } from 'ts/components/docs/siteWrap';
import { StepLinkConfig } from 'ts/components/docs/step_link';
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';
@@ -266,7 +266,7 @@ const H3 = styled(Heading).attrs({
asElement: 'h3',
})``;
const usefulLinks: StepLinkConfig[] = [
const usefulLinks: IStepLinkConfig[] = [
{
title: 'Core Concepts',
url: '/docs/core-concepts',