nilsjohan/recipe-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: enhance RecipeDetailClient with portion section and instructions styling

Browse Source
This commit is contained in:
Nils-Johan Gynther
2026-04-17 19:05:09 +02:00
parent 8d1584cdb8
commit 4c0411a7f2
1 changed files with 8 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/app/recipes/[id]/RecipeDetailClient.tsx
+8 -2
View File
@@ -449,9 +449,12 @@ export default function RecipeDetailClient({ recipe: initialRecipe }: { recipe:
<textarea value={form.description} onChange={(e) => setForm((f) => ({ ...f, description: e.target.value }))} rows={3} style={{ ...inputStyle, fontFamily: 'inherit', resize: 'vertical', marginBottom: '1rem' }} /> <textarea value={form.description} onChange={(e) => setForm((f) => ({ ...f, description: e.target.value }))} rows={3} style={{ ...inputStyle, fontFamily: 'inherit', resize: 'vertical', marginBottom: '1rem' }} />
<label style={labelStyle}>Instruktioner</label> <label style={labelStyle}>Instruktioner</label>
<textarea value={form.instructions} onChange={(e) => setForm((f) => ({ ...f, instructions: e.target.value }))} rows={8} style={{ ...inputStyle, fontFamily: 'inherit', resize: 'vertical', marginBottom: '1rem' }} /> <textarea value={form.instructions} onChange={(e) => setForm((f) => ({ ...f, instructions: e.target.value }))} rows={8} style={{ ...inputStyle, fontFamily: 'inherit', resize: 'vertical' }} />
</section>
<label style={labelStyle}>Portioner</label> {/* Portioner */}
<section style={sectionStyle}>
<h2 style={sectionTitle}>Portioner</h2>
<input <input
type="number" type="number"
min={1} min={1}
@@ -461,6 +464,9 @@ export default function RecipeDetailClient({ recipe: initialRecipe }: { recipe:
style={{ ...inputStyle, width: '120px' }} style={{ ...inputStyle, width: '120px' }}
placeholder="t.ex. 4" placeholder="t.ex. 4"
/> />
<p style={{ fontSize: '0.85rem', color: '#666', marginTop: '0.4rem', marginBottom: 0 }}>
Anges portioner kan mängderna skalas på receptsidan.
</p>
</section> </section>
{/* Ingredienser */} {/* Ingredienser */}