chat を更新

chat.md

@@ -9,29 +9,24 @@
 htmlに省略形式でcssを記述します。`tailwind.config.ts`を見てください。
 
 ```html
- <div className="flex py-10">
-
-      {params.postAuthor === "syui.bsky.social" && (
-         <iframe className="w-full px-8 h-[300px] sm:h-[450px] md:h-[600px]" title="stream" src="https://example.com" style={{}}>
+    {params.postAuthor === "syui.ai" && post.status === "live" && post.rkey === "3l7lj463zbo2m" && (
+    <div className="flex py-10 max-h-[700px] md:h-screen">
+         <iframe className="w-full hidden-scrollbar px-0 h-[300px] sm:h-[450px] md:px-0 md:h-[600px] md:px-8" title="stream" src="https://example.com">
         </iframe>
-      )}
 
-      <div className="hidden w-64 md:block">
+      <div className="hidden w-64 hidden-scrollbar md:block md:overflow-y-scroll
+      max-h-[600px]
+      [&::-webkit-scrollbar]:w-2
+      [&::-webkit-scrollbar-track]:bg-gray-100
+      [&::-webkit-scrollbar-thumb]:bg-gray-300
+      dark:[&::-webkit-scrollbar-track]:bg-neutral-700
+      dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500">
       <LinkAlternateAtUri
         authority={authorDid}
         collection={PostCollection}
         rkey={post.rkey}
       />
-      {post.status === "live" ? (
         <NewComment postRkey={post.rkey} postAuthorDid={authorDid} />
-      ) : (
-        <Alert>
-          <AlertTitle>This post has been deleted</AlertTitle>
-          <AlertDescription>
-            Deleted posts cannot receive new comments.
-          </AlertDescription>
-        </Alert>
-      )}
       {comments.map((comment) => (
         <Comment
           key={comment.id}
@@ -42,8 +37,8 @@ htmlに省略形式でcssを記述します。`tailwind.config.ts`を見てく
         />
       ))}
       </div>
-
     </div>
+    )}
 ```
 
 `@media`を制御する`sm`, `md`などは記述する順序を間違えると動きませんので注意。