4. Homepage and Bootstrap
###config/routes.rb
root 'posts#index'
###app/views/layouts/application.html.erb
... <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> ... <header class="jumbotron site-header"> <div class="container text-center"> <h1>My Rails Blog</h1> </div> </header> <div class="container"> <%= yield %> </div> ...
###app/assets/stylesheets/scaffolds.scss
(Delete everything inside of this file)
###app/assets/stylesheets/posts.scss
.site-header { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3100b8+0,2f00ea+33,2f00ea+33,3103ff+50,8067ff+100 */ background: #3100b8; /* Old browsers */ background: -moz-linear-gradient(left, #3100b8 0%, #2f00ea 33%, #2f00ea 33%, #3103ff 50%, #8067ff 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #3100b8 0%,#2f00ea 33%,#2f00ea 33%,#3103ff 50%,#8067ff 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #3100b8 0%,#2f00ea 33%,#2f00ea 33%,#3103ff 50%,#8067ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3100b8', endColorstr='#8067ff',GradientType=1 ); /* IE6-9 */ } .site-header h1 { color: white; }