My footer looks great throughout my Rails app except for the Home page.
Here is the content of my application.html file:
<!DOCTYPE html>
<html>
<head>
<title><%= yield(:title) || "Wagon Rails" %></title>
<meta name="description" content="<%= (yield(:description) || "").squish %>">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<%= stylesheet_link_tag :application, media: "all" %>
<%= favicon_link_tag %>
<%= yield(:stylesheets) %>
<%= csrf_meta_tags %>
</head>
<body>
<%= render "shared/navbar" %>
<%= render "shared/flashes" %>
<%= yield %>
<%= render "shared/footer" %>
<%= javascript_include_tag "https://maps.google.com/maps/api/js?sensor=false" %>
<%= javascript_include_tag "https://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js" %>
<%= javascript_include_tag :application %>
<%= yield(:after_js) %>
</body>
</html>
Although the footer is placed after the yield in my layout and works well throughout the application, it seems to be misplaced on the Home page. Here is a screenshot of the Home page:
Below is the code for the Home page, which I adapted from a Bootstrap template:
<header class="background-cover">
<div class="header-content">
<div class="header-content-inner">
<h1>Your tennis tournament registrations and schedules in one click</h1>
<hr>
<p id="avectm"><strong>With TennisMatch, the struggle of registrations and scheduling is over. You can focus on the most important thing: giving your best on the court.</strong></p>
<%= link_to t(".sign_up", default: "Sign Up"), new_user_registration_path, class: "btn btn-success page-scroll pad", id: "inscr"%>
</div>
</div>
</header>
<!-- More content from the Home page -->
And here is the code for the footer, which is contained in views/shared/_footer.html.erb:
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 text-center">
<h2 class="section-heading">Contact Us!</h2>
<hr class="primary">
<p>Want to help us improve the site? Make a suggestion? Or just talk tennis over a cup of coffee? Feel free to get in touch with us!</p>
</div>
<div class="col-lg-4 col-lg-offset-2 text-center">
<i class="fa fa-phone fa-3x wow bounceIn"></i>
<p>06 66 02 74 14</p>
</div>
<div class="col-lg-4 text-center">
<i class="fa fa-envelope-o fa-3x wow bounceIn" data-wow-delay=".1s"></i>
<p><a href="mailto:contact@example.com">contact@example.com</a></p>
</div>
</div>
</div>
</section>