aboutsummaryrefslogtreecommitdiff
path: root/Timeline/ClientApp/src/timeline/Timeline.tsx
diff options
context:
space:
mode:
authorcrupest <crupest@outlook.com>2020-06-10 15:21:32 +0800
committercrupest <crupest@outlook.com>2020-06-10 15:21:32 +0800
commit7ec5cf66cef88bc7d3b8720070f40cceb452aec4 (patch)
tree00d2663e9e0b1f528a023cc7e16a689a80beb8ca /Timeline/ClientApp/src/timeline/Timeline.tsx
parent788ffcb06fcf021312f70c3e296011bb06fe1e84 (diff)
downloadtimeline-7ec5cf66cef88bc7d3b8720070f40cceb452aec4.tar.gz
timeline-7ec5cf66cef88bc7d3b8720070f40cceb452aec4.tar.bz2
timeline-7ec5cf66cef88bc7d3b8720070f40cceb452aec4.zip
feat(front): Fix #75 .
Diffstat (limited to 'Timeline/ClientApp/src/timeline/Timeline.tsx')
-rw-r--r--Timeline/ClientApp/src/timeline/Timeline.tsx68
1 files changed, 35 insertions, 33 deletions
diff --git a/Timeline/ClientApp/src/timeline/Timeline.tsx b/Timeline/ClientApp/src/timeline/Timeline.tsx
index f6ff8949..1ec3795f 100644
--- a/Timeline/ClientApp/src/timeline/Timeline.tsx
+++ b/Timeline/ClientApp/src/timeline/Timeline.tsx
@@ -56,41 +56,43 @@ const Timeline: React.FC<TimelineProps> = (props) => {
}, [posts, onDelete]);
return (
- <div className={clsx('pr-2', props.className)}>
- <Container fluid className="d-flex flex-column">
- {(() => {
- const length = posts.length;
- return posts.map((post, i) => {
- const av: number | undefined =
- user != null && user.username === post.author.username
- ? avatarVersion
- : undefined;
+ <Container
+ fluid
+ className={clsx('d-flex flex-column position-relative', props.className)}
+ >
+ <div className="timeline-enter-animation-mask" />
+ {(() => {
+ const length = posts.length;
+ return posts.map((post, i) => {
+ const av: number | undefined =
+ user != null && user.username === post.author.username
+ ? avatarVersion
+ : undefined;
- const toggleMore = onToggleDelete[i];
+ const toggleMore = onToggleDelete[i];
- return (
- <TimelineItem
- post={post}
- key={post.id}
- current={length - 1 === i}
- more={
- toggleMore
- ? {
- isOpen: indexShowDeleteButton === i,
- toggle: toggleMore,
- onDelete: onItemDelete[i],
- }
- : undefined
- }
- onClick={onItemClick}
- avatarVersion={av}
- onResize={onResize}
- />
- );
- });
- })()}
- </Container>
- </div>
+ return (
+ <TimelineItem
+ post={post}
+ key={post.id}
+ current={length - 1 === i}
+ more={
+ toggleMore
+ ? {
+ isOpen: indexShowDeleteButton === i,
+ toggle: toggleMore,
+ onDelete: onItemDelete[i],
+ }
+ : undefined
+ }
+ onClick={onItemClick}
+ avatarVersion={av}
+ onResize={onResize}
+ />
+ );
+ });
+ })()}
+ </Container>
);
};