-
+
+
+
{comments
? comments.map((_, i) => (
-
+
))
: null}
- >
+
)
}
diff --git a/components/comment.module.css b/components/comment.module.css
index 4a560d8f..e279ae41 100644
--- a/components/comment.module.css
+++ b/components/comment.module.css
@@ -8,6 +8,7 @@
.text {
margin-top: .1rem;
+ padding-right: .75rem;
}
.reply {
@@ -29,8 +30,20 @@
}
.skeleton .text {
- height: 100px;
+ height: 80px;
border-radius: .4rem;
+ margin-right: .75rem;
+}
+
+.skeleton .reply {
+ width: 45px;
+ height: 10px;
+ border-radius: .2rem;
+}
+
+.replyPadder {
+ padding: .25rem 0;
+ padding-bottom: .5rem;
}
.comment {
diff --git a/components/comments.js b/components/comments.js
index 0d339f26..233ddd0b 100644
--- a/components/comments.js
+++ b/components/comments.js
@@ -8,10 +8,10 @@ export default function Comments ({ comments, ...props }) {
}
export function CommentsSkeleton () {
- const comments = new Array(3).fill(null)
+ const comments = new Array(1).fill(null)
return comments.map((_, i) => (
-
+
))
}
diff --git a/components/header.js b/components/header.js
index dd3084a4..8e0ee8f5 100644
--- a/components/header.js
+++ b/components/header.js
@@ -18,7 +18,7 @@ export default function Header () {
if (session) {
return (
-
+
profile
diff --git a/components/item.js b/components/item.js
index 5b4e03b6..575a0332 100644
--- a/components/item.js
+++ b/components/item.js
@@ -64,6 +64,7 @@ export function ItemSkeleton ({ rank, children }) {
+
diff --git a/components/item.module.css b/components/item.module.css
index d76c9106..eac683f4 100644
--- a/components/item.module.css
+++ b/components/item.module.css
@@ -67,7 +67,7 @@
height: 14px;
background-color: grey;
width: 800px;
- border-radius: .4rem;
+ border-radius: .3rem;
margin: 3px 0px;
}
@@ -75,7 +75,7 @@
display: inline-flex;
width: 42px;
height: 70%;
- border-radius: .4rem;
+ border-radius: .27rem;
background-color: grey;
margin-right: .5rem;
}
diff --git a/pages/items/[id].js b/pages/items/[id].js
index 1a68ee12..7a1ed425 100644
--- a/pages/items/[id].js
+++ b/pages/items/[id].js
@@ -48,7 +48,7 @@ function LoadItem ({ query }) {
-