fix(budget): expose toolbar on mobile so users can add budget categories

This commit is contained in:
jubnl
2026-05-06 14:21:32 +02:00
parent a0c10e38f7
commit 0909abfa60
+4 -4
View File
@@ -719,8 +719,8 @@ export default function BudgetPanel({ tripId, tripMembers = [] }: BudgetPanelPro
<h2 style={{ margin: 0, fontSize: 18, fontWeight: 600, color: 'var(--text-primary)', letterSpacing: '-0.01em', flexShrink: 0 }}> <h2 style={{ margin: 0, fontSize: 18, fontWeight: 600, color: 'var(--text-primary)', letterSpacing: '-0.01em', flexShrink: 0 }}>
{t('budget.title')} {t('budget.title')}
</h2> </h2>
<div className="hidden md:flex" style={{ alignItems: 'center', gap: 8, marginLeft: 'auto', flexShrink: 0 }}> <div className="flex flex-wrap max-md:!w-full max-md:!mt-2" style={{ alignItems: 'center', gap: 8, marginLeft: 'auto', flexShrink: 0 }}>
<div style={{ width: 150 }}> <div className="max-md:!w-full" style={{ width: 150 }}>
<CustomSelect <CustomSelect
value={currency} value={currency}
onChange={setCurrency} onChange={setCurrency}
@@ -730,7 +730,7 @@ export default function BudgetPanel({ tripId, tripMembers = [] }: BudgetPanelPro
/> />
</div> </div>
{canEdit && ( {canEdit && (
<div style={{ display: 'flex', gap: 6, width: 260 }}> <div className="max-md:!w-full" style={{ display: 'flex', gap: 6, width: 260 }}>
<input <input
value={newCategoryName} value={newCategoryName}
onChange={e => setNewCategoryName(e.target.value)} onChange={e => setNewCategoryName(e.target.value)}
@@ -763,7 +763,7 @@ export default function BudgetPanel({ tripId, tripMembers = [] }: BudgetPanelPro
onMouseEnter={e => e.currentTarget.style.opacity = '0.88'} onMouseEnter={e => e.currentTarget.style.opacity = '0.88'}
onMouseLeave={e => e.currentTarget.style.opacity = '1'} onMouseLeave={e => e.currentTarget.style.opacity = '1'}
> >
<Download size={14} strokeWidth={2.5} /> CSV <Download size={14} strokeWidth={2.5} /> <span className="hidden sm:inline">CSV</span>
</button> </button>
</div> </div>
</div> </div>