crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add default color to icons

Browse Source
This commit is contained in:
Fred Carlsen
2019-02-15 15:44:42 +01:00
committed by Jacob Evans
parent ee1c6a1ce1
commit 88c33fa4d4
1 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/website/ts/components/icon.tsx
View File

@@ -4,8 +4,10 @@ import styled from 'styled-components';
import { Paragraph } from 'ts/components/text';
import { getCSSPadding, PaddingInterface } from 'ts/constants/utilities';
import { colors } from 'ts/style/colors';
interface IconProps extends PaddingInterface {
color?: string;
name?: string;
component?: React.ReactNode;
size?: 'small' | 'medium' | 'large' | 'hero' | number;
@@ -32,6 +34,10 @@ export const Icon: React.FunctionComponent<IconProps> = (props: IconProps) => {
return null;
};
Icon.defaultProps = {
color: colors.brandLight,
};
export const InlineIconWrap = styled.div<PaddingInterface>`
margin: ${props => getCSSPadding(props.margin)};
display: flex;
@@ -52,6 +58,7 @@ const _getSize = (size: string | number = 'small'): string => {
};
const StyledIcon = styled.figure<IconProps>`
color: ${props => props.color && props.color};
width: ${props => _getSize(props.size)};
height: ${props => _getSize(props.size)};
margin: ${props => getCSSPadding(props.margin)};