1
0
mirror of https://github.com/danbee/danbarberphoto synced 2025-03-04 08:49:07 +00:00

Add retina sizes for all thumbnail images.

This commit is contained in:
Dan Barber 2013-07-13 14:20:40 +01:00
parent 8065dd4aa2
commit 8b5d92aac2
5 changed files with 34 additions and 4 deletions

View File

@ -8,7 +8,13 @@ class Photo < ActiveRecord::Base
:size8 => "224x224#", :size8 => "224x224#",
:size5 => "140x140#", :size5 => "140x140#",
:size3 => "84x84#", :size3 => "84x84#",
:size2 => "56x56#" }, :size2 => "56x56#",
:size17x2 => "952x952#",
:size11x2 => "616x616#",
:size8x2 => "448x448#",
:size5x2 => "280x280#",
:size3x2 => "168x168#",
:size2x2 => "112x112#" },
:storage => :s3, :storage => :s3,
:s3_credentials => "#{Rails.root}/config/s3.yml", :s3_credentials => "#{Rails.root}/config/s3.yml",
:s3_protocol => "https", :s3_protocol => "https",

View File

@ -1,3 +1,5 @@
<%= render 'shared/photo_styles', photos: @photos, size: 11 %>
<% content_for :navigation do %> <% content_for :navigation do %>
<div class="sg-5 page-links"> <div class="sg-5 page-links">
<% if @categories.previous_page -%> <% if @categories.previous_page -%>
@ -14,7 +16,7 @@
<% @num_blank = 4 - @categories.length -%> <% @num_blank = 4 - @categories.length -%>
<% @photos.each do |photo| %> <% @photos.each do |photo| %>
<div class="sg-11 photo" style="background: url('<%= photo.photo.url(:size11) %>')"> <div class="sg-11 photo" id="<%= photo.name.parameterize %>">
<%= link_to_photo photo %> <%= link_to_photo photo %>
</div> </div>
<% end %> <% end %>

View File

@ -1,9 +1,11 @@
<%= render 'shared/photo_styles', photos: [@photo], size: 17 %>
<% content_for :navigation do %> <% content_for :navigation do %>
<%= render 'shared/main_nav' %> <%= render 'shared/main_nav' %>
<% end %> <% end %>
<% if @photo %> <% if @photo %>
<div class="sg-17 photo" style="background: url('<%= @photo.photo.url(:size17) %>')"> <div class="sg-17 photo" id="<%= @photo.name.parameterize %>">
<%= link_to_photo @photo %> <%= link_to_photo @photo %>
</div> </div>
<% end %> <% end %>

View File

@ -1,3 +1,5 @@
<%= render 'shared/photo_styles', photos: @photos, size: 5 %>
<% content_for :navigation do %> <% content_for :navigation do %>
<div class="sg-5 page-links"> <div class="sg-5 page-links">
<% if @photos.previous_page -%> <% if @photos.previous_page -%>
@ -24,7 +26,7 @@
<% @num_blank = 11 - @photos.length -%> <% @num_blank = 11 - @photos.length -%>
<% @photos.each do |photo| %> <% @photos.each do |photo| %>
<div class="sg-5 photo" style="background: url('<%= photo.photo.url(:size5) %>')"> <div class="sg-5 photo" id="<%= photo.name.parameterize %>">
<%= link_to_photo photo %> <%= link_to_photo photo %>
</div> </div>
<% end %> <% end %>

View File

@ -0,0 +1,18 @@
<style type="text/css">
<% photos.each do |photo| %>
#<%= photo.name.parameterize %>.sg-<%= size %> {
background: url(<%= photo.photo.url(:"size#{size}") %>);
}
<% end %>
@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
<% photos.each do |photo| %>
#<%= photo.name.parameterize %>.sg-<%= size %> {
background: url(<%= photo.photo.url(:"size#{size}x2") %>);
background-size: 100%;
}
<% end %>
}
</style>