Download as
Browse Code »

Commit 6232bcfd3afa493164de924429a86dc814ca89de

Authored by Aurelio A. Heckert
1 parent ab433a58
Exists in master and in 29 other branches add_member_task_reject_details, admin_visible_profile, article-list-template, community_notifications, contact_admin_translation, event_fixes, fix_comments_pagination, fix_rails4_organization_ratings, fix_sign_up_form, follow_step_fix, forum_topic_creation, mirror_block_improvements, multi_env_on_remote_user, new_security, noosfero_spb_ci, organization_ratings_improvements, organization_ratings_link_to_profile_stable-spb-1.3, organization_ratings_translations_fix, profile_api_improvements, ratings_minor_fixes, remote_user_fix, send_email_to_admins, stable-spb-1.3, stable-spb-1.3-fixes, stable-spb-1.4, stable-spb-1.5, suggest_rejected_value, web_steps_improvements, xss_terminate_custom_options

Correct the image display for activites 

(close ActionItem2446)
Showing 4 changed files with 113 additions and 88 deletions   Show diff stats
config/initializers/action_tracker.rb
  Diff comments   View file @6232bcf
@@ -23,7 +23,28 @@ ActionTrackerConfig.verbs = { @@ -23,7 +23,28 @@ ActionTrackerConfig.verbs = {
23 }, 23 },
24 24
25 :upload_image => { 25 :upload_image => {
26 - :description => lambda { n_('uploaded 1 image<br />%{thumbnails}<br style="clear: both;" />', 'uploaded %{num} images<br />%{thumbnails}<br style="clear: both;" />', get_view_url.size) % { :num => get_view_url.size, :thumbnails => '{{ta.collect_group_with_index(:thumbnail_path){ |t,i| content_tag(:span, link_to(image_tag(t), ta.get_view_url[i]))}.last(3).join}}' } }, 26 + :description => lambda do
  27 + total = get_view_url.size
  28 + n_('uploaded 1 image', 'uploaded %d images', total) % total +
  29 + '<br />{{'+
  30 + 'ta.collect_group_with_index(:thumbnail_path) { |t,i|' +
  31 + " if ( #{total} == 1 );" +
  32 + ' link_to( image_tag(t), ta.get_view_url[i], :class => \'upimg\' );' +
  33 + ' else;' +
  34 + " pos = #{total}-i;" +
  35 + ' morethen2 = pos>2 ? \'morethen2\' : \'\';' +
  36 + ' morethen5 = pos>5 ? \'morethen5\' : \'\';' +
  37 + ' t = t.gsub(/(.*)(display)(.*)/, \'\\1thumb\\3\');' +
  38 + ' link_to( \'&nbsp;\', ta.get_view_url[i],' +
  39 + ' :style => "background-image:url(#{t})",' +
  40 + ' :class => "upimg pos#{pos} #{morethen2} #{morethen5}" );' +
  41 + ' end' +
  42 + '}.reverse.join}}' +
  43 + ( total > 5 ?
  44 + '<span class="more" onclick="this.parentNode.className+=\' show-all\'">' +
  45 + '&hellip;</span>' : '' ) +
  46 + '<br style="clear: both;" />'
  47 + end,
27 :type => :groupable 48 :type => :groupable
28 }, 49 },
29 50
public/designs/templates/leftbar/stylesheets/style.css
  Diff comments   View file @6232bcf
@@ -45,26 +45,25 @@ @@ -45,26 +45,25 @@
45 width: 489px; 45 width: 489px;
46 } 46 }
47 47
48 -#profile-wall li.profile-activity-item.upload_image span,  
49 -#profile-wall li.profile-activity-item.upload_image span img,  
50 -#profile-wall li.profile-activity-item.upload_image span a,  
51 -#profile-network li.profile-activity-item.upload_image span,  
52 -#profile-network li.profile-activity-item.upload_image span img,  
53 -#profile-network li.profile-activity-item.upload_image span a {  
54 - width: 178px;  
55 - height: 144px; 48 +li.profile-activity-item.upload_image .upimg {
  49 + width: 168px;
  50 + height: 168px;
56 } 51 }
57 -  
58 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span,  
59 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a img,  
60 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a,  
61 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span,  
62 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a img,  
63 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a {  
64 - max-width: 540px; 52 +li.profile-activity-item.upload_image .more,
  53 +li.profile-activity-item.upload_image .upimg.morethen2 {
  54 + font-size: 46px;
  55 + width: 77px;
  56 + height: 77px;
  57 +}
  58 +li.profile-activity-item.upload_image .activity-gallery-images-count-3 .pos3 {
  59 + /* reduce size only for 4 or more itens */
  60 + width: 168px;
  61 + height: 168px;
65 } 62 }
66 63
67 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a,  
68 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a {  
69 - background-image: url(/images/gallery-image-activity-border-big-onecol.png); 64 +li.profile-activity-item.upload_image .activity-gallery-images-count-4 .pos3 {
  65 + /* make a line-break on this case */
  66 + float: none;
  67 + margin-left: 364px;
70 } 68 }
  69 +
