# Terminal
rails g controller posts/cards show

# app/views/posts/index.html.erb
<div id="posts" class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-5">
  <% @posts.each do |post| %>
    <%= turbo_frame_tag dom_id(post, "card"), src: post_cards_path(post) do %>
      <div class="max-w-sm bg-white border border-gray-200 rounded-lg shadow">
        <%= image_tag post.poster.variant(:loader), class: "inset-0 w-full h-full rounded-t-lg" if post.poster.attached? %>
        <div class="p-3">
          <h1 class="text-2xl font-bold mb-5">
            <hr class="h-px my-8 bg-gray-800 border-gray-800 border-4">
          </h1>

          <p class="my-5">
            <hr class="h-px my-8 bg-gray-200 border-gray-200 border-4">
            <hr class="h-px my-8 bg-gray-200 border-gray-200 border-4">
            <hr class="h-px my-8 bg-gray-200 border-gray-200 border-4">
            <hr class="h-px my-8 bg-gray-200 border-gray-200 border-4">
            <hr class="h-px my-8 bg-gray-200 border-gray-200 border-4">
          </p>
        </div>
      </div>
    <% end %>
  <% end %>
</div>

# config/routes.rb
resources :posts do
  resource :cards, only: :show, module: :posts
end

# app/controllers/posts/cards_controller.rb
class Posts::CardsController < ApplicationController
  def show
    @post = Post.find(params[:post_id])
  end
end

# app/views/posts/cards/show.html.erb
<%= turbo_frame_tag dom_id(@post, "card") do %>
  <div class="max-w-sm bg-white border border-gray-200 rounded-lg shadow">
    <div id="<%= dom_id @post %>" class="">
      <%= image_tag @post.poster.variant(:thumb), class: "inset-0 w-full h-full rounded-t-lg" if @post.poster.attached? %>
      <div class="p-3">
        <h1 class="text-2xl font-bold mb-5">
          <%= @post.name %>
        </h1>

        <p class="my-5">
          <%= @post.content.to_plain_text.truncate(256, omission: "...") %>
        </p>

        <p>
          <%= link_to @post, class: "inline-flex items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300" do %>
            Read more
            <svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
              <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
            </svg>
          <% end %>
        </p>
      </div>
    </div>
  </div>
<% end %>

# app/models/post.rb
class Post < ApplicationRecord
  has_rich_text :content
  has_one_attached :poster do |blob|
    blob.variant :loader, resize_and_pad: [ 35, 19 ], saver: { quality: 50 }, gaussblur: 1
    blob.variant :thumb, resize_and_pad: [ 350, 185 ], saver: { quality: 100 }
  end
end