image thumbnail

app/assets/stylesheets/modules/image.css.scss

+.large-item-image.img-thumbnail {
+  width: 100%;
+  height: 120px;
+  object-fit: cover;
+}

app/assets/stylesheets/modules/label.css.scss

+@import 'modules/settings';
+
+.label-default {
+  background-color: transparent;
+  color: $theme-color-dark;
+  border: 1px solid $theme-color-dark;
+}

app/assets/stylesheets/modules/layout.css.scss

@@ -7,7 +7,9 @@ html, body {
 body {
   padding-top: 80px;
 
-  &.rails-posts-edit, &.rails-posts-fork {
+  &.rails-posts-new,
+  &.rails-posts-edit,
+  &.rails-posts-fork {
     padding-top: 20px;
   }
 }

app/assets/stylesheets/modules/text.css.scss

 @import 'modules/settings';
 
-// .text-shadow {
-//   color: #999999;
-// }
-
 a {
   // color: $theme-color-main;
 
-  &:visited {
-    color: $theme-color-dark;
-  }
+  // &:visited {
+  //   color: $theme-color-dark;
+  // }
+}
+
+.text-shadow {
+  color: #999999;
 }
 

app/decorators/post_decorator.rb

@@ -46,4 +46,10 @@ class PostDecorator < Draper::Decorator
       ''
     end
   end
+
+  def thumbnail_url
+    if model.body =~ /!\[.+?\]\((.+?)\)/
+      return $1
+    end
+  end
 end

app/views/posts/_large_item.html.slim

@@ -2,24 +2,27 @@
 /   post {Post}
 
 / a.list-group-item.post-list.mod-hover-hidden data-post-id=post.id href=post_path(post)
-.container-fluid
-  .row
-    .col-xs-9
+.row
+  .col-xs-8
     h4
       a href=post_path(post) = post.title
-    .col-xs-3
-      span.label.label-date.pull-right = post.display_specified_date if post.specified_date
-  .row
-    .col-xs-8
-      small.text-success.posted-name
-        | #{post.author.name} posted 
-        abbr.js-time-ago data-time-ago-at=post.updated_at
-        |.  
+
+    p.small
+      span.label.label-default.label-date = post.display_specified_date if post.specified_date
+      |  
       - post.tags.map(&:decorate).each do |tag|
-          a.label.label-tag href=tag.show_path = tag.structured_name
+        a.label.label-default.label-tag href=tag.show_path = tag.structured_name
         |  
+
   .col-xs-4
-      small.pull-right
+    p.small.text-success.posted-name
+      span
+        | #{post.author.name} posted 
+        abbr.js-time-ago data-time-ago-at=post.updated_at
+        |   
+
+    p
+      .small
         span.glyphicon.glyphicon-time title="読了時間"
         |  #{post.read_time}  
 
@@ -29,7 +32,17 @@
         span.glyphicon.glyphicon-eye-open title="閲覧者数"
         |  #{post.visited_user_count}  
 
-  .row
+
+.row
+  - if post.thumbnail_url
+    .col-xs-8
+      p.small.text-shadow
+        = truncate post.body, length: 200
+    .col-xs-4
+      p
+        image.img-thumbnail.large-item-image src=asset_path(post.thumbnail_url)
+
+  - else
     .col-xs-12
-      small.text-shadow
-        = truncate post.body, length: 140
+      p.small.text-shadow
+        = truncate post.body, length: 200

app/views/search/show.html.slim

 /! view:search/show
 
 .row
-
   .col-xs-12.col-md-8 role="navigation"
     .panel.panel-main
       .panel-heading
@@ -18,7 +17,7 @@
     = paginate(@posts)
 
   .col-xs-12.col-md-4
-    .panel
+    .panel.panel-default
       .panel-heading
         h3.panel-title
           i.fa.fa-tags
@@ -27,7 +26,7 @@
         - @posts.related_tags.each do |tag|
           a.list-group-item href=search_path(q: "##{tag.name}") = tag.name
 
-    .panel
+    .panel.panel-default
       .panel-heading
         h3.panel-title
           i.fa.fa-users
@@ -35,32 +34,3 @@
       .panel-body.list-group
         - @posts.related_authors.each do |author|
           a.list-group-item href=search_path(q: "@#{author.nickname}") = author.name
-
-
-
-
-  / h1
-  /   span "#{params[:q]}"
-  /   span.small - 検索結果
-  /   span.small #{@count}件
-
-  / .col-xs-8 role="navigation"
-  /   .list-group
-  /     - @posts.each do |post|
-  /       = render partial: 'posts/large_item', locals: { post: post }
-  /   = paginate(@posts)
-
-  / .col-xs-4
-  /   .panel.panel-default
-  /     .panel-heading
-  /       h2.panel-title "#{params[:q]}"に関連するタグ
-  /     .panel-body.list-group
-  /       - @posts.related_tags.each do |_tag|
-  /         a.list-group-item href=search_path(q: "##{_tag.name}") = _tag.name
-
-  /   .panel.panel-default
-  /     .panel-heading
-  /       h2.panel-title "#{params[:q]}"に関連するユーザー
-  /     .panel-body.list-group
-  /       - @posts.related_authors.each do |_author|
-  /         a.list-group-item href=search_path(q: "@#{_author.nickname}") = _author.name