fix: only phrasing content is allowed inside label element

This commit is contained in:
Christian Andolf
2024-10-29 13:35:13 +01:00
parent cfc400a619
commit a37cd3ff44
4 changed files with 35 additions and 24 deletions

View File

@@ -34,8 +34,8 @@ export default function Voucher() {
>
<div className={styles.vouchers}>
<label>
<Caption color="disabled" type="bold">
{vouchers}
<Caption color="disabled" type="bold" asChild>
<span>{vouchers}</span>
</Caption>
{/* <InfoCircleIcon color="white" className={styles.infoIcon} /> Out of scope for this release */}
</label>
@@ -49,21 +49,30 @@ export default function Voucher() {
arrow="left"
>
<div className={styles.options}>
<label className={`${styles.option} ${styles.checkboxVoucher}`}>
<Checkbox name="useVouchers" registerOptions={{ disabled: true }} />
<Caption color="disabled">{useVouchers}</Caption>
<div className={`${styles.option} ${styles.checkboxVoucher}`}>
<Checkbox name="useVouchers" registerOptions={{ disabled: true }}>
<Caption color="disabled" asChild>
<span>{useVouchers}</span>
</Caption>
</Checkbox>
{/* <InfoCircleIcon color="white" className={styles.infoIcon} /> Out of scope for this release */}
</label>
<label className={styles.option}>
<Checkbox name="useBonus" registerOptions={{ disabled: true }} />
<Caption color="disabled">{bonus}</Caption>
</div>
<div className={styles.option}>
<Checkbox name="useBonus" registerOptions={{ disabled: true }}>
<Caption color="disabled" asChild>
<span>{bonus}</span>
</Caption>
</Checkbox>
{/* <InfoCircleIcon color="white" className={styles.infoIcon} /> Out of scope for this release */}
</label>
<label className={styles.option}>
<Checkbox name="useReward" registerOptions={{ disabled: true }} />
<Caption color="disabled">{reward}</Caption>
</div>
<div className={styles.option}>
<Checkbox name="useReward" registerOptions={{ disabled: true }}>
<Caption color="disabled" asChild>
<span>{reward}</span>
</Caption>
</Checkbox>
{/* <InfoCircleIcon color="white" className={styles.infoIcon} /> Out of scope for this release */}
</label>
</div>
</div>
</Tooltip>
</div>