root = Card([header, progressSection, nextSection, modulesSection, ratingSection, continueBtn], "card", "column", "l")
header = CardHeader("JavaScript Fundamentals", "Instructor: Maria Chen")
progressSection = Card([progressHeading, progressBar, progressText], "sunk")
progressHeading = Heading("Overall Progress", "h3")
progressBar = Progress(68, "68% complete")
progressText = TextContent("12 of 18 lessons completed", "small")
nextSection = Card([nextHeading, nextCallout], "sunk")
nextHeading = Heading("Up Next", "h3")
nextCallout = Callout("info", "Next Lesson: Closures & Scope", "Lesson 13 · 12 min · Start when ready")
modulesSection = Card([modulesHeading, modulesList], "sunk")
modulesHeading = Heading("Modules", "h3")
modulesList = ListBlock([module1, module2, module3], "number")
module1 = ListItem("Module 1: Basics", "Completed · 5/5 lessons", null, "View")
module2 = ListItem("Module 2: Functions", "Completed · 4/4 lessons", null, "View")
module3 = ListItem("Module 3: Advanced Topics", "In progress · 3/9 lessons", null, "View")
ratingSection = Card([ratingHeading, ratingText, ratingBadge], "sunk")
ratingHeading = Heading("Learner Rating", "h3")
ratingText = TextContent("Average rating from 2,340 learners", "small")
ratingBadge = Badge("4.8 / 5", "secondary")
continueBtn = Button("Continue Learning", null, "primary", null, "large")