diff options
Diffstat (limited to 'src/components/ui')
-rw-r--r-- | src/components/ui/AppLoader.js | 2 | ||||
-rw-r--r-- | src/components/ui/InfoBar.js | 7 | ||||
-rw-r--r-- | src/components/ui/Loader.js | 5 | ||||
-rw-r--r-- | src/components/ui/Subscription.js | 19 |
4 files changed, 26 insertions, 7 deletions
diff --git a/src/components/ui/AppLoader.js b/src/components/ui/AppLoader.js index 64a212969..ac3cdcb05 100644 --- a/src/components/ui/AppLoader.js +++ b/src/components/ui/AppLoader.js | |||
@@ -8,7 +8,7 @@ export default function () { | |||
8 | <div className="app-loader"> | 8 | <div className="app-loader"> |
9 | <Appear> | 9 | <Appear> |
10 | <h1 className="app-loader__title">Franz</h1> | 10 | <h1 className="app-loader__title">Franz</h1> |
11 | <Loader /> | 11 | <Loader color="#FFF" /> |
12 | </Appear> | 12 | </Appear> |
13 | </div> | 13 | </div> |
14 | ); | 14 | ); |
diff --git a/src/components/ui/InfoBar.js b/src/components/ui/InfoBar.js index aea2bd888..84a5f1446 100644 --- a/src/components/ui/InfoBar.js +++ b/src/components/ui/InfoBar.js | |||
@@ -61,10 +61,13 @@ export default class InfoBar extends Component { | |||
61 | [`${className}`]: true, | 61 | [`${className}`]: true, |
62 | })} | 62 | })} |
63 | > | 63 | > |
64 | <div onClick={onClick} className="info-bar__content"> | 64 | <div className="info-bar__content"> |
65 | {children} | 65 | {children} |
66 | {ctaLabel && ( | 66 | {ctaLabel && ( |
67 | <button className="info-bar__cta"> | 67 | <button |
68 | className="info-bar__cta" | ||
69 | onClick={onClick} | ||
70 | > | ||
68 | <Loader | 71 | <Loader |
69 | loaded={!ctaLoading} | 72 | loaded={!ctaLoading} |
70 | lines={10} | 73 | lines={10} |
diff --git a/src/components/ui/Loader.js b/src/components/ui/Loader.js index e4fbd96a2..f73296bb6 100644 --- a/src/components/ui/Loader.js +++ b/src/components/ui/Loader.js | |||
@@ -9,12 +9,14 @@ export default class LoaderComponent extends Component { | |||
9 | children: oneOrManyChildElements, | 9 | children: oneOrManyChildElements, |
10 | loaded: PropTypes.bool, | 10 | loaded: PropTypes.bool, |
11 | className: PropTypes.string, | 11 | className: PropTypes.string, |
12 | color: PropTypes.string, | ||
12 | }; | 13 | }; |
13 | 14 | ||
14 | static defaultProps = { | 15 | static defaultProps = { |
15 | children: null, | 16 | children: null, |
16 | loaded: false, | 17 | loaded: false, |
17 | className: '', | 18 | className: '', |
19 | color: '#373a3c', | ||
18 | }; | 20 | }; |
19 | 21 | ||
20 | render() { | 22 | render() { |
@@ -22,6 +24,7 @@ export default class LoaderComponent extends Component { | |||
22 | children, | 24 | children, |
23 | loaded, | 25 | loaded, |
24 | className, | 26 | className, |
27 | color, | ||
25 | } = this.props; | 28 | } = this.props; |
26 | 29 | ||
27 | return ( | 30 | return ( |
@@ -30,7 +33,7 @@ export default class LoaderComponent extends Component { | |||
30 | // lines={10} | 33 | // lines={10} |
31 | width={4} | 34 | width={4} |
32 | scale={0.6} | 35 | scale={0.6} |
33 | color="#373a3c" | 36 | color={color} |
34 | component="span" | 37 | component="span" |
35 | className={className} | 38 | className={className} |
36 | > | 39 | > |
diff --git a/src/components/ui/Subscription.js b/src/components/ui/Subscription.js index fe0925a26..8bff72095 100644 --- a/src/components/ui/Subscription.js +++ b/src/components/ui/Subscription.js | |||
@@ -93,6 +93,10 @@ const messages = defineMessages({ | |||
93 | id: 'subscription.mining.moreInformation', | 93 | id: 'subscription.mining.moreInformation', |
94 | defaultMessage: '!!!Get more information about this plan', | 94 | defaultMessage: '!!!Get more information about this plan', |
95 | }, | 95 | }, |
96 | euTaxInfo: { | ||
97 | id: 'subscription.euTaxInfo', | ||
98 | defaultMessage: '!!!EU residents: local sales tax may apply', | ||
99 | }, | ||
96 | }); | 100 | }); |
97 | 101 | ||
98 | @observer | 102 | @observer |
@@ -144,14 +148,18 @@ export default class SubscriptionForm extends Component { | |||
144 | label: `€ ${Object.hasOwnProperty.call(this.props.plan, 'year') | 148 | label: `€ ${Object.hasOwnProperty.call(this.props.plan, 'year') |
145 | ? `${this.props.plan.year.price} / ${intl.formatMessage(messages.typeYearly)}` | 149 | ? `${this.props.plan.year.price} / ${intl.formatMessage(messages.typeYearly)}` |
146 | : 'yearly'}`, | 150 | : 'yearly'}`, |
147 | }, { | ||
148 | value: 'mining', | ||
149 | label: intl.formatMessage(messages.typeMining), | ||
150 | }], | 151 | }], |
151 | }, | 152 | }, |
152 | }, | 153 | }, |
153 | }; | 154 | }; |
154 | 155 | ||
156 | if (this.props.plan.miner) { | ||
157 | form.fields.paymentTier.options.push({ | ||
158 | value: 'mining', | ||
159 | label: intl.formatMessage(messages.typeMining), | ||
160 | }); | ||
161 | } | ||
162 | |||
155 | if (this.props.showSkipOption) { | 163 | if (this.props.showSkipOption) { |
156 | form.fields.paymentTier.options.unshift({ | 164 | form.fields.paymentTier.options.unshift({ |
157 | value: 'skip', | 165 | value: 'skip', |
@@ -259,6 +267,11 @@ export default class SubscriptionForm extends Component { | |||
259 | onClick={() => handlePayment(this.form.$('paymentTier').value)} | 267 | onClick={() => handlePayment(this.form.$('paymentTier').value)} |
260 | /> | 268 | /> |
261 | )} | 269 | )} |
270 | {this.form.$('paymentTier').value !== 'skip' && this.form.$('paymentTier').value !== 'mining' && ( | ||
271 | <p className="legal"> | ||
272 | {intl.formatMessage(messages.euTaxInfo)} | ||
273 | </p> | ||
274 | )} | ||
262 | </Loader> | 275 | </Loader> |
263 | ); | 276 | ); |
264 | } | 277 | } |