Text changes with earnings
This commit is contained in:
@@ -46,7 +46,8 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
colorBackground: "#ffffff",
|
||||
colorText: "#212529",
|
||||
colorDanger: "#dc3545",
|
||||
fontFamily: "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
|
||||
fontFamily:
|
||||
"system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
|
||||
fontSizeBase: "20px",
|
||||
borderRadius: "8px",
|
||||
spacingUnit: "4px",
|
||||
@@ -120,11 +121,17 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
style={{ backgroundColor: "rgba(0,0,0,0.5)" }}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div className={`modal-dialog ${step === "onboarding" ? "modal-xl" : "modal-lg"}`}>
|
||||
<div
|
||||
className={`modal-dialog ${
|
||||
step === "onboarding" ? "modal-xl" : "modal-lg"
|
||||
}`}
|
||||
>
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
<h5 className="modal-title">
|
||||
{step === "onboarding" ? "Complete Your Earnings Setup" : "Set Up Earnings"}
|
||||
{step === "onboarding"
|
||||
? "Complete Your Earnings Setup"
|
||||
: "Start Receiving Earnings"}
|
||||
</h5>
|
||||
<button
|
||||
type="button"
|
||||
@@ -136,21 +143,17 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
<div className="modal-body">
|
||||
{step === "start" && (
|
||||
<>
|
||||
<div className="text-center mb-4">
|
||||
<div className="text-primary mb-3">
|
||||
<i
|
||||
className="bi bi-cash-coin"
|
||||
style={{ fontSize: "3rem" }}
|
||||
></i>
|
||||
</div>
|
||||
<h4>Start Receiving Earnings</h4>
|
||||
<p className="text-muted">
|
||||
Set up your earnings account to automatically receive
|
||||
payments
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="row text-center mb-4">
|
||||
<div className="col-md-4">
|
||||
<div className="mb-3">
|
||||
<i
|
||||
className="bi bi-lightning text-primary"
|
||||
style={{ fontSize: "2rem" }}
|
||||
></i>
|
||||
</div>
|
||||
<h6>Quick Setup</h6>
|
||||
<small className="text-muted">Takes about 5 minutes</small>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="mb-3">
|
||||
<i
|
||||
@@ -160,19 +163,7 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
</div>
|
||||
<h6>Secure</h6>
|
||||
<small className="text-muted">
|
||||
Powered by Stripe, trusted by millions
|
||||
</small>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="mb-3">
|
||||
<i
|
||||
className="bi bi-clock text-primary"
|
||||
style={{ fontSize: "2rem" }}
|
||||
></i>
|
||||
</div>
|
||||
<h6>Instant Payouts</h6>
|
||||
<small className="text-muted">
|
||||
Transferred when rentals complete
|
||||
Powered by Stripe and trusted by millions
|
||||
</small>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
@@ -196,8 +187,6 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
<ul className="mb-0">
|
||||
<li>Verify your identity securely</li>
|
||||
<li>Provide bank account details for deposits</li>
|
||||
<li>The setup process takes about 5 minutes</li>
|
||||
<li>Receive payouts instantly when rentals complete</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@@ -225,17 +214,20 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
<>
|
||||
{!stripeConnectInstance ? (
|
||||
<div className="text-center py-5">
|
||||
<div className="spinner-border text-primary mb-3" role="status">
|
||||
<div
|
||||
className="spinner-border text-primary mb-3"
|
||||
role="status"
|
||||
>
|
||||
<span className="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
<h5>Loading onboarding form...</h5>
|
||||
</div>
|
||||
) : (
|
||||
<div style={{ minHeight: "500px" }}>
|
||||
<ConnectComponentsProvider connectInstance={stripeConnectInstance}>
|
||||
<ConnectAccountOnboarding
|
||||
onExit={handleOnboardingExit}
|
||||
/>
|
||||
<ConnectComponentsProvider
|
||||
connectInstance={stripeConnectInstance}
|
||||
>
|
||||
<ConnectAccountOnboarding onExit={handleOnboardingExit} />
|
||||
</ConnectComponentsProvider>
|
||||
</div>
|
||||
)}
|
||||
@@ -278,7 +270,8 @@ const StripeConnectOnboarding: React.FC<StripeConnectOnboardingProps> = ({
|
||||
{step === "onboarding" && stripeConnectInstance && (
|
||||
<div className="w-100">
|
||||
<small className="text-muted">
|
||||
<i className="bi bi-lock"></i> Your information is securely processed by Stripe
|
||||
<i className="bi bi-lock"></i> Your information is securely
|
||||
processed by Stripe
|
||||
</small>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -130,10 +130,9 @@ const EarningsDashboard: React.FC = () => {
|
||||
<div className="container mt-4">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<h1>My Earnings</h1>
|
||||
<h1>Earnings</h1>
|
||||
<p className="text-muted">
|
||||
Manage your rental earnings and payment setup. Community Rentals
|
||||
charges a 10% Community Upkeep Fee to help keep us running.{" "}
|
||||
Manage your rental earnings and payment setup.{" "}
|
||||
<Link to="/faq" target="_blank">
|
||||
Calculate what you can earn here
|
||||
</Link>{" "}
|
||||
|
||||
Reference in New Issue
Block a user