Intermediate
Use a CSS Module (simulated)
The styles object stands in for import styles from "./Card.module.css"; the CSS tab holds the generated rules. Never type the generated names yourself: always use styles.something.
Render three cards from plans. Each card is an <article> with styles.card, and its <h2> has styles.title.
Clicking a card selects it: the selected card also gets styles.selected (and only one card is selected at a time). Give each article aria-pressed set to whether it is selected.
What Check tests
- Three articles with the scoped card class
- Each title has the scoped title class (and is blue)
- The code uses the styles object, not hand-typed names
- Clicking Pro selects it
- Clicking Team moves the selection
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Runs in your browser. Your code is saved here.
Your page
Press Run to see the page.
Console
Nothing logged yet.