Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

cover img tag uses css max-height/width to prevent oddly shaped oddly…

… sized images from being humungous on page overflowing content
  • Loading branch information...
commit 820c14c9cc041faa3aecec1c7b7ece1f5dd84195 1 parent 186b6d4
Jonathan Rochkind jrochkind authored
Showing with 17 additions and 6 deletions.
  1. +17 −6 app/views/resolve/_cover_image.rhtml
23 app/views/resolve/_cover_image.rhtml
View
@@ -5,11 +5,22 @@
# small med and x-large correspond roughly to amazon sm, med and lg.
# large corresponds roughly to google medium. Just one dimension to
- # prevent disproportionate scaling.
- dimensions = { "small" => { "height" => 80 },
- "medium" => { "height" => 160},
- "large" => { "height" => 200 },
- "extra-large" => { "height" => 475}}
+ # prevent disproportionate scaling. We use CSS so we can set maximums
+ # in BOTH dimensions but let aspect ratio remain the same. We put it
+ # inline so HTML Snippet API clients get images constrained to reasonable
+ # sizes without extra CSS. IE6 won't do max-height/max-width, sorry IE6, no
+ # way to accomodate you (trying to put a width and a max-width triggers
+ # weird IE8 bugs!). Best we can do.
+ #
+ # generally the 'max-height' is our operative maximum for ordinary ratios,
+ # but we let the width be more than the height for weird ratio'd covers
+ # that are wider than square.
+ dimensions_style = {
+ "small" => "max-height: 80px; max-width: 100px;",
+ "medium" => "max-height: 160px; max-width: 200px;",
+ "large" => "max-height: 200px; max-width: 240px;",
+ "extra-large" => "max-height: 475px; max-width: 570px;"
+ }
@@ -27,7 +38,7 @@
img_params['src'] = url_for(:controller => "resource", :action => "proxy", :id => img_st.id )
end
- img_params.merge!( dimensions[size]) if fix_size
+ img_params.merge!( "style" => dimensions_style[size]) if fix_size
tag('img', img_params )
Please sign in to comment.
Something went wrong with that request. Please try again.