Merge pull request consuldemocracy#1899 from xarlybovi/legislation-pr…

…ocess-html-fixes

Legislation process minor html fixes

app/assets/javascripts/legislation.js.coffee

@@ -1,14 +1,9 @@
 App.Legislation =
 
  initialize: ->
- $('#js-toggle-debate').on
- click: ->
- $('#debate-show').toggle()
-
  $('#js-toggle-small-debate').on
  click: ->
- $('#debate-show').toggle()
- $('span').toggleClass('icon-angle-up')
+ $(this).find($('span')).toggleClass('icon-angle-up')
 
  $('form#new_legislation_answer input.button').hide()
  $('form#new_legislation_answer input[type=radio]').on
@@ -19,7 +14,3 @@ App.Legislation =
  $('form#draft_version_go_to_version select').on
  change: ->
  $('form#draft_version_go_to_version').submit()
-
- $('#js-toggle-legislation-process-header').on
- click: ->
- $('[data-target="legislation-header-full"]').toggle()

app/assets/stylesheets/legislation_process.scss

@@ -39,10 +39,6 @@ $border-dark: darken($border, 10%);
  }
  }
 
- .legislation-debate-show {
- display: none;
- }
-
  .debate-add-info {
  border-top: 1px solid $border-dark;
  margin-top: $line-height;
@@ -357,10 +353,6 @@ $border-dark: darken($border, 10%);
 .legislation-allegation {
  padding-top: 1rem;
 
- .legislation-debate-show {
- margin-top: 2rem;
- }
-
  .headline {
  margin-bottom: 0;
 

app/views/legislation/processes/_header.html.erb

@@ -1,12 +1,12 @@
 <% if header == :small %>
- <div class="legislation-hero jumbo grey-heading" data-target="legislation-header-small">
+ <div class="legislation-hero jumbo grey-heading">
  <div class="row headline">
  <div class="small-12 medium-8 column">
  <h3 class="headline-small"><%= process.title %></h3>
  </div>
  </div>
 
- <div id="debate-show" class="row description legislation-debate-show">
+ <div id="debate-show" class="row description is-hidden" data-toggler=".is-hidden">
  <div class="small-12 column">
  <% if process.description.present? %>
  <p class="title"><%= t('legislation.processes.header_full.description') %></p>
@@ -17,19 +17,18 @@
  <div class="small-12 column debate-add-info">
  <%= markdown process.additional_info if process.additional_info %>
  </div>
-  <% end %>
+ <% end %>
  </div>
 
  <% if process.description.present? || process.additional_info.present? %>
  <div class="text-center">
- <a class="button big text-center button-circle" title="<%= t('.view_process_information') %>" id="js-toggle-small-debate">
+ <a class="button big text-center button-circle" title="<%= t('.view_process_information') %>" id="js-toggle-small-debate" data-toggle="debate-show">
  <span class="icon-angle-down" aria-hidden="true"></span>
  </a>
  </div>
  <% end %>
  </div>
 
- <%= render 'legislation/processes/header_full', process: @process, hidden: true %>
 <% else %>
- <%= render 'legislation/processes/header_full', process: @process, hidden: false %>
+ <%= render 'legislation/processes/header_full', process: @process %>
 <% end %>

app/views/legislation/processes/_header_full.html.erb

@@ -1,4 +1,4 @@
-<div class="legislation-hero jumbo grey-heading" style="display:<%= hidden ? 'none' : 'block' %>" data-target="legislation-header-full">
+<div class="legislation-hero jumbo grey-heading">
  <div class="row headline">
  <div class="small-12 medium-8 column">
  <%= back_link_to legislation_processes_path %>
@@ -16,15 +16,15 @@
  <% end %>
  </div>
  <% if process.additional_info.present? %>
- <div id="debate-show" class="small-12 column debate-add-info legislation-debate-show">
+ <div id="additional_info" class="small-12 column debate-add-info is-hidden" data-toggler=".is-hidden">
  <%= markdown process.additional_info if process.additional_info %>
  </div>
  <% end %>
  </div>
 
  <% if process.additional_info.present? %>
  <div class="text-center">
- <a id="js-toggle-debate" class="button big text-center" title="<%= t('.more_info') %>">
+ <a id="js-toggle-debate" class="button big text-center" title="<%= t('.more_info') %>" data-toggle="additional_info">
  <strong><%= t('.more_info') %></strong>
  </a>
  </div>