bootstrapでプロフィールページを装飾したい。

#したいこと

左の写真がスマホなどの小さい画面で開いたときに表示される形。
右の写真がPCなどでかい画面で開いたときに表示される形にしたいです。

#現状
このbox全てbootstrapのcardで作ろうと考えています。しかし他に何かいい方法があれば教えていただきたいです。
ちなみに今は投稿一覧以外はcardで作成済みですが投稿一覧だけが難しいです。

#ソースコード

show.html.erb

<h2>ようこそ<%= current_user.name %>さん
  <%= link_to (edit_user_registration_path) do %>
  <i class="icon　fa-cog"><%= fa_icon 'cog'%></i>
  <% end %>
</h2>

<div class="container">
  <div class="row col-sm-12 col-md-4">
    <div class="mypage">
      <div class="top">
        <div class="card" style="width: 18rem;">
          <div class="card-body">
            <h5 class="card-title"><%= @user.name %></h5>
            <p class="card-text">自己紹介自己紹介自己紹介自己紹介自己紹介</p>
            <%= render 'stats' %>
            <%= render 'follow_form' %>
          </div>

        </div>
      </div>
      <div class="column">
        <div class="mypage-bottom">
          <div class="card">
            <div class="card-header">
              いいね
            </div>
            <ul class="list-group list-group-flush">
              <% @user.likes.each do |like| %>
              <li class="list-group-item">
                <%= Post.find(like.post_id).title  %>
              </li>
              <% end %>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<br />