Fixed syntax for Alert boxes in Success.jsx and Cancel.jsx

This commit is contained in:
2025-09-28 02:37:05 +02:00
parent a866801535
commit c636e23b44
2 changed files with 14 additions and 10 deletions

View File

@@ -40,10 +40,12 @@ const Cancel = () => {
<div className="payment-container"> <div className="payment-container">
<Alert.Root status="error" title="Payment Cancelled"> <Alert.Root status="error" title="Payment Cancelled">
<Alert.Indicator /> <Alert.Indicator />
<Alert.Title>Payment Cancelled</Alert.Title> <Alert.Content>
<Alert.Description> <Alert.Title>Payment Cancelled</Alert.Title>
<Text>Your payment was cancelled. You can try again or choose a different payment method.</Text> <Alert.Description>
</Alert.Description> <Text>Your payment was cancelled. You can try again or choose a different payment method.</Text>
</Alert.Description>
</Alert.Content>
</Alert.Root> </Alert.Root>
{/*<div className={`payment-status-icon ${getIconClass()}`}>*/} {/*<div className={`payment-status-icon ${getIconClass()}`}>*/}

View File

@@ -79,12 +79,14 @@ const Success = () => {
<div className="payment-container"> <div className="payment-container">
<Alert.Root status="success" title="Payment Successful!" mb="5"> <Alert.Root status="success" title="Payment Successful!" mb="5">
<Alert.Indicator /> <Alert.Indicator />
<Alert.Title>Payment Successful!</Alert.Title> <Alert.Content>
<Alert.Description> <Alert.Title>Payment Successful!</Alert.Title>
<Text>Thank you for your payment. Your transaction has been completed successfully.</Text> <Alert.Description>
<Text>A confirmation email has been sent to your email address with all the transaction details.</Text> <Text>Thank you for your payment. Your transaction has been completed successfully.</Text>
<Text>Redirecting you back to checkout in <strong>{countdown}</strong> seconds...</Text> <Text>A confirmation email has been sent to your email address with all the transaction details.</Text>
</Alert.Description> <Text>Redirecting you back to checkout in <strong>{countdown}</strong> seconds...</Text>
</Alert.Description>
</Alert.Content>
</Alert.Root> </Alert.Root>
<DataList.Root orientation="horizontal"> <DataList.Root orientation="horizontal">