diff --git a/app/views/albums/_album.html.haml b/app/views/albums/_album.html.haml index 3835fd377..d4a629ba0 100644 --- a/app/views/albums/_album.html.haml +++ b/app/views/albums/_album.html.haml @@ -1,4 +1,4 @@ -%li.album{:id => post.id, :class => ("mine" if mine?(post))} +.album{:id => post.id, :class => ("mine" if mine?(post))} %div.name = link_to post.name, object_path(post) diff --git a/app/views/albums/index.html.haml b/app/views/albums/index.html.haml index efdef8872..8f3816f3d 100644 --- a/app/views/albums/index.html.haml +++ b/app/views/albums/index.html.haml @@ -13,9 +13,10 @@ %li.selected= friends_albums_link %li= your_albums_link -%ul#stream +%div - for album in @albums = render "album", :post => album + #pagination = will_paginate @albums diff --git a/app/views/albums/show.html.haml b/app/views/albums/show.html.haml index d22f8ff56..f118cf7da 100644 --- a/app/views/albums/show.html.haml +++ b/app/views/albums/show.html.haml @@ -18,7 +18,8 @@ %h4= "by #{@album.person.real_name}" - for photo in @album_photos - = link_to (image_tag photo.image.url(:thumb_medium)), object_path(photo) + .image_thumb + = link_to (image_tag photo.image.url(:thumb_medium)), object_path(photo) #content_bottom .back diff --git a/public/javascripts/view.js b/public/javascripts/view.js index 66a3438d8..5da7a9f9e 100644 --- a/public/javascripts/view.js +++ b/public/javascripts/view.js @@ -107,4 +107,13 @@ $(document).ready(function(){ $("input[type='submit']").addClass("button"); + $(".image_thumb img").load( function() { + $(this).fadeIn("slow"); + }); + + $(".image_cycle img").load( function() { + $(this).fadeIn("slow"); + }); + + });//end document ready diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index 1fc09cf76..4230ed57a 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -333,9 +333,7 @@ ul#publisher_content_pickers li { position: relative; height: 200px; width: 300px; - display: inline-block; - margin-right: 2em; - margin-bottom: 2em; } + display: inline-block; } .album .name { position: absolute; z-index: 600; @@ -349,9 +347,7 @@ ul#publisher_content_pickers li { .album .name .time a { font-weight: normal; } .album div.image_cycle img { - border-radius: 3px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; } + display: none; } .field_with_submit input[type='text'] { width: 82%; @@ -393,3 +389,17 @@ h1.big_text { #next_prev_links { text-align: center; } + +.image_thumb { + display: inline-block; + width: 100px; + min-width: 100px; + height: 100px; + min-height: 100px; } + .image_thumb img { + display: none; } + .image_thumb img:hover { + border-bottom: 2px solid #666666; } + +.image_cycle img { + display: none; } diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass index 0053bad62..23b4ecf25 100644 --- a/public/stylesheets/sass/application.sass +++ b/public/stylesheets/sass/application.sass @@ -405,9 +405,6 @@ ul#publisher_content_pickers li :height 200px :width 300px :display inline-block - :margin - :right 2em - :bottom 2em .name :position absolute @@ -429,9 +426,7 @@ ul#publisher_content_pickers li div.image_cycle img - :border-radius 3px - :-webkit-border-radius 3px - :-moz-border-radius 3px + :display none .field_with_submit input[type='text'] @@ -486,3 +481,22 @@ h1.big_text #next_prev_links :text-align center + + +.image_thumb + :display inline-block + :width 100px + :min-width 100px + :height 100px + :min-height 100px + + img + :display none + + &:hover + :border + :bottom 2px solid #666 + +.image_cycle + img + :display none diff --git a/public/stylesheets/sass/ui.sass b/public/stylesheets/sass/ui.sass index 213953d7f..50000a8d3 100644 --- a/public/stylesheets/sass/ui.sass +++ b/public/stylesheets/sass/ui.sass @@ -14,6 +14,7 @@ :min-height 14px :background -webkit-gradient(linear, 0% 29%, 0% 85%, from(#FAFAFA), to(#E0E0E0)) + :background -moz-linear-gradient(top, #FAFAFA, #E0E0E0) :border 1px solid #ccc :bottom 1px solid #666 @@ -75,6 +76,8 @@ ul.button_set .button .selected, .button_set .selected :background -webkit-gradient(linear, 0% 29%, 0% 85%, from(#E0E0E0), to(#FAFAFA)) + :background -moz-linear-gradient(top, #e0e0e0, #fafafa) + :border :top 1px solid #aaa diff --git a/public/stylesheets/ui.css b/public/stylesheets/ui.css index 1aed43c5a..63c8dc0cc 100644 --- a/public/stylesheets/ui.css +++ b/public/stylesheets/ui.css @@ -8,6 +8,7 @@ text-shadow: 0 1px 0 white; min-height: 14px; background: -webkit-gradient(linear, 0% 29%, 0% 85%, from(#fafafa), to(#e0e0e0)); + background: -moz-linear-gradient(top, #fafafa, #e0e0e0); border: 1px solid #cccccc; border-bottom: 1px solid #666666; border-left: 1px solid #999999; @@ -51,7 +52,6 @@ ul.button_set { .button .selected, .button_set .selected { background: -webkit-gradient(linear, 0% 29%, 0% 85%, from(#e0e0e0), to(#fafafa)); background: -moz-linear-gradient(top, #e0e0e0, #fafafa); - background-image: -moz-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet); border-top: 1px solid #aaaaaa; } .right {