fix: ensure isBaseRecipe checkbox submits correctly and use styled Toggle component
All checks were successful
CI / update (push) Successful in 1m12s

- Add hidden input to properly serialize isBaseRecipe boolean as "true"/"false" string
- Replace plain HTML checkbox with Toggle component for consistent styling
- Checkbox values don't submit when unchecked; hidden input ensures value is always sent
This commit is contained in:
2026-01-13 15:33:08 +01:00
parent 5ca044c79f
commit db5d326fa2
2 changed files with 12 additions and 18 deletions

View File

@@ -8,6 +8,7 @@
import CardAdd from '$lib/components/CardAdd.svelte'; import CardAdd from '$lib/components/CardAdd.svelte';
import CreateIngredientList from '$lib/components/CreateIngredientList.svelte'; import CreateIngredientList from '$lib/components/CreateIngredientList.svelte';
import CreateStepList from '$lib/components/CreateStepList.svelte'; import CreateStepList from '$lib/components/CreateStepList.svelte';
import Toggle from '$lib/components/Toggle.svelte';
import '$lib/css/action_button.css'; import '$lib/css/action_button.css';
import '$lib/css/nordtheme.css'; import '$lib/css/nordtheme.css';
@@ -331,17 +332,13 @@ button.action_button {
<input type="hidden" name="category" value={card_data.category} /> <input type="hidden" name="category" value={card_data.category} />
<input type="hidden" name="icon" value={card_data.icon} /> <input type="hidden" name="icon" value={card_data.icon} />
<input type="hidden" name="portions" value={portions_local} /> <input type="hidden" name="portions" value={portions_local} />
<input type="hidden" name="isBaseRecipe" value={isBaseRecipe ? "true" : "false"} />
<div style="text-align: center; margin: 1rem;"> <div style="text-align: center; margin: 1rem;">
<label style="font-size: 1.1rem; cursor: pointer;"> <Toggle
<input
type="checkbox"
name="isBaseRecipe"
bind:checked={isBaseRecipe} bind:checked={isBaseRecipe}
style="width: auto; display: inline; margin-right: 0.5em;" label="Als Basisrezept markieren (kann von anderen Rezepten referenziert werden)"
/> />
Als Basisrezept markieren (kann von anderen Rezepten referenziert werden)
</label>
</div> </div>
<div class="title_container"> <div class="title_container">

View File

@@ -11,6 +11,7 @@
import CardAdd from '$lib/components/CardAdd.svelte'; import CardAdd from '$lib/components/CardAdd.svelte';
import CreateIngredientList from '$lib/components/CreateIngredientList.svelte'; import CreateIngredientList from '$lib/components/CreateIngredientList.svelte';
import CreateStepList from '$lib/components/CreateStepList.svelte'; import CreateStepList from '$lib/components/CreateStepList.svelte';
import Toggle from '$lib/components/Toggle.svelte';
import { season } from '$lib/js/season_store'; import { season } from '$lib/js/season_store';
import { portions } from '$lib/js/portions_store'; import { portions } from '$lib/js/portions_store';
import '$lib/css/action_button.css'; import '$lib/css/action_button.css';
@@ -417,17 +418,13 @@
<input type="hidden" name="category" value={card_data.category} /> <input type="hidden" name="category" value={card_data.category} />
<input type="hidden" name="icon" value={card_data.icon} /> <input type="hidden" name="icon" value={card_data.icon} />
<input type="hidden" name="portions" value={portions_local} /> <input type="hidden" name="portions" value={portions_local} />
<input type="hidden" name="isBaseRecipe" value={isBaseRecipe ? "true" : "false"} />
<div style="text-align: center; margin: 1rem;"> <div style="text-align: center; margin: 1rem;">
<label style="font-size: 1.1rem; cursor: pointer;"> <Toggle
<input
type="checkbox"
name="isBaseRecipe"
bind:checked={isBaseRecipe} bind:checked={isBaseRecipe}
style="width: auto; display: inline; margin-right: 0.5em;" label="Als Basisrezept markieren (kann von anderen Rezepten referenziert werden)"
/> />
Als Basisrezept markieren (kann von anderen Rezepten referenziert werden)
</label>
</div> </div>
<!-- Recipe Note Component --> <!-- Recipe Note Component -->