diff options
author | Stefan Malzner <stefan@adlk.io> | 2019-07-04 15:54:27 +0200 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2019-07-04 15:54:27 +0200 |
commit | 268db27162e8d2cd0252b1be9bf69006cf6323ca (patch) | |
tree | 6ca47ee4159ba79f88d8848ac2ba9a8a8a7700da /src/components/ui/FeatureItem.js | |
parent | Merge branch 'release/5.2.0-beta.4' into feature/new-pricing (diff) | |
download | ferdium-app-268db27162e8d2cd0252b1be9bf69006cf6323ca.tar.gz ferdium-app-268db27162e8d2cd0252b1be9bf69006cf6323ca.tar.zst ferdium-app-268db27162e8d2cd0252b1be9bf69006cf6323ca.zip |
Add trial onboarding during signup
Diffstat (limited to 'src/components/ui/FeatureItem.js')
-rw-r--r-- | src/components/ui/FeatureItem.js | 36 |
1 files changed, 36 insertions, 0 deletions
diff --git a/src/components/ui/FeatureItem.js b/src/components/ui/FeatureItem.js new file mode 100644 index 000000000..a63f5f7b5 --- /dev/null +++ b/src/components/ui/FeatureItem.js | |||
@@ -0,0 +1,36 @@ | |||
1 | import React from 'react'; | ||
2 | import injectSheet from 'react-jss'; | ||
3 | import { Icon } from '@meetfranz/ui'; | ||
4 | import classnames from 'classnames'; | ||
5 | |||
6 | const styles = theme => ({ | ||
7 | featureItem: { | ||
8 | borderBottom: [1, 'solid', theme.legacyStyles.themeGrayDark], | ||
9 | padding: [8, 0], | ||
10 | display: 'flex', | ||
11 | alignItems: 'center', | ||
12 | }, | ||
13 | featureIcon: { | ||
14 | fill: theme.brandSuccess, | ||
15 | marginRight: 10, | ||
16 | }, | ||
17 | }); | ||
18 | |||
19 | export const FeatureItem = injectSheet(styles)(({ | ||
20 | classes, className, name, icon, | ||
21 | }) => ( | ||
22 | <li className={classnames({ | ||
23 | [classes.featureItem]: true, | ||
24 | [className]: className, | ||
25 | })} | ||
26 | > | ||
27 | {icon ? ( | ||
28 | <span className={classes.featureIcon}>{icon}</span> | ||
29 | ) : ( | ||
30 | <Icon icon="mdiCheckCircle" className={classes.featureIcon} size={1.5} /> | ||
31 | )} | ||
32 | {name} | ||
33 | </li> | ||
34 | )); | ||
35 | |||
36 | export default FeatureItem; | ||