+20

src/components/status.css

reviewed

··· 1899 1899 width: 100%; 1900 1900 height: 100%; 1901 1901 } 1902 1902 + .card.card-post { 1903 1903 + flex-direction: row-reverse; 1904 1904 + 1905 1905 + .title { 1906 1906 + font-weight: 500; 1907 1907 + } 1908 1908 + 1909 1909 + .meta { 1910 1910 + -webkit-line-clamp: 5; 1911 1911 + line-clamp: 5; 1912 1912 + opacity: 1; 1913 1913 + font-size: inherit; 1914 1914 + } 1915 1915 + } 1916 1916 + .status.large .card.large.card-post, 1917 1917 + .status-carousel 1918 1918 + .content-container[data-content-text-weight='1'] 1919 1919 + .card.large.card-post { 1920 1920 + flex-direction: column-reverse; 1921 1921 + } 1902 1922 1903 1923 /* POLLS */ 1904 1924

+10 -1

src/components/status.jsx

reviewed

··· 2532 2532 ctx.putImageData(imageData, 0, 0); 2533 2533 blurhashImage = canvas.toDataURL(); 2534 2534 } 2535 2535 + 2536 2536 + // "Post": Quote post + card link preview combo 2537 2537 + // Assume all links from these domains are "posts" 2538 2538 + // Mastodon links are "posts" too but they are converted to real quote posts and there's too many domains to check 2539 2539 + // This is just "Progressive Enhancement" 2540 2540 + const isPost = ['x.com', 'twitter.com', 'threads.net'].includes(domain); 2541 2541 + 2535 2542 return ( 2536 2543 <a 2537 2544 href={cardStatusURL || url} 2538 2545 target={cardStatusURL ? null : '_blank'} 2539 2546 rel="nofollow noopener noreferrer" 2540 2540 - class={`card link ${blurhashImage ? '' : size}`} 2547 2547 + class={`card link ${isPost ? 'card-post' : ''} ${ 2548 2548 + blurhashImage ? '' : size 2549 2549 + }`} 2541 2550 lang={language} 2542 2551 dir="auto" 2543 2552 style={{