From 223280f69567359b2f39fd06a86bb9942cb93d99 Mon Sep 17 00:00:00 2001
From: Aurélio A. Heckert <aurelio@colivre.coop.br>
Date: Fri, 1 Feb 2013 19:36:15 -0300
Subject: [PATCH] Organize gallery itens on search result page

---
 app/views/search/_image.rhtml |  5 +++--
 public/stylesheets/search.css | 40 +++++++++++++++++++++++++++++++++++++++-
 2 files changed, 42 insertions(+), 3 deletions(-)

diff --git a/app/views/search/_image.rhtml b/app/views/search/_image.rhtml
index be85c67..add9fc9 100644
--- a/app/views/search/_image.rhtml
+++ b/app/views/search/_image.rhtml
@@ -28,8 +28,9 @@
     <div class="search-gallery-items">
       <% r = image.children.find(:all, :order => :updated_at, :conditions => ['type = ?', 'UploadedFile']).last(3) %>
       <% if r.length > 0 %>
-        <% r.each do |i| %>
-          <%= link_to '', i.view_url, :class => "search-image-pic", :style => 'background-image: url(%s)'% i.public_filename(:thumb) %>
+        <% r.each_index do |i| img = r[i] %>
+          <%= link_to '', img.view_url, :class => "search-image-pic pic-num#{i+1}",
+                                        :style => 'background-image: url(%s)'% img.public_filename(:thumb) %>
         <% end %>
       <% else %>
         <div class="search-no-image"><span><%= _('No image') %></span></div>
diff --git a/public/stylesheets/search.css b/public/stylesheets/search.css
index ac4026c..15c5b86 100644
--- a/public/stylesheets/search.css
+++ b/public/stylesheets/search.css
@@ -736,10 +736,18 @@ li.search-product-item hr {
   min-height: 98px;
   position: absolute;
 }
+.search-gallery .search-content-first-column {
+  width: 190px;
+}
+
 .search-content-second-column {
   margin-left: 140px;
   width: auto;
 }
+.search-gallery .search-content-second-column {
+  margin-left: 200px;
+}
+
 .search-content-second-column tr:hover {
   background-color: none;
 }
@@ -807,15 +815,45 @@ a.search-image-pic {
   display: table-cell;
   vertical-align: middle;
 }
+
 .search-gallery-items a.search-image-pic {
   float:left;
   margin:0 2px;
 }
+
+
 .search-gallery .search-gallery-items {
   float: left;
-  margin: 0 10px 0 0;
+  margin: 0;
   min-width: 130px;
+  position: relative;
 }
+
+.search-gallery .search-gallery-items a.search-image-pic {
+  border: none;
+  border-radius: 0;
+  box-shadow: none;
+  width: 62px;
+  margin: 0px 0px 1px 1px;
+  background-size: cover;
+  background-position: 50% 10%;
+  float: none;
+}
+
+.search-gallery .search-gallery-items a.search-image-pic.pic-num1,
+.search-gallery .search-gallery-items a.search-image-pic.pic-num2 {
+  display: block;
+  width: 60px;
+  height: 49px;
+}
+.search-gallery .search-gallery-items a.search-image-pic.pic-num3 {
+  width: 130px;
+  height: 99px;
+  position: absolute;
+  left: 61px;
+  top: 0px;
+}
+
 .search-content-first-column .search-image-container .search-image-pic
 .search-uploaded-file-first-column .search-image-container .search-image-pic {
   display: block;
--
libgit2 0.21.2