From af52fb5670f5b86bb8838a49844af48e45340b5b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mart=C3=ADn=20Gonz=C3=A1lez?= <m@martingonzalez.net>
Date: Tue, 14 Feb 2017 17:11:02 +0100
Subject: [PATCH] Improve social share buttons position for the annotations
 index and specific annotations

---
 .../stylesheets/legislation_process.scss      |  8 +++
 app/assets/stylesheets/participation.scss     |  3 +-
 .../_slim_version_chooser.html.erb            | 23 +++++++++
 .../legislation/annotations/index.html.erb    | 49 ++++++++++---------
 .../legislation/annotations/show.html.erb     |  6 +--
 5 files changed, 61 insertions(+), 28 deletions(-)
 create mode 100644 app/views/legislation/annotations/_slim_version_chooser.html.erb

diff --git a/app/assets/stylesheets/legislation_process.scss b/app/assets/stylesheets/legislation_process.scss
index 39a45da93..3fbc509bf 100644
--- a/app/assets/stylesheets/legislation_process.scss
+++ b/app/assets/stylesheets/legislation_process.scss
@@ -525,7 +525,15 @@ $epigraph-line-height: rem-calc(22);
 }
 
 .draft-panels {
+  position: relative;
   padding: 2rem 0;
+  
+  aside.absolute {
+    @include breakpoint(medium) {
+      position: absolute;
+      right: 0;
+    }
+  }
 
   .draft-chooser {
     margin-bottom: 2rem;
diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss
index 6609f25df..d57807912 100644
--- a/app/assets/stylesheets/participation.scss
+++ b/app/assets/stylesheets/participation.scss
@@ -298,7 +298,8 @@
 .proposal-show,
 .investment-project-show,
 .debate-quiz,
-.budget-investment-show {
+.budget-investment-show,
+.draft-panels {
 
   p {
     word-wrap: break-word;
diff --git a/app/views/legislation/annotations/_slim_version_chooser.html.erb b/app/views/legislation/annotations/_slim_version_chooser.html.erb
new file mode 100644
index 000000000..cd34736f7
--- /dev/null
+++ b/app/views/legislation/annotations/_slim_version_chooser.html.erb
@@ -0,0 +1,23 @@
+<div class="row draft-chooser">
+  <div class="small-12 medium-6 column">
+    <h3><%= t('legislation.annotations.version_chooser.seeing_version') %></h3>
+    <div class="select-box">
+      <%= form_tag go_to_version_legislation_process_draft_versions_path(process), method: :get, id: "draft_version_go_to_version" do %>
+        <%= select_tag "draft_version_id", options_from_collection_for_select(process.draft_versions.published, 'id', 'display_title', draft_version.id), "aria-label": t('legislation.draft_versions.show.select_draft_version') %>
+        <%= hidden_field_tag "redirect_action", "annotations" %>
+        <%= submit_tag t('legislation.draft_versions.show.select_version_submit'), class: "button" %>
+      <% end %>
+    </div>
+    <span><%= t('legislation.draft_versions.show.updated_at', date: format_date(@draft_version.updated_at)) %></span>
+  </div>
+  <div class="small-12 medium-3 column">
+    <%= link_to t('legislation.annotations.version_chooser.see_text'), legislation_process_draft_version_path(process, draft_version), title: t('legislation.annotations.version_chooser.see_text'), class: "button strong" %>
+  </div>
+  <aside class="small-12 medium-3 column">
+    <div class="sidebar-divider"></div>
+    <h2>Compartir</h2>
+    <div class="social-share-full">
+      <%= render '/legislation/shared/share_buttons', title: @draft_version.title %>
+    </div>
+  </aside>
+</div>
diff --git a/app/views/legislation/annotations/index.html.erb b/app/views/legislation/annotations/index.html.erb
index 87efc3614..7553276f1 100644
--- a/app/views/legislation/annotations/index.html.erb
+++ b/app/views/legislation/annotations/index.html.erb
@@ -7,29 +7,34 @@
 <div class="column row">
   <div class="draft-panels small-12 column row">
     <%= render 'version_chooser', process: @process, draft_version: @draft_version %>
-
-    <div class="row">
-      <div class="small-12 medium-8 column legislation-comments">
-
-        <% @annotations.each do |annotation| %>
-          <div class="comment">
-            <strong><%= t('.comments_about') %></strong>
-            <span class="pull-right">
-              <%= link_to legislation_process_draft_version_path(@process, @draft_version, anchor: "annotation-id-#{annotation.id}") do %>
-                <span><%= t('.see_in_context') %></span> <span class="icon-expand" aria-hidden="true"></span>
-              <% end %>
-            </span>
-            <div class="comment-section">
-              <%= annotation.quote %>
-            </div>
-            <%= link_to legislation_process_draft_version_annotation_path(@process, @draft_version, annotation) do %>
-              <span class="icon-comments" aria-hidden="true"></span> <span><%= t('.comments_count', count: annotation.comments_count) %></span></a>
-            <% end %>
-          </div>
-        <% end %>
-
+    
+    <aside class="small-12 medium-3 column absolute">
+      <div class="sidebar-divider"></div>
+      <h2>Compartir</h2>
+      <div class="social-share-full">
+        <%= render '/legislation/shared/share_buttons', title: @draft_version.title %>
       </div>
-    </div>
+    </aside>
+  </div>
+  
+  <div class="small-12 medium-8 column row legislation-comments end">
+    
+    <% @annotations.each do |annotation| %>
+      <div class="comment">
+        <strong><%= t('.comments_about') %></strong>
+        <span class="pull-right">
+          <%= link_to legislation_process_draft_version_path(@process, @draft_version, anchor: "annotation-id-#{annotation.id}") do %>
+            <span><%= t('.see_in_context') %></span> <span class="icon-expand" aria-hidden="true"></span>
+          <% end %>
+        </span>
+        <div class="comment-section">
+          <%= annotation.quote %>
+        </div>
+        <%= link_to legislation_process_draft_version_annotation_path(@process, @draft_version, annotation) do %>
+          <span class="icon-comments" aria-hidden="true"></span> <span><%= t('.comments_count', count: annotation.comments_count) %></span></a>
+        <% end %>
+      </div>
+    <% end %>
 
   </div>
 </div>
diff --git a/app/views/legislation/annotations/show.html.erb b/app/views/legislation/annotations/show.html.erb
index 89b371821..0d261d27a 100644
--- a/app/views/legislation/annotations/show.html.erb
+++ b/app/views/legislation/annotations/show.html.erb
@@ -6,11 +6,7 @@
 
 <div class="column row">
   <div class="draft-panels small-12 column row">
-    <%= render 'version_chooser', process: @process, draft_version: @draft_version %>
-
-    <div class="social-share-full">
-      <%= render '/legislation/shared/share_buttons', title: @annotation.quote %>
-    </div>
+    <%= render 'slim_version_chooser', process: @process, draft_version: @draft_version %>
 
     <div class="row">
       <div class="small-12 medium-12 column legislation-comment">