Bluesky app fork with some witchin' additions 💫
0
fork

Configure Feed

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

Tweak embed styles (#10226)

authored by

Samuel Newman and committed by
GitHub
c79dff9b 13b453e5

+38 -8
+12 -6
bskyembed/src/components/embed.tsx
··· 16 16 import infoIcon from '../../assets/circleInfo_stroke2_corner0_rounded.svg' 17 17 import playIcon from '../../assets/play_filled_corner0_rounded.svg' 18 18 import starterPackIcon from '../../assets/starterPack.svg' 19 + import {Globe} from '../icons/Globe' 19 20 import {CONTENT_LABELS, labelsToInfo} from '../labels' 20 21 import * as bsky from '../types/bsky' 21 22 import {getRkey} from '../util/rkey' ··· 93 94 /> 94 95 </div> 95 96 <div className="flex flex-1 items-center shrink min-w-0 min-h-0"> 96 - <p className="block text-sm shrink-0 font-bold max-w-[70%] line-clamp-1"> 97 + <p className="block text-sm shrink-0 font-semibold max-w-[70%] line-clamp-1"> 97 98 {record.author.displayName?.trim() || record.author.handle} 98 99 </p> 99 100 {verification.isVerified && ( ··· 334 335 /> 335 336 )} 336 337 <div className="py-3 px-4"> 337 - <p className="text-sm text-textLight dark:text-textDimmed line-clamp-1"> 338 - {toNiceDomain(content.external.uri)} 338 + <p className="font-semibold leading-tight line-clamp-3"> 339 + {content.external.title} 339 340 </p> 340 - <p className="font-semibold line-clamp-3">{content.external.title}</p> 341 - <p className="text-sm text-textLight dark:text-textDimmed line-clamp-2 mt-0.5"> 341 + <p className="text-sm leading-snug text-textLight dark:text-textDimmed line-clamp-2 mt-0.5"> 342 342 {content.external.description} 343 343 </p> 344 + <div className="flex flex-row items-center gap-1 border-t dark:border-slate-600 mt-1 pt-1.5"> 345 + <Globe size={12} className="text-textLight dark:text-textDimmed" /> 346 + <p className="text-sm leading-none text-textLight dark:text-textDimmed line-clamp-1"> 347 + {toNiceDomain(content.external.uri)} 348 + </p> 349 + </div> 344 350 </div> 345 351 </Link> 346 352 ) ··· 374 380 <div className="w-8 h-8 rounded-md bg-brand shrink-0" /> 375 381 )} 376 382 <div className="flex-1"> 377 - <p className="font-bold text-sm">{title}</p> 383 + <p className="font-semibold text-sm">{title}</p> 378 384 <p className="text-textLight dark:text-textDimmed text-sm"> 379 385 {subtitle} 380 386 </p>
+2 -2
bskyembed/src/components/post.tsx
··· 70 70 <div className="flex flex-1 items-center"> 71 71 <Link 72 72 href={`/profile/${post.author.did}`} 73 - className="block font-bold text-[15px] min-[400px]:text-[17px] leading-5 line-clamp-1 hover:underline underline-offset-2 text-ellipsis decoration-2"> 73 + className="block font-semibold text-[15px] min-[400px]:text-[17px] leading-5 line-clamp-1 hover:underline underline-offset-2 text-ellipsis decoration-2"> 74 74 {post.author.displayName?.trim() || post.author.handle} 75 75 </Link> 76 76 {verification.isVerified && ( ··· 213 213 } 214 214 215 215 return ( 216 - <p className="text-md min-[400px]:text-lg leading-6 min-[300px]:leading-6 break-word break-words whitespace-pre-wrap"> 216 + <p className="text-md min-[400px]:text-lg leading-snug min-[400px]:leading-snug break-word break-words whitespace-pre-wrap"> 217 217 {richText} 218 218 </p> 219 219 )
+24
bskyembed/src/icons/Globe.tsx
··· 1 + import {h} from 'preact' 2 + 3 + export const Globe = ({ 4 + size = 14, 5 + className, 6 + }: { 7 + size?: number 8 + className?: string 9 + }) => ( 10 + <svg 11 + className={className} 12 + width={size} 13 + height={size} 14 + xmlns="http://www.w3.org/2000/svg" 15 + fill="none" 16 + viewBox="0 0 24 24"> 17 + <path 18 + fill="currentColor" 19 + fill-rule="evenodd" 20 + d="M4.4 9.493C4.14 10.28 4 11.124 4 12a8 8 0 1 0 10.899-7.459l-.953 3.81a1 1 0 0 1-.726.727l-3.444.866-.772 1.533a1 1 0 0 1-1.493.35L4.4 9.493Zm.883-1.84L7.756 9.51l.44-.874a1 1 0 0 1 .649-.52l3.306-.832.807-3.227a7.99 7.99 0 0 0-7.676 3.597ZM2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12Zm8.43.162a1 1 0 0 1 .77-.29l1.89.121a1 1 0 0 1 .494.168l2.869 1.928a1 1 0 0 1 .336 1.277l-.973 1.946a1 1 0 0 1-.894.553h-2.92a1 1 0 0 1-.831-.445L9.225 14.5a1 1 0 0 1 .126-1.262l1.08-1.076Zm.915 1.913.177-.177 1.171.074 1.914 1.286-.303.607h-1.766l-1.194-1.79Z" 21 + clip-rule="evenodd" 22 + /> 23 + </svg> 24 + )