Running recap with total distance and time at the top and a per-kilometer pace and elevation table.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Health15 } from "@/components/beste/piece/health15";
<Health15
distance="10.2 km"
totalTime="49:18"
avgPace="4:49 / km"
label="Run"
splits={[
{
"km": 1,
"pace": "4:38",
"elevation": "+ 12 m"
},
{
"km": 2,
"pace": "4:52",
"elevation": "- 4 m"
},
{
"km": 3,
"pace": "4:41",
"elevation": "+ 8 m"
}
]}
tone="neutral"
/>Weekly training plan with focus labels, duration column, and per-row Done, Planned, or Rest states.
Lift tracker with an exercise header, set progress bar segments, and a rest-timer chip on the right.
Daily steps card with a gradient progress bar, percent chip, and a distance and calorie footer.
Cycle ring with day fraction in the middle, a phase label, next-period forecast, and a mood note.
Overnight sleep card with a score pill, stacked stage bar, and a four-column stage breakdown.
Recipe summary row with a warm chef tile, cook time, kcal, difficulty pill, and a dietary-tag row.