maverick/flex-template-web
1
0
Fork 0
mirror of https://github.com/kingomarnajjar/flex-template-web.git synced 2026-07-26 06:47:17 +10:00
Code Issues Projects Releases Packages Wiki Activity Actions

Review (single) star icon

Browse source
This commit is contained in:
Vesa Luusua 2017-11-27 15:21:11 +02:00
parent f1f96ff8c4
commit 69c2d39aa9
5 changed files with 63 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/components/IconReviewStar/IconReviewStar.css Normal file
View file

@ -0,0 +1,9 @@
@import '../../marketplace.css';
.root {
fill: var(--matterColorNegative);
}
.filled {
fill: var(--marketplaceColor);
}

13
src/components/IconReviewStar/IconReviewStar.example.js Normal file
View file

@ -0,0 +1,13 @@
import IconReviewStar from './IconReviewStar';
export const DefaultIcon = {
component: IconReviewStar,
props: {},
group: 'icons',
};
export const FilledIcon = {
component: IconReviewStar,
props: { isFilled: true },
group: 'icons',
};

38
src/components/IconReviewStar/IconReviewStar.js Normal file
View file

@ -0,0 +1,38 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import css from './IconReviewStar.css';
const IconReviewStar = props => {
const { className, rootClassName, isFilled } = props;
const filledOrDefault = isFilled ? css.filled : css.root;
const classes = classNames(rootClassName || filledOrDefault, className);
return (
<svg
className={classes}
width="23"
height="23"
viewBox="0 0 23 23"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M22.938 8.008c-.15-.412-.544-.69-.985-.69H14.38L12.507.758C12.377.31 11.967 0 11.5 0c-.467 0-.88.31-1.006.76L8.618 7.317H1.046c-.442 0-.833.278-.983.69-.15.414-.025.876.314 1.16l5.7 4.75L3.2 21.59c-.16.43-.02.916.346 1.196.362.28.87.29 1.242.02l6.71-4.79 6.713 4.79c.375.27.88.26 1.245-.02.366-.28.504-.765.343-1.196l-2.875-7.67 5.7-4.75c.34-.284.463-.746.315-1.16"
fillRule="evenodd"
/>
</svg>
);
};
IconReviewStar.defaultProps = { className: null, rootClassName: null, isFilled: false };
const { bool, string } = PropTypes;
IconReviewStar.propTypes = {
className: string,
rootClassName: string,
isFilled: bool,
};
export default IconReviewStar;

1
src/components/index.js
View file

@ -37,6 +37,7 @@ export { default as IconEmailSent } from './IconEmailSent/IconEmailSent';
export { default as IconEmailSuccess } from './IconEmailSuccess/IconEmailSuccess';
export { default as IconKeys } from './IconKeys/IconKeys';
export { default as IconKeysSuccess } from './IconKeysSuccess/IconKeysSuccess';
export { default as IconReviewStar } from './IconReviewStar/IconReviewStar';
export { default as IconSearch } from './IconSearch/IconSearch';
export {
default as IconSocialMediaFacebook,

2
src/examples.js
View file

@ -20,6 +20,7 @@ import * as IconEmailSuccess from './components/IconEmailSuccess/IconEmailSucces
import * as IconKeys from './components/IconKeys/IconKeys.example';
import * as IconKeysSuccess from './components/IconKeysSuccess/IconKeysSuccess.example';
import * as IconSearch from './components/IconSearch/IconSearch.example';
import * as IconReviewStar from './components/IconReviewStar/IconReviewStar.example';
import * as IconSocialMediaFacebook from './components/IconSocialMediaFacebook/IconSocialMediaFacebook.example';
import * as IconSocialMediaInstagram from './components/IconSocialMediaInstagram/IconSocialMediaInstagram.example';
import * as IconSocialMediaTwitter from './components/IconSocialMediaTwitter/IconSocialMediaTwitter.example';
@ -88,6 +89,7 @@ export {
IconEmailSuccess,
IconKeys,
IconKeysSuccess,
IconReviewStar,
IconSearch,
IconSocialMediaFacebook,
IconSocialMediaInstagram,