diff --git a/src/lib/media/manip.web.ts b/src/lib/media/manip.web.ts index 914b05d2..bdf6836a 100644 --- a/src/lib/media/manip.web.ts +++ b/src/lib/media/manip.web.ts @@ -117,9 +117,6 @@ function createResizedImage( return reject(new Error('Failed to resize image')) } - canvas.width = width - canvas.height = height - let scale = 1 if (mode === 'cover') { scale = img.width < img.height ? width / img.width : height / img.height @@ -128,10 +125,11 @@ function createResizedImage( } let w = img.width * scale let h = img.height * scale - let x = (width - w) / 2 - let y = (height - h) / 2 - ctx.drawImage(img, x, y, w, h) + canvas.width = w + canvas.height = h + + ctx.drawImage(img, 0, 0, w, h) resolve(canvas.toDataURL('image/jpeg', quality)) }) img.src = dataUri diff --git a/src/lib/themes.ts b/src/lib/themes.ts index b778d5b3..ad7574db 100644 --- a/src/lib/themes.ts +++ b/src/lib/themes.ts @@ -25,6 +25,7 @@ export const defaultTheme: Theme = { postCtrl: '#71768A', brandText: '#0066FF', emptyStateIcon: '#B6B6C9', + borderLinkHover: '#cac1c1', }, primary: { background: colors.blue3, @@ -310,6 +311,7 @@ export const darkTheme: Theme = { postCtrl: '#707489', brandText: '#0085ff', emptyStateIcon: colors.gray4, + borderLinkHover: colors.gray5, }, primary: { ...defaultTheme.palette.primary, diff --git a/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx b/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx index 27aa804d..1523dcf5 100644 --- a/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx +++ b/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx @@ -23,29 +23,16 @@ export const ExternalLinkEmbed = ({ ) return ( - + {link.thumb && !embedPlayerParams ? ( + style={{ + borderTopLeftRadius: 6, + borderTopRightRadius: 6, + width: '100%', + height: isMobile ? 200 : 300, + overflow: 'hidden', + }}> {toNiceDomain(link.uri)} - + {link.title || link.uri} {link.description ? ( {link.description} @@ -90,8 +73,7 @@ export const ExternalLinkEmbed = ({ const styles = StyleSheet.create({ extImage: { - width: '100%', - height: 200, + flex: 1, }, extUri: { marginTop: 2, diff --git a/src/view/com/util/post-embeds/QuoteEmbed.tsx b/src/view/com/util/post-embeds/QuoteEmbed.tsx index e793f983..fbb89af2 100644 --- a/src/view/com/util/post-embeds/QuoteEmbed.tsx +++ b/src/view/com/util/post-embeds/QuoteEmbed.tsx @@ -98,6 +98,7 @@ export function QuoteEmbed({ return ( + @@ -168,11 +168,14 @@ export function PostEmbeds({ const link = embed.external return ( - - - - - + + + ) } @@ -180,9 +183,6 @@ export function PostEmbeds({ } const styles = StyleSheet.create({ - stackContainer: { - gap: 6, - }, imagesContainer: { marginTop: 8, },