Move total budget display

Move the total budget display in BudgetTabContent.tsx to be between the category budget inputs and the save button.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-17 12:21:55 +00:00
parent 625a1f605c
commit 90a20df7b7

View File

@@ -129,23 +129,26 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
{showBudgetInput && <div className="mt-4">
<div className="neuro-card p-4">
<div className="mb-4">
<h3 className="text-base font-medium mb-3"> : {formatCurrency(calculateTotalBudget())}</h3>
</div>
<div>
<h3 className="text-base font-medium mb-3"> </h3>
<CategoryBudgetInputs categoryBudgets={categoryBudgets} handleCategoryInputChange={handleCategoryInputChange} />
<div className="mt-4 flex justify-end">
<Button
onClick={handleSaveCategoryBudgets}
size="sm"
className="bg-neuro-income hover:bg-neuro-income/90 text-white"
>
<Check size={18} className="mr-1" />
</Button>
<div className="mt-4 border-t pt-3">
<div className="flex justify-between items-center mb-4">
<h3 className="text-base font-medium"> :</h3>
<p className="text-lg font-bold text-neuro-income">{formatCurrency(calculateTotalBudget())}</p>
</div>
<div className="flex justify-end">
<Button
onClick={handleSaveCategoryBudgets}
size="sm"
className="bg-neuro-income hover:bg-neuro-income/90 text-white"
>
<Check size={18} className="mr-1" />
</Button>
</div>
</div>
</div>
</div>