Pills and Tables
Status pills and tables that fit the page. Date blocks are with the other dates and events, on News and Events.
Pills
A short status label. Gray unless given a tone: green for done or available, amber for waiting or missing. Amber, never red: a missing item isn't an error. Pills stay on one line, except in app tables below 1200px.
cmu-pill, cmu-pill--green, cmu-pill--amber
Syllabus Available Syllabus Unavailable No Syllabus Expected
Tables
Use the template's table.alternate for striped rows. Add
cmu-full to stretch a table to full width from 768px up (below that, the
template lets it scroll sideways). cmu-compare splits a two-column table
evenly, for before-and-after comparisons. Cells are centered top to bottom, so a
one-line cell sits level with a wrapped one or a picture beside it; to center pictures
of different widths across their column too, add the template's
aligncenter to those cells.
table.cmu-full, table.cmu-compare
| Before | Now |
|---|---|
| One file per section | One file can cover many sections |
| Count modules to see where you stand | A completion bar and status filters |