add edit button

src/app/blog/post/[slug]/PostDisplay.tsx

@@ -146,13 +146,34 @@ export default function PostDisplay({
       <div
         style={{
           display: "flex",
-          justifyContent: "flex-end",
+          justifyContent: "space-between",
           marginTop: "1rem",
-          userSelect: "none",
-          cursor: "pointer",
-          backgroundColor: "transparent",
         }}
       >
+        {loggedIn ? (
+          <div
+            style={{
+              backgroundColor: "#a66",
+              color: "#111",
+              fontSize: "0.8rem",
+              padding: "0.5rem",
+              transition: "background-color 0.3s linear",
+              userSelect: "none",
+              cursor: "pointer",
+            }}
+            onMouseOver={(e) => {
+              e.currentTarget.style.backgroundColor = "#c88";
+            }}
+            onMouseOut={(e) => {
+              e.currentTarget.style.backgroundColor = "#a66";
+            }}
+            onClick={() => router.push(`/blog/write/${post.slug}`)}
+          >
+            edit
+          </div>
+        ) : (
+          <div></div>
+        )}
         <span
           style={{
             backgroundColor: "#999",
@@ -160,6 +181,8 @@ export default function PostDisplay({
             fontSize: "0.8rem",
             padding: "0.5rem",
             transition: "background-color 0.3s linear",
+            userSelect: "none",
+            cursor: "pointer",
           }}
           onMouseOver={(e) => {
             e.currentTarget.style.backgroundColor = "#eee";