Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | 6x 94x 94x 94x 94x 94x 94x 94x 94x 6x 6x | import React from 'react' import styled from 'styled-components' import PropTypes from 'prop-types' const Wrapper = styled.span` font-family: ${(props) => props.theme['fontPrimary']}; font-weight: ${(props) => props.weight}; font-size: ${(props) => props.size}; text-transform: ${(props) => props.uppercase ? 'uppercase' : props.capitalize ? 'capitalize' : 'none'}; font-style: ${(props) => (props.italic ? 'italic' : 'normal')}; color: ${(props) => props.theme['textColor']}; opacity: ${(props) => props.opacity}; ` const Text = ({ children, ...rest }) => <Wrapper {...rest}>{children}</Wrapper> Text.propTypes = { capitalize: PropTypes.bool, children: PropTypes.node, italic: PropTypes.bool, opacity: PropTypes.number, size: PropTypes.string, uppercase: PropTypes.bool, weight: PropTypes.oneOf([100, 200, 300, 400, 500, 600, 700]), } Text.defaultProps = { capitalize: false, italic: false, opacity: 1, size: '14px', uppercase: false, weight: 400, } export default Text |