r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

SVG Icon grows to container size

Browse source
This commit is contained in:
Andrew Nicolaou 2020-04-27 10:20:07 +02:00
parent a2145ad979
commit ec1c8210a1
1 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
client/common/Icon.jsx
View file

@ -3,6 +3,7 @@ import InlineSVG from 'react-inlinesvg';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React from 'react'; import React from 'react';
import lodash from 'lodash'; import lodash from 'lodash';
import styled from 'styled-components';
const icons = { const icons = {
sortArrowUp: require('../images/sort-arrow-up.svg'), sortArrowUp: require('../images/sort-arrow-up.svg'),
@ -24,10 +25,16 @@ const names = lodash.mapValues(icons, (value, key) => key);
export const ValidIconNameType = PropTypes.oneOf(Object.keys(names)); export const ValidIconNameType = PropTypes.oneOf(Object.keys(names));
const StyledInlineSVG = styled(InlineSVG)`
> svg {
width: 100%;
height: 100%;
}
`;
function Icon({ name, ...props }) { function Icon({ name, ...props }) {
return ( return (
<InlineSVG src={icons[name]} {...props} /> <StyledInlineSVG src={icons[name]} {...props} />
); );
} }