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 39 40 41 42 | 3x 26x 3x 26x 26x 26x 26x 3x 26x 3x 3x | import React from 'react' import PropTypes from 'prop-types' import styled from 'styled-components' import Text from './../Typography/Text' import IcomoonMap from './IcomoonMap' const getHoverColor = (selectable, theme) => selectable ? theme['iconHoverColor'] : theme['iconColor'] const Wrapper = styled(Text)` color: ${(props) => props.theme['iconColor']}; cursor: ${(props) => (props.selectable ? 'pointer' : 'inherit')}; &:hover { color: ${(props) => getHoverColor(props.selectable, props.theme)}; } &::before { font-family: 'icomoon'; content: '${(props) => props.code}'; } ` const Icon = ({ name, ...rest }) => ( <Wrapper {...rest} code={IcomoonMap[name]} /> ) Icon.propTypes = { name: PropTypes.string.isRequired, selectable: PropTypes.bool, } Icon.defaultProps = { name: 'bitcoin', selectable: false, size: '40px', weight: 400, } export default Icon |