Adding Polish with Bootstrap Components

Our view looks pretty good—certainly better than what we might achieve in the same amount of time without Bootstrap—but it could be better. For example, the header text is a bit too large, no clear distinction exists between the three sections of the view, and the credit card information is a bit jumbled, since all the text uses the same size and weight font.

We’d like to distinguish parts of the view to make it easier for the user to visually navigate. If you look through Bootstrap’s documentation, you can get some inspiration as to how we can do this. The trick with complex forms is to allow users to navigate all the data with their eyes. We can get a long way with the panel component, which is a box ...

Get Rails, Angular, Postgres, and Bootstrap, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.