fix/billing-checkbox-alignment #17

Merged
thalla merged 11 commits from fix/billing-checkbox-alignment into master 2025-12-21 16:43:13 +02:00
Showing only changes of commit 5b08ca33b3 - Show all commits

View file

@ -226,17 +226,25 @@ export default function ProfilePage() {
<form onSubmit={onSaveBilling} style={{ display: 'grid', gap: 14 }}>
<label
className="amenity-option"
style={{ maxWidth: 520, display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12, minHeight: 52 }}
style={{
maxWidth: 520,
display: 'grid',
gridTemplateColumns: 'auto 1fr auto',
alignItems: 'center',
columnGap: 12,
minHeight: 52,
}}
>
<div className="amenity-option-meta" style={{ fontWeight: 600, minWidth: 0 }}>
<div className="amenity-option-meta" style={{ fontWeight: 600, display: 'grid', gridTemplateColumns: 'auto 1fr', gap: 8, alignItems: 'center', minWidth: 0 }}>
<span aria-hidden className="amenity-emoji">💸</span>
<span className="amenity-name">{t('billingEnableLabel')}</span>
</div>
<span />
<input
type="checkbox"
checked={billingEnabled}
onChange={(e) => setBillingEnabled(e.target.checked)}
style={{ width: 22, height: 22, margin: 0, alignSelf: 'center' }}
style={{ width: 22, height: 22, margin: 0, justifySelf: 'center' }}
/>
</label>
{billingEnabled ? (
@ -252,17 +260,25 @@ export default function ProfilePage() {
</label>
<label
className="amenity-option"
style={{ maxWidth: 520, display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12, minHeight: 52 }}
style={{
maxWidth: 520,
display: 'grid',
gridTemplateColumns: 'auto 1fr auto',
alignItems: 'center',
columnGap: 12,
minHeight: 52,
}}
>
<div className="amenity-option-meta" style={{ fontWeight: 600, minWidth: 0 }}>
<div className="amenity-option-meta" style={{ fontWeight: 600, display: 'grid', gridTemplateColumns: 'auto 1fr', gap: 8, alignItems: 'center', minWidth: 0 }}>
<span aria-hidden className="amenity-emoji">🧾</span>
<span className="amenity-name">{t('billingIncludeVat')}</span>
</div>
<span />
<input
type="checkbox"
checked={billingIncludeVatLine}
onChange={(e) => setBillingIncludeVatLine(e.target.checked)}
style={{ width: 22, height: 22, margin: 0, alignSelf: 'center' }}
style={{ width: 22, height: 22, margin: 0, justifySelf: 'center' }}
/>
</label>
</div>