x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="flex flex-wrap items-end gap-6"> <div class="flex flex-col items-center gap-2"> <img src="/icon.png" class="block max-w-full rounded-md" alt="Icon" loading="lazy" style="width: 48px"> <span class="text-xs text-muted-foreground">width: 48px</span> </div> <div class="flex flex-col items-center gap-2"> <img src="/icon.png" class="block max-w-full rounded-md" alt="Icon" loading="lazy" style="width: 96px"> <span class="text-xs text-muted-foreground">width: 96px</span> </div> <div class="flex flex-col items-center gap-2"> <img src="/icon.png" class="block max-w-full rounded-md" alt="Icon" loading="lazy" style="width: 160px"> <span class="text-xs text-muted-foreground">width: 160px</span> </div></div>1
2
3
4
5
6
7
8
9
<%# Dimensions land on the <img> itself, not on a wrapper. %><div class="flex flex-wrap items-end gap-6"> <% ["48px", "96px", "160px"].each do |w| %> <div class="flex flex-col items-center gap-2"> <%= render(UI::Image.new(src: "/icon.png", rounded: :md, width: w)) %> <span class="text-xs text-muted-foreground">width: <%= w %></span> </div> <% end %></div>No notes provided.
No params configured.