diff options
Diffstat (limited to 'packages/website/ts/components/ui')
| -rw-r--r-- | packages/website/ts/components/ui/container.tsx | 1 | ||||
| -rw-r--r-- | packages/website/ts/components/ui/filled_image.tsx | 18 | ||||
| -rw-r--r-- | packages/website/ts/components/ui/input.tsx | 49 | ||||
| -rw-r--r-- | packages/website/ts/components/ui/simple_loading.tsx | 17 | ||||
| -rw-r--r-- | packages/website/ts/components/ui/typed_text.tsx | 75 |
5 files changed, 0 insertions, 160 deletions
diff --git a/packages/website/ts/components/ui/container.tsx b/packages/website/ts/components/ui/container.tsx index 2ce03d0c2..778f59f27 100644 --- a/packages/website/ts/components/ui/container.tsx +++ b/packages/website/ts/components/ui/container.tsx @@ -9,7 +9,6 @@ type StringOrNum = string | number; export type ContainerTag = 'div' | 'span'; export interface ContainerProps { - children?: React.ReactNode; margin?: string; marginTop?: StringOrNum; marginBottom?: StringOrNum; diff --git a/packages/website/ts/components/ui/filled_image.tsx b/packages/website/ts/components/ui/filled_image.tsx deleted file mode 100644 index 7f58ee5b9..000000000 --- a/packages/website/ts/components/ui/filled_image.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import * as React from 'react'; - -export interface FilledImageProps { - src: string; -} -export const FilledImage = (props: FilledImageProps) => ( - <div - style={{ - width: '100%', - height: '100%', - objectFit: 'cover', - backgroundImage: `url(${props.src})`, - backgroundRepeat: 'no-repeat', - backgroundPosition: 'center', - backgroundSize: 'cover', - }} - /> -); diff --git a/packages/website/ts/components/ui/input.tsx b/packages/website/ts/components/ui/input.tsx deleted file mode 100644 index d21b9fd0e..000000000 --- a/packages/website/ts/components/ui/input.tsx +++ /dev/null @@ -1,49 +0,0 @@ -import { colors } from '@0x/react-shared'; -import * as React from 'react'; -import { styled } from 'ts/style/theme'; - -export interface InputProps { - className?: string; - value?: string; - width?: string; - fontSize?: string; - fontColor?: string; - border?: string; - padding?: string; - placeholderColor?: string; - placeholder?: string; - backgroundColor?: string; - onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void; -} - -const PlainInput: React.StatelessComponent<InputProps> = ({ value, className, placeholder, onChange }) => ( - <input className={className} value={value} onChange={onChange} placeholder={placeholder} /> -); - -export const Input = styled(PlainInput)` - font-size: ${props => props.fontSize}; - width: ${props => props.width}; - padding: ${props => props.padding}; - border-radius: 3px; - box-sizing: border-box; - font-family: 'Roboto Mono'; - color: ${props => props.fontColor}; - border: ${props => props.border}; - outline: none; - background-color: ${props => props.backgroundColor}; - &::placeholder { - color: ${props => props.placeholderColor}; - } -`; - -Input.defaultProps = { - width: 'auto', - backgroundColor: colors.white, - fontColor: colors.darkestGrey, - placeholderColor: colors.darkGrey, - fontSize: '12px', - border: 'none', - padding: '0.8em 1.2em', -}; - -Input.displayName = 'Input'; diff --git a/packages/website/ts/components/ui/simple_loading.tsx b/packages/website/ts/components/ui/simple_loading.tsx deleted file mode 100644 index 81744196d..000000000 --- a/packages/website/ts/components/ui/simple_loading.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import CircularProgress from 'material-ui/CircularProgress'; -import * as React from 'react'; - -export interface SimpleLoadingProps { - message: string; -} - -export const SimpleLoading = (props: SimpleLoadingProps) => { - return ( - <div className="mx-auto pt3" style={{ maxWidth: 400, height: 409 }}> - <div className="relative" style={{ top: '50%', transform: 'translateY(-50%)', height: 95 }}> - <CircularProgress /> - <div className="pt3 pb3">{props.message}</div> - </div> - </div> - ); -}; diff --git a/packages/website/ts/components/ui/typed_text.tsx b/packages/website/ts/components/ui/typed_text.tsx deleted file mode 100644 index 6d38580b9..000000000 --- a/packages/website/ts/components/ui/typed_text.tsx +++ /dev/null @@ -1,75 +0,0 @@ -import * as _ from 'lodash'; -import * as React from 'react'; -import Typist from 'react-typist'; - -import { Text, TextProps } from 'ts/components/ui/text'; - -import 'react-typist/dist/Typist.css'; - -export interface TypedTextProps extends TextProps { - textList: string[]; - shouldRepeat?: boolean; - wordDelayMs?: number; - avgKeystrokeDelayMs?: number; - stdKeystrokeDelay?: number; -} - -export interface TypedTextState { - cycleCount: number; -} - -export class TypedText extends React.Component<TypedTextProps, TypedTextState> { - public static defaultProps = { - shouldRepeat: false, - avgKeystrokeDelayMs: 90, - wordDelayMs: 1000, - }; - public state = { - cycleCount: 0, - }; - public render(): React.ReactNode { - const { - textList, - shouldRepeat, - wordDelayMs, - avgKeystrokeDelayMs, - stdKeystrokeDelay, - // tslint:disable-next-line - ...textProps - } = this.props; - const { cycleCount } = this.state; - if (_.isEmpty(textList)) { - return null; - } - const typistChildren: React.ReactNode[] = []; - _.forEach(textList, text => { - typistChildren.push( - <Text key={`text-${text}-${cycleCount}`} {...textProps}> - {text} - </Text>, - ); - if (wordDelayMs) { - typistChildren.push(<Typist.Delay key={`delay-${text}-${cycleCount}`} ms={wordDelayMs} />); - } - typistChildren.push(<Typist.Backspace key={`backspace-${text}-${cycleCount}`} count={text.length} />); - }); - return ( - <Typist - avgTypingDelay={avgKeystrokeDelayMs} - stdTypingDelay={stdKeystrokeDelay} - className="inline" - key={`typist-key-${cycleCount}`} - onTypingDone={this._onTypingDone.bind(this)} - > - {typistChildren} - </Typist> - ); - } - private _onTypingDone(): void { - if (this.props.shouldRepeat) { - this.setState({ - cycleCount: this.state.cycleCount + 1, - }); - } - } -} |