Circular ring showing percent complete next to a course label and a lessons-done caption.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Education3 } from "@/components/beste/piece/education3";
<Education3
completed={14}
total={24}
label="React performance"
/>Course tile with a gradient thumbnail, instructor byline, duration, and an inline progress bar.
Quiz outcome card with a trophy tile, pass or fail tint, score fraction, percent, and elapsed time.
Streak card with a flame badge, seven-day dot grid, and an encouraging caption underneath.
Single lesson entry with a status glyph on the left, title, duration, and padded index on the right.
Skill card with a violet level badge, XP numerator over denominator, and a gradient progress track.
Course metadata strip summarizing student count, star rating, and last updated in a three-column grid.