From b703efe7856d4dca6283455c016d333ae170524b Mon Sep 17 00:00:00 2001 From: Christoph Haas Date: Fri, 9 Aug 2013 23:02:22 +0200 Subject: [PATCH] Properly bootstrap-style media grid for thumbnails --- app/assets/stylesheets/my.css.scss | 32 +++++++++++++++++++ .../_packages_search_results.html.erb | 18 +++++++---- app/views/packages/index.html.erb | 8 ++--- 3 files changed, 47 insertions(+), 11 deletions(-) create mode 100644 app/assets/stylesheets/my.css.scss diff --git a/app/assets/stylesheets/my.css.scss b/app/assets/stylesheets/my.css.scss new file mode 100644 index 0000000..2351beb --- /dev/null +++ b/app/assets/stylesheets/my.css.scss @@ -0,0 +1,32 @@ +/* Make sure thumbnails in grids are 160x120 pixels */ +ul.thumbnails div.thumbnail img +{ + /*border: 5px solid green;*/ + margin-left: auto; + margin-right: auto; + /*width: 260px;*/ + /*height: 220px;*/ +} + +ul.thumbnails div.thumbnail +{ + width: 200px; + height: 230px; +} + +ul.thumbnails h3 +{ + font-size: 18px; + line-height: normal; + text-align: center; + white-space: nowrap; + overflow: hidden; +} + +.row.showmorebox +{ + border: 1px solid #DDD; + padding: 10px 20px; + text-align: center; + font-size: 30px; +} \ No newline at end of file diff --git a/app/views/packages/_packages_search_results.html.erb b/app/views/packages/_packages_search_results.html.erb index b85b2f3..db8fd25 100644 --- a/app/views/packages/_packages_search_results.html.erb +++ b/app/views/packages/_packages_search_results.html.erb @@ -5,12 +5,14 @@ <% @packages.each do |package| %>
  • <% if package.screenshots.length>0 %> - <%= link_to (image_tag '', :"data-src" => package.screenshots.first.image_url('small')), - package.screenshots.first.image_url('large'), - html_options = {:class => 'thumbnail'} - %> -

    <%= package.name %>

    -

    <%= package.description %>

    +
    +
    + <%= link_to (image_tag package.screenshots.first.image_url('small')), + package.screenshots.first.image_url('large') %> +
    +

    <%= package.name %>

    +

    <%= package.description %>

    +
    <% else %> No screenshot. :( Care to upload one? <% end %> @@ -19,3 +21,7 @@ <% end %> <% end %> + + \ No newline at end of file diff --git a/app/views/packages/index.html.erb b/app/views/packages/index.html.erb index 0ced0f9..0cd7ebd 100644 --- a/app/views/packages/index.html.erb +++ b/app/views/packages/index.html.erb @@ -1,11 +1,9 @@ -

    Hello, Rails!

    -

    Search for a package/description:

    <%= form_tag(url_for, method: "get") do %> <%= text_field_tag :search, params[:search], autofocus: true, placeholder: 'What are you looking for...' %> | - With screenshots? <%= check_box_tag 'with_screenshots', 'yes', true %> + With screenshots? <%= check_box_tag 'with_screenshots', 'yes', params[:with_screenshots] %> | <%= submit_tag "Search" %> <% end %> @@ -14,7 +12,7 @@

    Search results

    -
    + <%= render "packages_search_results", object: @packages %> -
    +