From 17dd0771d305da14e6d62bf7cd307f93d61bd32a Mon Sep 17 00:00:00 2001
From: syui <syui@noreply.git.syui.ai>
Date: Mon, 28 Oct 2024 15:51:50 +0000
Subject: [PATCH] =?UTF-8?q?frontpage=20=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontpage.md | 49 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 frontpage.md

diff --git a/frontpage.md b/frontpage.md
new file mode 100644
index 0000000..3ab53a4
--- /dev/null
+++ b/frontpage.md
@@ -0,0 +1,49 @@
+
+[frontpage](https://github.com/likeandscribe/frontpage)は[atproto](https://github.com/bluesky-social/atproto)を使って投稿の制御を行います。主にpdsの`collection`から検索と`at://`を使います。
+
+[next.js](https://github.com/vercel/next.js)で書かれています。layoutは[tailwindcss](https://github.com/tailwindlabs/tailwindcss)です。
+
+## tailwindcss
+
+htmlに省略形式でcssを記述します。
+
+```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={{}}>
+        </iframe>
+      )}
+
+      <div className="hidden w-64 md:block">
+      <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}
+          comment={comment}
+          level={0}
+          postAuthorParam={params.postAuthor}
+          postRkey={post.rkey}
+        />
+      ))}
+      </div>
+
+</div>
+```
+
+`@media`を制御する`sm`, `md`などは記述する順序を間違えると動きませんので注意。
+