Startup Credits Pricing Block for React

Edit the constants at the top of the file. CREDITS and MONTHS give the figure and the term, and the monthly average in the facts is worked out from them. FACTS lists the three facts beside the figure. CRITERIA lists the statements, each with an id, a title and a detail; the grid fits three on one row from lg, and the meter, the status line and the button follow however many you list.

No. The boxes are a self-declaration that gates the button, which keeps people who clearly don't qualify from applying. Check every claim on your server before you grant credits, against the company's filings or your funding data, and say so on the page, as the line under the band does. The page's state is never proof.

When all three are ticked the button is a real link. It's a ShineButton with render set to an a element and nativeButton={false}. Point it at your application form. Until then it's a disabled button with the same look at half strength, so it appears to turn on in place.

Yes. The three statements are a group named "Confirm each one to apply", and each checkbox is named by its statement and described by its detail line. A polite status line says "1 of 3 confirmed" and then "All three confirmed. You can apply." The credit figure is read once, as "$25,000 in platform credits over 12 months", and its display-size copy is hidden from assistive technology. Focus rings show on each checkbox.

Everything stacks: the figure first, scaled to fit at 320 pixels, then the three facts, the three statements as ruled rows, and the meter above a full-width button. The button lands within the first screen and a half of an iPhone. In right-to-left pages the layout mirrors and the dollar figures stay left to right.

The conditions are few and yes-or-no, so ticking them is faster than a form and the visitor sees the bar before they commit. A longer or open-ended application needs a real form; link to it from the apply button.