ui: re-introduce adaptive download pill sizing for album tiles
- AttachmentDownloadPill: bring back the optional adaptive sizing branch (default off). When the host sets containerType: inline-size, the pill scales 22-30px with the tile width using a steeper 18cqw curve, so two-image tiles already reach 30px while tiny thumbs in mixed layouts stay at 22px. - AlbumBubble: opt every tile into adaptive sizing and add the query container so the cqw units resolve against each tile's width. - Single-image and video bubbles continue to render the pill at a fixed 30px (no host opt-in needed).
This commit is contained in:
@@ -51,6 +51,8 @@ export function AlbumBubble({ post }: { post: Post }) {
|
||||
top: `${tile.top * 100}%`,
|
||||
width: `calc(${tile.width * 100}% - ${ALBUM_GAP}px)`,
|
||||
height: `calc(${tile.height * 100}% - ${ALBUM_GAP}px)`,
|
||||
// Query container so the download pill scales with this tile.
|
||||
containerType: "inline-size",
|
||||
}}
|
||||
>
|
||||
<button
|
||||
@@ -76,7 +78,11 @@ export function AlbumBubble({ post }: { post: Post }) {
|
||||
) : null}
|
||||
</button>
|
||||
{!isLastSlot ? (
|
||||
<AttachmentDownloadPill postId={post.id} attachment={att} />
|
||||
<AttachmentDownloadPill
|
||||
postId={post.id}
|
||||
attachment={att}
|
||||
adaptive
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user