profile-connections: changes css to connections block

Makes the connections shown in the community / people block less crowded. (ActionItem3234)

profile-connections: changes css to connections block
Makes the connections shown in the community / people block less crowded. (ActionItem3234)
Larissa Reis
1 parent c6410e3e
Showing 5 changed files with 71 additions and 53 deletions Show diff stats
app/helpers/application_helper.rb
app/views/shared/_profile_suggestions_list.html.erb
plugins/people_block/public/style.css
public/designs/themes/base/style.css
public/stylesheets/application.css
@@ -1419,9 +1419,13 @@ module ApplicationHelper
     text_field_tag name, default, options.merge({:id => 'search-input', 'data-asset' => asset})
   end
-  def profile_suggestion_categories(suggestion)
-    suggestion.categories.map do |cat|
-      content_tag(:p, content_tag(:span, "#{suggestion.category_label(cat[0])}: #{cat[1]}", :class => suggestion.category_icon(cat[0])))
+  def profile_suggestion_profile_connections(suggestion)
+    suggestion.profile_connections.map do |cat|
+    end.join
+  end
+
+  def profile_suggestion_tag_connections(suggestion)
+    suggestion.tag_connections.map do |cat|
     end.join
   end
 end
@@ -8,32 +8,27 @@
   <ul class="profile-list">
     <% suggestions.each do |s| %>
       <li>
-        <%= link_to_profile profile_image(s.suggestion, :minor) + '<br/>' + s.suggestion.short_name,
+        <%= link_to_profile profile_image(s.suggestion, :minor),
                             s.suggestion.identifier, :class => 'profile-link' %>
-        <%= button_without_text :help, content_tag('span',_('info about suggestion')),
-              '#',
-              :class => 'explain-suggestion',
-              :title => _('Why this suggestion?') %>
-        <div class='extra_info' style='display:none'>
+        <% if collection == :friends_suggestions %>
+          <%= link_to _('Add %s') % s.suggestion.short_name,
+                      s.suggestion.add_url, :class => 'accept-suggestion' %>
+        <% elsif collection == :communities_suggestions %>
+          <%= link_to _('Join %s') % s.suggestion.name,
+                      s.suggestion.add_url, :class => 'accept-suggestion' %>
+        <% end %>
+        <div class='extra_info'>
           <%= profile_suggestion_categories(s) %>
         </div>
         <div class="controll">
           <% if collection == :friends_suggestions %>
-            <%= button_without_text :add, content_tag('span',_('add')),
-                  s.suggestion.add_url,
-                  :class => 'add-friend accept-suggestion',
-                  :title => _('Add friend') %>
-            <%= button_without_text :remove, content_tag('span',_('remove')),
+            <%= link_to 'x',
                 { :controller => 'friends', :action => 'remove_suggestion', :id => s.suggestion.identifier },
                   :class => 'remove-suggestion',
                   :title => _('Remove suggestion'),
                   :confirm => _('Are you sure you want to remove this suggestion?') %>
           <% elsif collection == :communities_suggestions %>
-              <%= button_without_text :add, content_tag('span',_('join')),
-                    s.suggestion.join_url,
-                    :class => 'join-community accept-suggestion',
-                    :title => _("Join %s") % s.suggestion.name %>
-              <%= button_without_text :remove, content_tag('span',_('remove')),
+              <%= link_to 'x',
                   { :controller => 'memberships', :action => 'remove_suggestion', :id => s.suggestion.identifier },
                     :class => 'remove-suggestion',
                     :title => _('Remove suggestion'),
@@ -107,9 +107,6 @@
 #content .friends-block .block-footer-content a.more-suggestions {
   position: relative;
 }
-#content .friends-block .block-footer-content .profiles-suggestions a.explain-suggestion {
-  position: absolute;
-}
 #content .common-profile-list-block .profiles-suggestions .profile-list .extra_info {
   top: 20px;
@@ -123,8 +120,7 @@
   top: 0px;
   right: 0px;
 }
