diff --git a/src/components/sprite-selector-item/sprite-selector-item.jsx b/src/components/sprite-selector-item/sprite-selector-item.jsx index c1b288a8cc4a4b777f0f626d3dc3f366f10211d9..abb47bb5478bcb572726ac2a838f88efe8476e06 100644 --- a/src/components/sprite-selector-item/sprite-selector-item.jsx +++ b/src/components/sprite-selector-item/sprite-selector-item.jsx @@ -19,8 +19,8 @@ const SpriteSelectorItem = props => ( [styles.isSelected]: props.selected }), onClick: props.onClick, - onMouseOver: props.onMouseOver, - onMouseOut: props.onMouseOut + onMouseEnter: props.onMouseEnter, + onMouseLeave: props.onMouseLeave }} id={`${props.name}-${contextMenuId}`} > @@ -72,8 +72,8 @@ SpriteSelectorItem.propTypes = { onClick: PropTypes.func, onDeleteButtonClick: PropTypes.func, onDuplicateButtonClick: PropTypes.func, - onMouseOut: PropTypes.func, - onMouseOver: PropTypes.func, + onMouseEnter: PropTypes.func, + onMouseLeave: PropTypes.func, selected: PropTypes.bool.isRequired }; diff --git a/src/components/sprite-selector/sprite-selector.css b/src/components/sprite-selector/sprite-selector.css index d46e050869d806bece00779ed089a4d514c06400..ec5cfee2b786dfebbfb66e94f80ace2651f7006d 100644 --- a/src/components/sprite-selector/sprite-selector.css +++ b/src/components/sprite-selector/sprite-selector.css @@ -115,32 +115,32 @@ } .receivedBlocks { - -webkit-animation: glowing 250ms; - -moz-animation: glowing 250ms; - -o-animation: glowing 250ms; - animation: glowing 250ms; + -webkit-animation: glowing 250ms; + -moz-animation: glowing 250ms; + -o-animation: glowing 250ms; + animation: glowing 250ms; } @-webkit-keyframes glowing { - 10% { -webkit-box-shadow: 0 0 10px #7fff1e; } - 90% { -webkit-box-shadow: 0 0 10px #7fff1e; } - 100% { -webkit-box-shadow: none; } + 10% { -webkit-box-shadow: 0 0 10px #7fff1e; } + 90% { -webkit-box-shadow: 0 0 10px #7fff1e; } + 100% { -webkit-box-shadow: none; } } @-moz-keyframes glowing { - 10% { -moz-box-shadow: 0 0 10px #7fff1e; } - 90% { -moz-box-shadow: 0 0 10px #7fff1e; } - 100% { -moz-box-shadow: none; } + 10% { -moz-box-shadow: 0 0 10px #7fff1e; } + 90% { -moz-box-shadow: 0 0 10px #7fff1e; } + 100% { -moz-box-shadow: none; } } @-o-keyframes glowing { - 10% { box-shadow: 0 0 10px #7fff1e; } - 90% { box-shadow: 0 0 10px #7fff1e; } - 100% { box-shadow: none; } + 10% { box-shadow: 0 0 10px #7fff1e; } + 90% { box-shadow: 0 0 10px #7fff1e; } + 100% { box-shadow: none; } } @keyframes glowing { - 10% { box-shadow: 0 0 10px #7fff1e; } - 90% { box-shadow: 0 0 10px #7fff1e; } - 100% { box-shadow: none; } -} \ No newline at end of file + 10% { box-shadow: 0 0 10px #7fff1e; } + 90% { box-shadow: 0 0 10px #7fff1e; } + 100% { box-shadow: none; } +} diff --git a/src/containers/sprite-selector-item.jsx b/src/containers/sprite-selector-item.jsx index 44253e6cfa66644d82d4987db97c38f3edeafc77..edb124b2c6086874d40cbc6734c0f892efb3c6a4 100644 --- a/src/containers/sprite-selector-item.jsx +++ b/src/containers/sprite-selector-item.jsx @@ -14,8 +14,8 @@ class SpriteSelectorItem extends React.Component { 'handleClick', 'handleDelete', 'handleDuplicate', - 'handleMouseOut', - 'handleMouseOver' + 'handleMouseEnter', + 'handleMouseLeave' ]); } handleClick (e) { @@ -34,10 +34,10 @@ class SpriteSelectorItem extends React.Component { e.stopPropagation(); // To prevent from bubbling back to handleClick this.props.onDuplicateButtonClick(this.props.id); } - handleMouseOut () { + handleMouseLeave () { this.props.dispatchSetHoveredSprite(null); } - handleMouseOver () { + handleMouseEnter () { this.props.dispatchSetHoveredSprite(this.props.id); } render () { @@ -57,8 +57,8 @@ class SpriteSelectorItem extends React.Component { onClick={this.handleClick} onDeleteButtonClick={onDeleteButtonClick ? this.handleDelete : null} onDuplicateButtonClick={onDuplicateButtonClick ? this.handleDuplicate : null} - onMouseOut={this.handleMouseOut} - onMouseOver={this.handleMouseOver} + onMouseEnter={this.handleMouseEnter} + onMouseLeave={this.handleMouseLeave} {...props} /> ); diff --git a/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap b/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap index 0b61da9d06838078c76000e5e59bebea5079f2f7..4ecf19565c1de4f56bef8dfb883fda7e6d199f56 100644 --- a/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap +++ b/test/unit/components/__snapshots__/sprite-selector-item.test.jsx.snap @@ -6,8 +6,9 @@ exports[`SpriteSelectorItemComponent matches snapshot when selected 1`] = ` onClick={[Function]} onContextMenu={[Function]} onMouseDown={[Function]} + onMouseEnter={undefined} + onMouseLeave={undefined} onMouseOut={[Function]} - onMouseOver={undefined} onMouseUp={[Function]} onTouchEnd={[Function]} onTouchStart={[Function]}