feat(01-02): integrate WeightInput and RepsInput into ExerciseCard set rows

- Import WeightInput and RepsInput in WorkoutPage.jsx
- Replace bare <input type="number"> elements with stepper components
- Update .set-inputs alignment to flex-start for taller steppers
- Update .set-row alignment to flex-start
- Remove now-redundant .weight-input and .reps-input CSS rules (main + mobile)
This commit is contained in:
2026-02-16 08:21:26 +01:00
parent eb00ce739d
commit 8bb221e829
2 changed files with 9 additions and 37 deletions
+6 -12
View File
@@ -1,5 +1,7 @@
import { useState, useEffect } from 'react'
import { Icon } from '../components/Icons'
import WeightInput from '../components/WeightInput'
import RepsInput from '../components/RepsInput'
// Uppvärmningsövningar baserat på muskelgrupp
const warmupExercises = {
@@ -324,22 +326,14 @@ function ExerciseCard({ exercise, logs, progression, expanded, onToggle, onLogSe
<div key={setNum} className={`set-row ${input.completed ? 'completed' : ''}`}>
<span className="set-number">Set {setNum}</span>
<div className="set-inputs">
<input
type="number"
placeholder="kg"
<WeightInput
value={input.weight}
onChange={(e) => handleInputChange(setNum, 'weight', e.target.value)}
className="weight-input"
inputMode="decimal"
onChange={(val) => handleInputChange(setNum, 'weight', val)}
/>
<span className="input-separator">×</span>
<input
type="number"
placeholder="reps"
<RepsInput
value={input.reps}
onChange={(e) => handleInputChange(setNum, 'reps', e.target.value)}
className="reps-input"
inputMode="numeric"
onChange={(val) => handleInputChange(setNum, 'reps', val)}
/>
</div>
<button