diff --git a/src/app.css b/src/app.css
index f72ba42a..3b152138 100644
--- a/src/app.css
+++ b/src/app.css
@@ -208,6 +208,18 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
var(--line-margin-end)
);
}
+.timeline.contextual
+ > li.descendant.thread
+ > .status-link
+ + .replies
+ .replies
+ .replies
+ > summary {
+ margin-left: calc(
+ var(--avatar-size) + var(--avatar-margin-start) + var(--avatar-margin-end) +
+ (var(--line-margin-end) * 2)
+ );
+}
.timeline.contextual
> li.descendant.thread
> .status-link
@@ -228,6 +240,18 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
var(--line-margin-end)
);
}
+.timeline.contextual
+ > li.descendant.thread
+ > .status-link
+ + .replies
+ .replies
+ .replies
+ .status-link {
+ padding-left: calc(
+ var(--avatar-size) + var(--avatar-margin-start) + var(--avatar-margin-end) +
+ (var(--line-margin-end) * 2)
+ );
+}
.timeline.contextual
> li.descendant:not(.thread)
> .status-link
@@ -245,6 +269,17 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
var(--thread-start) + var(--line-margin-end) + var(--line-margin-end)
);
}
+.timeline.contextual
+ > li.descendant:not(.thread)
+ > .status-link
+ + .replies
+ .replies
+ .replies
+ > summary {
+ margin-left: calc(
+ var(--thread-start) + var(--line-margin-end) + (var(--line-margin-end) * 2)
+ );
+}
.timeline.contextual
> li.descendant:not(.thread)
> .status-link
@@ -258,7 +293,16 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
+ .replies
.replies
.status-link {
- --line-margin-end: 32px;
+ padding-left: calc(var(--thread-start) + (var(--line-margin-end) * 2));
+}
+.timeline.contextual
+ > li.descendant:not(.thread)
+ > .status-link
+ + .replies
+ .replies
+ .replies
+ .status-link {
+ padding-left: calc(var(--thread-start) + (var(--line-margin-end) * 3));
}
.timeline.contextual > li.descendant:not(.thread):before {
content: '';
@@ -351,9 +395,10 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
background-repeat: no-repeat;
}
.timeline.contextual > li .replies .replies li {
- --line-start: calc(
- var(--thread-start) + var(--line-margin-end) + var(--line-margin-end)
- );
+ --line-start: calc(var(--thread-start) + (var(--line-margin-end) * 2));
+}
+.timeline.contextual > li .replies .replies .replies li {
+ --line-start: calc(var(--thread-start) + (var(--line-margin-end) * 3));
}
.timeline.contextual > li.thread .replies li {
--line-start: calc(
@@ -366,6 +411,12 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
var(--line-margin-end)
);
}
+.timeline.contextual > li.thread .replies .replies .replies li {
+ --line-start: calc(
+ var(--avatar-size) + var(--avatar-margin-start) + var(--avatar-margin-end) +
+ (var(--line-margin-end) * 2)
+ );
+}
.timeline.contextual > li .replies li:last-child {
background-size: 100% 20px;
}
@@ -387,6 +438,11 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
var(--thread-start) + var(--line-margin-end) + var(--line-margin-end)
);
}
+.timeline.contextual > li .replies .replies .replies li:before {
+ --line-start: calc(
+ var(--thread-start) + var(--line-margin-end) + (var(--line-margin-end) * 2)
+ );
+}
.timeline.contextual > li.thread .replies li:before {
--line-start: calc(
var(--avatar-size) + var(--avatar-margin-start) + var(--avatar-margin-end)
@@ -398,6 +454,12 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
var(--line-margin-end)
);
}
+.timeline.contextual > li.thread .replies .replies .replies li:before {
+ --line-start: calc(
+ var(--avatar-size) + var(--avatar-margin-start) + var(--avatar-margin-end) +
+ (var(--line-margin-end) * 2)
+ );
+}
.timeline.contextual.loading > li:not(.hero) {
/* opacity: 0.5; */
pointer-events: none;
diff --git a/src/pages/status.jsx b/src/pages/status.jsx
index aee39437..a5602f3b 100644
--- a/src/pages/status.jsx
+++ b/src/pages/status.jsx
@@ -144,8 +144,8 @@ function StatusPage() {
}
parent.__replies.push(status);
} else {
- // If no parent, it's probably a reply to a reply to a reply, level 3
- console.warn('[LEVEL 3] No parent found for', status);
+ // If no parent, something is wrong
+ console.warn('No parent found for', status);
}
}
});
@@ -175,6 +175,13 @@ function StatusPage() {
account: r2.account,
repliesCount: r2.repliesCount,
content: r2.content,
+ replies: r2.__replies?.map((r3) => ({
+ // Level 4
+ id: r3.id,
+ account: r3.account,
+ repliesCount: r3.repliesCount,
+ content: r3.content,
+ })),
})),
})),
})),
@@ -703,14 +710,14 @@ function SubComments({ hasManyStatuses, replies }) {
}}
>