public/designs/templates/rightbar/stylesheets/style.css
  Diff comments   View file @6232bcf
@@ -45,21 +45,25 @@ @@ -45,21 +45,25 @@
45 width: 489px; 45 width: 489px;
46 } 46 }
47 47
48 -#profile-wall li.profile-activity-item.upload_image span,  
49 -#profile-wall li.profile-activity-item.upload_image span img,  
50 -#profile-wall li.profile-activity-item.upload_image span a,  
51 -#profile-network li.profile-activity-item.upload_image span,  
52 -#profile-network li.profile-activity-item.upload_image span img,  
53 -#profile-network li.profile-activity-item.upload_image span a {  
54 - width: 178px;  
55 - height: 144px; 48 +li.profile-activity-item.upload_image .upimg {
  49 + width: 168px;
  50 + height: 168px;
  51 +}
  52 +li.profile-activity-item.upload_image .more,
  53 +li.profile-activity-item.upload_image .upimg.morethen2 {
  54 + font-size: 46px;
  55 + width: 77px;
  56 + height: 77px;
  57 +}
  58 +li.profile-activity-item.upload_image .activity-gallery-images-count-3 .pos3 {
  59 + /* reduce size only for 4 or more itens */
  60 + width: 168px;
  61 + height: 168px;
56 } 62 }
57 63
58 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span,  
59 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a img,  
60 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a,  
61 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span,  
62 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a img,  
63 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a {  
64 - max-width: 540px; 64 +li.profile-activity-item.upload_image .activity-gallery-images-count-4 .pos3 {
  65 + /* make a line-break on this case */
  66 + float: none;
  67 + margin-left: 364px;
65 } 68 }
  69 +
public/stylesheets/application.css
  Diff comments   View file @6232bcf
@@ -4702,16 +4702,13 @@ h1#agenda-title { @@ -4702,16 +4702,13 @@ h1#agenda-title {
4702 } 4702 }
4703 #profile-activity li, #profile-network li, #profile-wall li { 4703 #profile-activity li, #profile-network li, #profile-wall li {
4704 display: block; 4704 display: block;
4705 - padding: 3px; 4705 + padding: 3px 0px;
4706 margin-bottom: 3px; 4706 margin-bottom: 3px;
4707 background-color: #fff; 4707 background-color: #fff;
4708 border-bottom: 1px solid #e8e8e8; 4708 border-bottom: 1px solid #e8e8e8;
4709 position: relative; 4709 position: relative;
4710 } 4710 }
4711 4711
4712 -#profile-activity li, #profile-network li, #profile-wall li {  
4713 -}  
4714 -  
4715 .profile-activity-lead img { 4712 .profile-activity-lead img {
4716 width: 124px; 4713 width: 124px;
4717 float: left; 4714 float: left;
@@ -4775,75 +4772,79 @@ h1#agenda-title { @@ -4775,75 +4772,79 @@ h1#agenda-title {
4775 color: #000; 4772 color: #000;
4776 } 4773 }
4777 4774
4778 -#profile-wall li.profile-activity-item.upload_image span,  
4779 -#profile-wall li.profile-activity-item.upload_image span a,  
4780 -#profile-network li.profile-activity-item.upload_image span,  
4781 -#profile-network li.profile-activity-item.upload_image span a {  
4782 - width: 110px;  
4783 - height: 100px; 4775 +li.profile-activity-item.upload_image .more,
  4776 +li.profile-activity-item.upload_image .upimg {
4784 display: block; 4777 display: block;
4785 - overflow: hidden;  
4786 - position: absolute; 4778 + float: left;
  4779 + width: 114px;
  4780 + height: 114px;
  4781 + background-size: cover;
  4782 + -o-background-size: cover;
  4783 + -moz-background-size: cover;
  4784 + -webkit-background-size: cover;
  4785 + background-position: 50% 50%;
  4786 + border: 4px solid #D2D2D2;
  4787 + border-radius: 4px;
  4788 + -moz-border-radius: 4px;
  4789 + -webkit-border-radius: 4px;
  4790 + margin: 3px 6px 3px 0px;
4787 } 4791 }
4788 4792
4789 -#profile-wall li.profile-activity-item.upload_image span a img,  
4790 -#profile-network li.profile-activity-item.upload_image span a img {  
4791 - width: 110px;  
4792 - height: 100px; 4793 +#wrap-1 li.profile-activity-item.upload_image .upimg:hover {
  4794 + text-decoration: none;
