Update IconClose so it can be used in smaller size

This commit is contained in:
Jenni Nurmi 2018-12-21 11:49:13 +02:00
parent 9c31f3e0ea
commit 08eb9e3a6e
2 changed files with 21 additions and 1 deletions

View file

@ -5,3 +5,11 @@ export const Icon = {
props: {},
group: 'icons',
};
export const IconSmall = {
component: IconClose,
props: {
size: 'small',
},
group: 'icons',
};

View file

@ -3,11 +3,23 @@ import PropTypes from 'prop-types';
import classNames from 'classnames';
import css from './IconClose.css';
const SIZE_SMALL = 'small';
const IconClose = props => {
const { className, rootClassName } = props;
const { className, rootClassName, size } = props;
const classes = classNames(rootClassName || css.root, className);
if (size === SIZE_SMALL) {
return (
<svg className={classes} width="9" height="9" xmlns="http://www.w3.org/2000/svg">
<path
d="M2.175 8.396l2.482-2.482 2.482 2.482a.889.889 0 1 0 1.258-1.257L5.914 4.657l2.482-2.483A.89.89 0 0 0 7.139.917L4.657 3.4 2.175.918A.888.888 0 1 0 .917 2.174L3.4 4.657.918 7.139a.889.889 0 1 0 1.257 1.257"
fillRule="evenodd"
/>
</svg>
);
}
return (
<svg
className={classes}