diff --git a/packages/component-faraday-ui/src/IconButton.js b/packages/component-faraday-ui/src/IconButton.js index 5e4b4acfc0f531676ed49913b60bd8b960e871ee..ac1ef02ba87f4616ca9219694b41852b9bd1e5b5 100644 --- a/packages/component-faraday-ui/src/IconButton.js +++ b/packages/component-faraday-ui/src/IconButton.js @@ -1,7 +1,6 @@ import React from 'react' import { Icon } from '@pubsweet/ui' import styled from 'styled-components' - import { positionHelper, marginHelper, paddingHelper } from './styledHelpers' const IconButton = styled.div` @@ -10,7 +9,7 @@ const IconButton = styled.div` display: flex; justify-content: center; opacity: ${props => (props.disabled ? 0.7 : 1)}; - + pointer-events: ${props => (props.unclickable ? 'none' : 'auto')}; &:hover { opacity: 0.7; } @@ -18,16 +17,23 @@ const IconButton = styled.div` &[disabled] { cursor: not-allowed; } - ${marginHelper}; ${paddingHelper}; ${positionHelper}; ` -export default ({ icon, onClick, iconSize = 3, disabled, ...props }) => ( +export default ({ + icon, + onClick, + unclickable, + iconSize = 3, + disabled, + ...props +}) => ( <IconButton disabled={disabled} onClick={!disabled ? onClick : null} + unclickable={unclickable} {...props} > <Icon size={iconSize} {...props}> diff --git a/packages/component-faraday-ui/src/PasswordValidation.js b/packages/component-faraday-ui/src/PasswordValidation.js index 1b27643aa78d7da70eb124ee6476a02672b2fbb9..6dacbd6349dbae4446a0c68407b4d4d486dd6deb 100644 --- a/packages/component-faraday-ui/src/PasswordValidation.js +++ b/packages/component-faraday-ui/src/PasswordValidation.js @@ -52,7 +52,7 @@ const PasswordValidation = ({ </Row> <Row alignItems="center" justify="flex-start" mb={-1 / 2}> - <IconButton icon="info" iconSize={2} ml={-1 / 2} primary /> + <IconButton icon="info" iconSize={2} ml={-1 / 2} primary unclickable /> <RulesTitle>The password must contain: </RulesTitle> </Row>