Attempt to fix attachments not showing up on Samsung Internet.

external/lang

@@ -1 +1 @@
-Subproject commit 1c7f5e749f22204a1350b32ff57f4d97e487a0a6
+Subproject commit 76f335d8928f5f3c33dbb9c6b05888ff7d2f12ef

src/components/common/messaging/attachments/Grid.tsx

@@ -2,17 +2,38 @@ import styled from "styled-components";
 
 import { Children } from "../../../../types/Preact";
 
-const Grid = styled.div`
+const Grid = styled.div<{ width: number; height: number }>`
     display: grid;
+    aspect-ratio: ${(props) => props.width} / ${(props) => props.height};
 
-    aspect-ratio: var(--aspect-ratio);
+    max-width: min(
+        100%,
+        ${(props) => props.width}px,
+        var(--attachment-max-width)
+    );
 
-    max-width: min(100%, var(--width), var(--attachment-max-width));
+    max-height: min(${(props) => props.height}px, var(--attachment-max-height));
-    max-height: min(var(--height), var(--attachment-max-height));
 
-    img, video {
+    @supports not (
+        aspect-ratio: ${(props) => props.width} / ${(props) => props.height}
+    ) {
+        div::before {
+            float: left;
+            padding-top: ${(props) => (props.height / props.width) * 100}%;
+            content: "";
+        }
+
+        div::after {
+            display: block;
+            content: "";
+            clear: both;
+        }
+    }
+
+    img,
+    video {
         grid-area: 1 / 1;
-        
+
         display: block;
 
         max-width: 100%;
@@ -44,24 +65,16 @@ type Props = Omit<
     JSX.HTMLAttributes<HTMLDivElement>,
     "children" | "as" | "style"
 > & {
-    style?: JSX.CSSProperties;
     children?: Children;
     width: number;
     height: number;
 };
 
 export function SizedGrid(props: Props) {
-    const { width, height, children, style, ...divProps } = props;
+    const { width, height, children, ...divProps } = props;
 
     return (
-        <Grid
+        <Grid {...divProps} width={width} height={height}>
-            {...divProps}
-            style={{
-                ...style,
-                "--width": `${width}px`,
-                "--height": `${height}px`,
-                "--aspect-ratio": `${width} / ${height}`,
-            }}>
             {children}
         </Grid>
     );