From ca25b816fabe15ce1ebc539c0316beba813683b8 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 13 Mar 2018 15:29:12 +0100 Subject: move scripts to monorepro-scripts --- packages/react-docs/src/components/badge.tsx | 56 ++++++++++++++++++++++++++++ 1 file changed, 56 insertions(+) create mode 100644 packages/react-docs/src/components/badge.tsx (limited to 'packages/react-docs/src/components/badge.tsx') diff --git a/packages/react-docs/src/components/badge.tsx b/packages/react-docs/src/components/badge.tsx new file mode 100644 index 000000000..b342f2dca --- /dev/null +++ b/packages/react-docs/src/components/badge.tsx @@ -0,0 +1,56 @@ +import { Styles } from '@0xproject/react-shared'; +import * as _ from 'lodash'; +import * as React from 'react'; + +const styles: Styles = { + badge: { + width: 50, + fontSize: 11, + height: 10, + borderRadius: 5, + lineHeight: 0.9, + fontFamily: 'Roboto Mono', + marginLeft: 3, + marginRight: 3, + }, +}; + +export interface BadgeProps { + title: string; + backgroundColor: string; +} + +export interface BadgeState { + isHovering: boolean; +} + +export class Badge extends React.Component { + constructor(props: BadgeProps) { + super(props); + this.state = { + isHovering: false, + }; + } + public render() { + const badgeStyle = { + ...styles.badge, + backgroundColor: this.props.backgroundColor, + opacity: this.state.isHovering ? 0.7 : 1, + }; + return ( +
+ {this.props.title} +
+ ); + } + private _setHoverState(isHovering: boolean) { + this.setState({ + isHovering, + }); + } +} -- cgit v1.2.3