Mission 11: Rapid System Deployment
The outpost's main status panel is unstyled. Use the ALC library to quickly turn it into a styled card by applying a background color and padding.
00:00
Mission Objective
Create a CSS class named `.card` and give it a `background-color` of `#222`, a `padding` of `1rem`, and a `border-radius` of `8px`.
Step 1 / 3
System Briefing: ALC Component Library
A new mining outpost on Titan needs a complete administrative UI, and it's needed by tomorrow. There's no time to write custom styles. You must use the pre-built Astro-Logic Command (ALC) Component Library, a utility-first CSS framework that allows for rapid development.
Utility-First Philosophy
Instead of writing CSS rules in a separate file, a utility-first framework provides small, single-purpose classes that you apply directly in your HTML. You build complex components by composing these utilities.
p-4might mean "add 1rem of padding."bg-primarymight mean "use the primary background color."rounded-lgmight mean "apply a large border-radius."