Rails의 bootstrap 홈 화면 축소판 그림 Partial

4351 단어 RubyRails
지난번Rails Bootstrap 슬라이드에서 Partial 상영에 이어서 저도 미리 보기 그림을 만들어 보았기 때문에 적어 놓았습니다.
아이콘 이미지는 64pxicooon-mono를 사용합니다.

home.html.erb
<%= render 'home_thumbnail', thumbnails: [ { title: 'いつでも', image: 'clock.png', caption: 'いつでも' },
  { title: 'どこでも', image: 'place.png', caption: 'どこでも' }, 
  { title: '全員で', image: 'meeting.png', caption: '全員で' } ] %>
3개의 너비 지정 4
_home_thumbnail.html.erb
<div class="container">
    <div class="row">
        <% thumbnails.each do |t| %>
            <div class="col-md-4">
                <div class="thumbnail">
                    <%= image_tag(t[:image], :alt => t[:image]) %>
                    <div class="caption">
                        <h3><%= t[:title] %></h3>
                        <p><%= t[:caption] %></p>
                    </div>
                </div>
            </div>
        <% end %>
    </div>
</div>
home.scss
.thumbnail{
  .caption {
    text-align: center;
  }
}

좋은 웹페이지 즐겨찾기