<% content_for :body_class, "home-page" %>

<% content_for :canonical do %>
  <%= render "shared/canonical", href: root_url %>
<% end %>

<% provide :social_media_meta_tags do %>
  <%= render "shared/social_media_meta_tags",
              social_url: root_url %>
<% end %>

<div class="jumbo highlight">
  <div class="row">
    <div class="small-12 medium-9 small-centered column text-center">
      <h1><%= t("layouts.header.open_city_title") %></h1>
      <p class="lead">
        <%= t("layouts.header.open_city_slogan_html") %>
      </p>
      <div class="small-12 medium-6 large-4 small-centered">
        <%= link_to t("layouts.header.more_info"), more_info_path, class: "button expanded large" %>
      </div>
    </div>
  </div>
</div>

<% if feature?("user.recommendations") && (@recommended_debates.present? || @recommended_proposals.present?) %>
  <%= render "recommended",
              recommended_debates: @recommended_debates,
              recommended_proposals: @recommended_proposals %>
  <hr>
<% end %>

<% cache [locale_and_user_status, @featured_debates, @featured_proposals, 'featured'] do %>
  <main>
    <div class="small-12 column text-center">
      <div class="row margin padding">
        <div class="small-12 medium-3 column">
          <h2><%= t("welcome.debates.title") %></h2>
          <p><%= t("welcome.debates.description") %></p>
        </div>
        <div class="small-12 medium-3 column">
          <h2><%= t("welcome.proposal.title") %></h2>
          <p><%= t("welcome.proposal.description") %></p>
        </div>
        <div class="small-12 medium-3 column">
          <h2><%= t("welcome.decide.title") %></h2>
          <p><%= t("welcome.decide.description") %></p>
        </div>
        <div class="small-12 medium-3 column">
          <h2><%= t("welcome.do.title") %></h2>
          <p><%= t("welcome.do.description") %></p>
        </div>
      </div>
    </div>
  </main>
<% end %>