-#content .common-profile-list-block .profiles-suggestions .controll a,
-#content .friends-block .block-footer-content .profiles-suggestions a.explain-suggestion {
+#content .common-profile-list-block .profiles-suggestions .controll a {
   width: 16px;
   padding: 1px;
 }
@@ -405,8 +405,7 @@ div#notice {
 }
-#content .block-title,
-#content .block-subtitle {
+#content .block-title {
   font-variant: small-caps;
   color: #AAA;
   font-size: 14px;
@@ -414,7 +413,12 @@ div#notice {
   border-bottom: 2px solid #AAA;
 }
 #content .block-subtitle {
-  font-size: 13px;
+  font-variant: normal;
+  color: #AAA;
+  font-size: 11px;
+  text-align: left;
+  border-bottom: 1px solid #AAA;
+  padding: 2px 0;
 }
 /*************************** Login block *****************************/
@@ -1668,17 +1668,43 @@ a.button.disabled, input.disabled {
   padding-bottom: 0px;
 }
-#content .communities-block .block-footer-content .profiles-suggestions a.explain-suggestion {
-    padding: 1px;
-    width: 16px;
-}
-
 #content .communities-block .block-footer-content .profiles-suggestions a.accept-suggestion,
 #content .communities-block .block-footer-content .profiles-suggestions a.remove-suggestion {
   position: relative;
   z-index: 5;
 }
+#content .block-footer-content .profiles-suggestions a.accept-suggestion {
+  padding-bottom: 3px;
+  display: block;
+  color: #333;
+}
+
+#content .profiles-suggestions .profile-list a.remove-suggestion {
+  display: block;
+  width: 15px !important;
+  height: 15px;
+  color: #888;
+  border-radius: 10px;
+  line-height: 14px;
+  font-size: 14px;
+  text-align: center;
+  font-weight: bold;
+}
+
+#content .profiles-suggestions .profile-list a.remove-suggestion:hover {
+  display:  block;
+  width: 15px;
+  height: 15px;
+  background: #888;
+  color: #fff;
+  border-radius: 10px;
+  line-height: 14px;
+  font-size: 14px;
+  text-align: center;
+  font-weight: bold;
+}
+
 #content .communities-block .profiles-suggestions .profile-list .extra_info {
   z-index: 10;
 }
@@ -4029,15 +4055,6 @@ h1#agenda-title {
 .profiles-suggestions .profile-list {
   position: relative;
 }
-.profiles-suggestions .profile-list .explain-suggestion {
-  position: absolute;
-  top: 7px;
-  left: -5px;
-  z-index: 10;
-}
-#content .profiles-suggestions .profile-list .explain-suggestion.active {
-  border-bottom-color: transparent;
-}
 .controller-favorite_enterprises .profile-list .controll,
 .controller-friends .profile-list .controll,
@@ -4064,18 +4081,6 @@ h1#agenda-title {
   padding-top: 20px;
 }
-.profiles-suggestions .profile-list .extra_info {
-  background: url("/images/down-arrow.png") no-repeat scroll center top #eee;
-  border: 1px solid #ccc;
-  left: -66px;
-  min-width: 135px;
-  padding: 5px;
-  position: absolute;
-  top: 29px;
-  opacity: 0.9;
-  z-index: 5;
-}
-
 .profiles-suggestions .profile-list .extra_info p {
   margin: 0px;
 }
@@ -4100,6 +4105,20 @@ h1#agenda-title {
   border: 2px solid transparent;
 }
+.common-profile-list-block .profiles-suggestions .profile-list li {
+  width: 100%;
+  max-width: 100%;
+}
+
+.common-profile-list-block .profiles-suggestions .profile-list li img {
+  float: left;
+}
+
+#content .common-profile-list-block .profiles-suggestions .profile-list a.profile-link {
+  text-align: left;
+  position: relative;
+}
+
 /* ==> public/stylesheets/controller_friends.css <== */
 .controller-friends #remove_friend .friend_picture,