x
1
2
3
4
5
6
7
<div>
<div class="w-96">
<div class="relative w-full" style="padding-bottom: 100.0%;">
<div class="bg-muted absolute inset-0 [&>img]:object-cover [&>img]:absolute [&>img]:h-full [&>img]:w-full [&>img]:inset-0 [&>img]:text-transparent"><img alt="Placeholder" loading="lazy" src="/assets/pattern-5f5dd643.jpg"></div>
</div>
</div>
</div>
1
2
3
4
5
6
7
render(TestView.new) do
div(class: "w-96") do
AspectRatio(aspect_ratio: "1/1") do |aspect_ratio|
aspect_ratio.img(alt: "Placeholder", loading: "lazy", src: helpers.image_path("pattern.jpg"))
end
end
end