4793 } 4795 }
4794 4796
4795 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span,  
4796 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a,  
4797 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a img,  
4798 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span,  
4799 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a,  
4800 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a img {  
4801 - width: auto;  
4802 - max-width: 383px;  
4803 - height: auto; 4797 +li.profile-activity-item.upload_image .more,
  4798 +li.profile-activity-item.upload_image .upimg.morethen2 {
  4799 + width: 50px;
  4800 + height: 50px;
  4801 +}
  4802 +li.profile-activity-item.upload_image .activity-gallery-images-count-3 .pos3 {
  4803 + /* reduce size only for 4 or more itens */
  4804 + width: 114px;
  4805 + height: 114px;
4804 } 4806 }
4805 4807
4806 -#profile-wall li.profile-activity-item.upload_image span img,  
4807 -#profile-network li.profile-activity-item.upload_image span img {  
4808 - display: block; 4808 +li.profile-activity-item.upload_image .activity-gallery-images-count-4 .pos3 {
  4809 + /* make a line-break on this case */
  4810 + float: none;
  4811 + margin-left: 256px;
4809 } 4812 }
4810 4813
4811 -#profile-wall li.profile-activity-item.upload_image span,  
4812 -#profile-network li.profile-activity-item.upload_image span {  
4813 - position: relative;  
4814 - display: inline-block;  
4815 - margin: 5px 0px 0px 5px; 4814 +li.profile-activity-item.upload_image .more {
  4815 + text-align: center;
  4816 + font-weight: bold;
  4817 + font-size: 28px;
  4818 + color: #DDD;
  4819 + background: #888;
  4820 + cursor: pointer;
  4821 +}
  4822 +li.profile-activity-item.upload_image .more:hover {
  4823 + color: #EEE;
  4824 + background: #999;
4816 } 4825 }
4817 4826
4818 -#profile-wall li.profile-activity-item.upload_image .profile-activity-text span,  
4819 -#profile-network li.profile-activity-item.upload_image .profile-activity-text span {  
4820 - border: 4px solid #D2D2D2;  
4821 - border-radius: 4px;  
4822 - -webkit-border-radius: 4px;  
4823 - -moz-border-radius: 4px; 4827 +li.profile-activity-item.upload_image .morethen5 {
  4828 + display: none;
4824 } 4829 }
4825 4830
4826 -#profile-wall li.profile-activity-item.upload_image span a,  
4827 -#profile-network li.profile-activity-item.upload_image span a {  
4828 - text-indent: -5000em; 4831 +li.profile-activity-item.upload_image .show-all .morethen5 {
  4832 + display: block;
4829 } 4833 }
4830 4834
4831 -#profile-wall li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a,  
4832 -#profile-network li.profile-activity-item.upload_image .activity-gallery-images-count-1 span a {  
4833 - position: relative; 4835 +li.profile-activity-item.upload_image .show-all .more {
  4836 + display: none;
4834 } 4837 }
4835 4838
4836 -#profile-wall li.profile-activity-item.upload_image .article-comment span,  
4837 -#profile-wall li.profile-activity-item.upload_image .profile-wall-actions span,  
4838 -#profile-network li.profile-activity-item.upload_image .article-comment span,  
4839 -#profile-network li.profile-activity-item.upload_image .profile-wall-actions span {  
4840 - display: inline;  
4841 - position: static;  
4842 - margin: 0; 4839 +li.profile-activity-item.upload_image .activity-gallery-images-count-1 .upimg,
  4840 +li.profile-activity-item.upload_image .activity-gallery-images-count-1 img {
  4841 + /* Only ".activity-gallery-images-count-1" has a "img" inside */
4843 float: none; 4842 float: none;
  4843 + display: inline-block;
4844 width: auto; 4844 width: auto;
  4845 + max-width: 100%;
4845 height: auto; 4846 height: auto;
4846 - font-weight: normal; 4847 + max-height: 300px;
4847 } 4848 }
4848 4849
4849 #profile-wall li.profile-activity-item ul.profile-wall-activities-comments, 4850 #profile-wall li.profile-activity-item ul.profile-wall-activities-comments,