From 6b2bfcc21ded4cefefaebfe8717c8e80fa188d33 Mon Sep 17 00:00:00 2001
From: "Natalie B." <22222885+espeon@users.noreply.github.com>
Date: Thu, 13 Feb 2025 01:50:29 -0600
Subject: [PATCH] simplify styles a tad

---
 src/components/json/appBskyEmbedImages.tsx | 2 +-
 src/components/renderJson.tsx              | 4 ++--
 src/routes/jetstream.lazy.tsx              | 8 +++++---
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/components/json/appBskyEmbedImages.tsx b/src/components/json/appBskyEmbedImages.tsx
index 50b5051..1ab26a3 100644
--- a/src/components/json/appBskyEmbedImages.tsx
+++ b/src/components/json/appBskyEmbedImages.tsx
@@ -44,7 +44,7 @@ export const AppBskyEmbedImagesLayout = ({
             <img
               src={getBlueskyCdnLink(did, image.image.ref.$link, "jpeg")}
               alt=""
-              className={`w-full h-full cursor-pointer object-cover transition-transform duration-300 hover:scale-[101%] ${imageCount > 1 && "max-h-64"}`}
+              className={`w-full max-w-96 h-full cursor-pointer object-cover transition-transform duration-300 hover:scale-[101%] ${imageCount > 1 && "max-h-64"}`}
               style={{
                 aspectRatio: imageCount === 1 ? "" : "1/1",
               }}
diff --git a/src/components/renderJson.tsx b/src/components/renderJson.tsx
index 879c17d..69922d4 100644
--- a/src/components/renderJson.tsx
+++ b/src/components/renderJson.tsx
@@ -97,7 +97,7 @@ export function RenderJson(props: {
     }
   }
   return (
-    <div>
+    <>
       {Object.keys(props.data).map((k) => {
         return (
           <div style={{ marginLeft: `${20}px` }}>
@@ -111,6 +111,6 @@ export function RenderJson(props: {
           </div>
         );
       })}
-    </div>
+    </>
   );
 }
diff --git a/src/routes/jetstream.lazy.tsx b/src/routes/jetstream.lazy.tsx
index 137532b..1a5eb78 100644
--- a/src/routes/jetstream.lazy.tsx
+++ b/src/routes/jetstream.lazy.tsx
@@ -267,7 +267,7 @@ function RouteComponent() {
   const loading = Object.values(loadingStates).some(Boolean);
   return (
     <main className="h-screen w-full relative max-h-[calc(100vh-5rem)]">
-      <div className="max-w-screen-xl mx-auto py-16 gap-4 flex flex-col">
+      <div className="w-full max-w-screen-xl mx-auto py-16 gap-4 flex flex-col">
         <div className="px-4 lg:px-8 gap-4 flex flex-col w-full">
           <div className="flex flex-col md:flex-row">
             <div className="flex flex-row gap-4">
@@ -396,9 +396,11 @@ function RouteComponent() {
             </div>
           )}
         </div>
-        <div className="gap-8 flex flex-col max-w-[100vw] w-full overflow-scroll scrollbar-hide">
+        <div className="max-w-2xl w-full">
           {jet.records.map((r) => (
-            <RenderJson pds="" did={r.did} data={r} />
+            <div className="max-w-min text-wrap overflow-x-auto mb-8">
+              <RenderJson pds="" did={r.did} data={r} />
+            </div>
           ))}
           <div className="px-4 lg:px-8 ">
             {jet.records.length} records in cache.
-- 
2.51.2