Skip to content

Latest commit

 

History

History
53 lines (40 loc) · 2.57 KB

File metadata and controls

53 lines (40 loc) · 2.57 KB

Bootstrap examples

So far, we've been ignoring CSS and styling in order to focus on Ruby and Rails.

How can we make our unstyled apps look professional, like this?

Target

You'll find the target within this app, at the URL /targets/landing. (The solution code is located in the public/ folder.)

Tasks

Make your home page look like /targets/landing.

Add Bootstrap and Font Awesome

Connect bootstrap.css and other assets by copying the following into the <head> of your documents; i.e., into layouts/application.html.erb.

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
    integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
   integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
   crossorigin="anonymous"></script>

<!-- Font Awesome -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/js/all.min.js"></script>

Handy links