...

6 files changed, 7 insertions, 17 deletions

diff --git a/FrontEnd/src/pages/timeline/Timeline.css b/FrontEnd/src/pages/timeline/Timeline.css
index 30ad75c9..419ab9b1 100644
--- a/FrontEnd/src/pages/timeline/Timeline.css
+++ b/FrontEnd/src/pages/timeline/Timeline.css
@@ -1,5 +1,4 @@
 .timeline {
-  --timeline-background-color: #f3f3f3;
   --timeline-shadow-color: #00000080;
   --timeline-post-line-color: #eadd2c;
   --timeline-post-line-shadow: 2px 1px 10px -1px var(--timeline-shadow-color);
@@ -13,7 +12,6 @@
   z-index: 0;
   position: relative;
   width: 100%;
-  background-color: var(--timeline-background-color);
 }
 
 @keyframes timeline-line-node {
diff --git a/FrontEnd/src/pages/timeline/Timeline.tsx b/FrontEnd/src/pages/timeline/Timeline.tsx
index d05336d7..3c9d73bf 100644
--- a/FrontEnd/src/pages/timeline/Timeline.tsx
+++ b/FrontEnd/src/pages/timeline/Timeline.tsx
@@ -156,7 +156,7 @@ export function Timeline(props: TimelineProps) {
     return <div className={className}>Error.</div>;
   }
   return (
-    <>
+    <div>
       {timeline && (
         <TimelineCard
           timeline={timeline}
@@ -172,7 +172,7 @@ export function Timeline(props: TimelineProps) {
           <TimelinePostList posts={posts} onReload={updatePosts} />
         </div>
       )}
-    </>
+    </div>
   );
 }
 
diff --git a/FrontEnd/src/pages/timeline/TimelineCard.tsx b/FrontEnd/src/pages/timeline/TimelineCard.tsx
index 04b34ec1..b287c620 100644
--- a/FrontEnd/src/pages/timeline/TimelineCard.tsx
+++ b/FrontEnd/src/pages/timeline/TimelineCard.tsx
@@ -123,7 +123,7 @@ export default function TimelineCard(props: TimelinePageCardProps) {
 
   return (
     <Card
-      color="tertiary"
+      color="secondary"
       className={`timeline-card timeline-card-${
         collapse ? "collapse" : "expand"
       }`}
diff --git a/FrontEnd/src/pages/timeline/TimelinePostCard.css b/FrontEnd/src/pages/timeline/TimelinePostCard.css
index 3a446f44..67b447aa 100644
--- a/FrontEnd/src/pages/timeline/TimelinePostCard.css
+++ b/FrontEnd/src/pages/timeline/TimelinePostCard.css
@@ -1,7 +1,6 @@
 .timeline-post-card {
   padding: 1em 1em 1em 3em;
-  color: var(--timeline-post-text-color);
-  background-color: var(--timeline-post-card-background-color);
+  background-color: var(--cru-background-color);
   box-shadow: var(--timeline-post-card-shadow);
   border-radius: var(--timeline-post-card-border-radius);
   position: relative;
diff --git a/FrontEnd/src/pages/timeline/TimelinePostCard.tsx b/FrontEnd/src/pages/timeline/TimelinePostCard.tsx
index f3743915..23dd141f 100644
--- a/FrontEnd/src/pages/timeline/TimelinePostCard.tsx
+++ b/FrontEnd/src/pages/timeline/TimelinePostCard.tsx
@@ -15,7 +15,7 @@ export default function TimelinePostCard({
   children,
 }: TimelinePostCardProps) {
   return (
-    <Card className={classNames("timeline-post-card", className)}>
+    <Card color="primary" className={classNames("timeline-post-card", className)}>
       {children}
     </Card>
   );
diff --git a/FrontEnd/src/pages/timeline/index.tsx b/FrontEnd/src/pages/timeline/index.tsx
index 1dffdcc1..51cc37f0 100644
--- a/FrontEnd/src/pages/timeline/index.tsx
+++ b/FrontEnd/src/pages/timeline/index.tsx
@@ -1,11 +1,10 @@
-import * as React from "react";
 import { useParams } from "react-router-dom";
 
 import { UiLogicError } from "@/common";
 
 import Timeline from "./Timeline";
 
-const TimelinePage: React.FC = () => {
+export default function TimelinePage() {
   const { owner, timeline: timelineNameParam } = useParams();
 
   if (owner == null || owner == "")
@@ -13,11 +12,5 @@ const TimelinePage: React.FC = () => {
 
   const timeline = timelineNameParam || "self";
 
-  return (
-    <div className="container">
-      <Timeline timelineOwner={owner} timelineName={timeline} />
-    </div>
-  );
+  return <Timeline timelineOwner={owner} timelineName={timeline} />;
 };
-
-export default TimelinePage;