lenooby09.tech / social-app
mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

[Embed] Fix 3-image grid on Safari (#8198)

* fix 3-image grid for safari

* match 4-grid aspect ratio to app

authored by samuel.fm and committed by

GitHub c5a22ffd f46336e3

+10 -8
+10 -8
bskyembed/src/components/embed.tsx
··· 250 250 case 3: 251 251 return ( 252 252 <div className="flex gap-1 rounded-xl overflow-hidden w-full aspect-[2/1]"> 253 - <img 254 - src={content.images[0].thumb} 255 - alt={content.images[0].alt} 256 - className="flex-1 aspect-square object-cover rounded-sm" 257 - /> 258 - <div className="flex flex-col gap-1 flex-1 aspect-square"> 253 + <div className="flex-1 aspect-square"> 254 + <img 255 + src={content.images[0].thumb} 256 + alt={content.images[0].alt} 257 + className="w-full h-full object-cover rounded-sm" 258 + /> 259 + </div> 260 + <div className="flex flex-col gap-1 flex-1"> 259 261 {content.images.slice(1).map((image, i) => ( 260 262 <img 261 263 key={i} 262 264 src={image.thumb} 263 265 alt={image.alt} 264 - className="w-full h-full object-cover rounded-sm" 266 + className="flex-1 object-cover rounded-sm min-h-0" 265 267 /> 266 268 ))} 267 269 </div> ··· 275 277 key={i} 276 278 src={image.thumb} 277 279 alt={image.alt} 278 - className="aspect-video w-full object-cover rounded-sm" 280 + className="aspect-[3/2] w-full object-cover rounded-sm" 279 281 /> 280 282 ))} 281 283 </div>