diff --git a/app/views/albums/show.html.haml b/app/views/albums/show.html.haml
index 8fdce2d77..79a46315d 100644
--- a/app/views/albums/show.html.haml
+++ b/app/views/albums/show.html.haml
@@ -6,7 +6,7 @@
-if mine? @album
.button.right#add_photos_button
- = link_to 'add photos', '#'
+ = link_to 'Add Photos', '#'
#add_photo_box.contextual_pane
= render "photos/new_photo", :photo => @photo, :album => @album
@@ -15,12 +15,15 @@
="last updated: #{how_long_ago(@album)}"
-unless mine? @album
- %h4= 'by ' + @album.person.real_name
+ %h4= "by #{@album.person.real_name}"
- for photo in @album_photos
= link_to (image_tag photo.image.url(:thumb_medium)), object_path(photo)
--if mine? @album
- %p
- = link_to "Delete Album", @album, :confirm => 'Are you sure?', :method => :delete
+#content_bottom
+ .back
+ = link_to "⇧ albums", albums_path
+ -if mine? @album
+ .button.right
+ = link_to 'Delete Album', @album, :confirm => 'Are you sure?', :method => :delete
diff --git a/app/views/photos/show.html.haml b/app/views/photos/show.html.haml
index 2ae325c2b..d7ca04b6a 100644
--- a/app/views/photos/show.html.haml
+++ b/app/views/photos/show.html.haml
@@ -14,11 +14,12 @@
= linked_scaled_photo @photo, @album
= link_to_next @photo, @album
- -if mine?(@photo)
- %p
- = link_to "Destroy", @photo, :confirm => 'Are you sure?', :method => :delete
- %p
- = link_to "⇧ #{@album.name}", album_path(@album)
+ #content_bottom
+ .back
+ = link_to "⇧ #{@album.name}", album_path(@album)
+ -if mine? @album
+ .button.right
+ = link_to 'Delete Album', @album, :confirm => 'Are you sure?', :method => :delete
%h4{:class => "show_post_comments"}
= "comments (#{@photo.comments.count})"
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index 707746327..c2ed05d18 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -238,8 +238,11 @@ ul.comment_set {
.request_buttons > li:first-child {
margin-right: 1em; }
-#show_photo img {
- max-width: 100%; }
+#show_photo {
+ text-align: center;
+ min-height: 200px; }
+ #show_photo img {
+ max-width: 100%; }
#debug_info {
margin-top: 20px; }
@@ -345,34 +348,29 @@ ul#publisher_content_pickers li {
width: 85%;
display: inline; }
-.button {
- font-size: 12px;
- line-height: 100%;
- text-shadow: 0 1px 0 white;
- color: #666666;
- background: -webkit-gradient(linear, 0% 29%, 0% 85%, from(#fafafa), to(#e0e0e0));
- background: -moz-linear-gradient(top, #fafafa, #e0e0e0);
- padding: 5px;
- height: 14px;
- display: inline;
- border: 1px solid #cccccc;
- border-bottom: 1px solid #666666;
- border-left: 1px solid #999999;
- border-right: 1px solid #999999;
- border-radius: 3px;
- box-shadow: 0 1px 1px #cccccc;
- -webkit-box-shadow: 0 1px 1px #cccccc;
- -moz-box-shadow: 0 1px 1px #cccccc;
- cursor: pointer; }
- .button:active {
- box-shadow: 0 0px 2px black;
- -webkit-box-shadow: 0 0px 2px black;
- -moz-box-shadow: 0 0px 2px black;
- color: #555555; }
- .button a {
- display: block;
- color: #444444; }
+h1.big_text {
+ position: relative;
+ line-height: auto;
+ border-top: 2px solid #666666;
+ border-bottom: 1px solid #666666;
+ text-align: center; }
.right {
float: right;
margin-top: 6px; }
+
+.back {
+ position: absolute;
+ font-size: 12px; }
+
+#content_bottom {
+ position: relative;
+ line-height: 36px;
+ margin-top: 25px;
+ margin-bottom: 25px;
+ min-height: 36px;
+ border-top: 1px solid #999999;
+ border-bottom: 2px solid #eeeeee; }
+
+.show_post_comments ul.comment_set {
+ width: 100%; }
diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass
index a13516de9..e293bfdfc 100644
--- a/public/stylesheets/sass/application.sass
+++ b/public/stylesheets/sass/application.sass
@@ -287,6 +287,8 @@ ul.comment_set
:margin-right 1em
#show_photo
+ :text-align center
+ :min-height 200px
img
:max-width 100%
@@ -424,56 +426,41 @@ ul#publisher_content_pickers li
:width 85%
:display inline
-.button
- :font
- :size 12px
-
- :line-height 100%
-
- :text
- :shadow 0 1px 0 #fff
-
- :color #666
-
- :background -webkit-gradient(linear, 0% 29%, 0% 85%, from(#FAFAFA), to(#E0E0E0))
- :background -moz-linear-gradient(top, #FAFAFA, #E0E0E0)
-
-
- :padding 5px
- :height 14px
-
- :display inline
-
- :border 1px solid #ccc
+h1.big_text
+ :position relative
+ :line-height auto
+ :border
+ :top 2px solid #666
:bottom 1px solid #666
- :left 1px solid #999
- :right 1px solid #999
- :radius 3px
-
- :box-shadow 0 1px 1px #ccc
- :-webkit-box-shadow 0 1px 1px #ccc
- :-moz-box-shadow 0 1px 1px #ccc
-
- :cursor pointer
-
- &:active
- :box-shadow 0 0px 2px #000
- :-webkit-box-shadow 0 0px 2px #000
- :-moz-box-shadow 0 0px 2px #000
-
- :color #555
-
- a
- :display block
- :color #444
-
+ :text
+ :align center
.right
:float right
:margin
:top 6px
-
+.back
+ :position absolute
+ :font
+ :size 12px
+
+#content_bottom
+ :position relative
+ :line-height 36px
+
+ :margin
+ :top 25px
+ :bottom 25px
+
+ :min-height 36px
+
+ :border
+ :top 1px solid #999
+ :bottom 2px solid #eee
+
+.show_post_comments ul.comment_set
+ :width 100%
diff --git a/public/stylesheets/ui.css b/public/stylesheets/ui.css
index f1c75e4e5..c760a1b0f 100644
--- a/public/stylesheets/ui.css
+++ b/public/stylesheets/ui.css
@@ -5,8 +5,8 @@
font-size: 12px;
line-height: 100%;
text-shadow: 0 1px 0 white;
- padding: 5px;
min-height: 14px;
+ background: -webkit-gradient(linear, 0% 29%, 0% 85%, from(#fafafa), to(#e0e0e0));
border: 1px solid #cccccc;
border-bottom: 1px solid #666666;
border-left: 1px solid #999999;
@@ -14,39 +14,42 @@
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
- cursor: pointer; }
+ cursor: pointer;
+ box-shadow: 0 1px 1px #cccccc;
+ -webkit-box-shadow: 0 1px 1px #cccccc;
+ -moz-box-shadow: 0 1px 1px #cccccc; }
.button a, .button_set a {
font-weight: normal;
color: #777777; }
.button {
- background: -webkit-gradient(linear, 0% 29%, 0% 85%, from(#fafafa), to(#e0e0e0));
- box-shadow: 0 1px 1px #cccccc;
- -webkit-box-shadow: 0 1px 1px #cccccc;
- -moz-box-shadow: 0 1px 1px #cccccc; }
+ padding: 5px; }
.button:active {
box-shadow: 0 0px 2px black;
-webkit-box-shadow: 0 0px 2px black;
-moz-box-shadow: 0 0px 2px black;
color: #555555; }
-ul.button_set > li {
- display: inline;
- height: 100%;
- margin-right: -3px;
- padding: 5px 10px;
- border-left: 1px solid #cccccc;
- border-right: 1px solid #eeeeee; }
- ul.button_set > li:first-child {
- border-left: none;
- padding-left: 5px; }
- ul.button_set > li:last-child {
- border-right: none;
- margin-right: 0;
- padding-right: 5px; }
+ul.button_set {
+ padding: 5px 0; }
+ ul.button_set > li {
+ padding: 5px;
+ display: inline;
+ height: 100%;
+ border-left: 1px solid #cccccc;
+ border-right: 1px solid white;
+ margin-left: -3px;
+ margin-right: -3px; }
+ ul.button_set > li:first-child {
+ margin-left: 0;
+ border-left: none; }
+ ul.button_set > li:last-child {
+ margin-right: 0;
+ border-right: none; }
-.selected {
- background-color: #999999; }
+.button .selected, .button_set .selected {
+ background: -webkit-gradient(linear, 0% 29%, 0% 85%, from(#e0e0e0), to(#fafafa));
+ border-top: 1px solid #aaaaaa; }
.right {
position: absolute;
@@ -66,10 +69,14 @@ ul.button_set > li {
color: #999999;
font-size: 12px;
font-weight: normal;
- line-height: auto;
- padding: 10px; }
+ line-height: auto; }
.contextual_pane form {
margin: 0;
+ padding: 10px;
color: #999999; }
- .contextual_pane form input {
+ .contextual_pane form input[type='text'] {
+ width: 80%;
display: block; }
+ .contextual_pane form p {
+ padding: 10px;
+ display: inline; }