bakery-admin/bakery-ia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Add dark mode support to all wizard input fields

Browse Source 
- Added bg-[var(--bg-primary)] and text-[var(--text-primary)] CSS variables
- Fixes white background + white text issue in dark mode
- Applied to all input, select, and textarea elements across 8 wizards

Wizards fixed:
- InventoryWizard
- CustomerWizard
- SupplierWizard
- RecipeWizard
- EquipmentWizard
- QualityTemplateWizard
- TeamMemberWizard
- CustomerOrderWizard

(SalesEntryWizard was already fixed in previous commit)

This completes the dark mode UI improvements (High Priority item).
All form inputs now properly support dark mode with correct contrast.
This commit is contained in:
Claude
2025-11-09 21:25:36 +00:00
parent 9adc9725fd
commit 89e672cb4f
8 changed files with 60 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/components/domain/unified-wizard/wizards/RecipeWizard.tsx
View File

@@ -60,7 +60,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
value={recipeData.name}
onChange={(e) => setRecipeData({ ...recipeData, name: e.target.value })}
placeholder="Ej: Baguette Tradicional"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
/>
</div>
<div>
@@ -68,7 +68,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
<select
value={recipeData.category}
onChange={(e) => setRecipeData({ ...recipeData, category: e.target.value })}
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
>
<option value="bread">Pan</option>
<option value="pastry">Pastelería</option>
@@ -82,7 +82,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
<select
value={recipeData.finishedProductId}
onChange={(e) => setRecipeData({ ...recipeData, finishedProductId: e.target.value })}
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
disabled={loading}
>
<option value="">Seleccionar producto...</option>
@@ -98,7 +98,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
value={recipeData.yieldQuantity}
onChange={(e) => setRecipeData({ ...recipeData, yieldQuantity: e.target.value })}
placeholder="12"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
min="1"
/>
</div>
@@ -107,7 +107,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
<select
value={recipeData.yieldUnit}
onChange={(e) => setRecipeData({ ...recipeData, yieldUnit: e.target.value })}
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
>
<option value="units">Unidades</option>
<option value="kg">Kilogramos</option>
@@ -124,7 +124,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
value={recipeData.prepTime}
onChange={(e) => setRecipeData({ ...recipeData, prepTime: e.target.value })}
placeholder="60"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
min="0"
/>
</div>
@@ -134,7 +134,7 @@ const RecipeDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onNe
value={recipeData.instructions}
onChange={(e) => setRecipeData({ ...recipeData, instructions: e.target.value })}
placeholder="Pasos de preparación de la receta..."
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)]"
className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
rows={4}
/>
</div>