Reduce excessive layout animations

yoshikouki · Oct 2, 2024 · b53fc98 · b53fc98
1 parent fd68be7
commit b53fc98
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 4 deletions.
diff --git a/src/app/activity-item-animation.tsx b/src/app/activity-item-animation.tsx
@@ -20,16 +20,15 @@ export const ActivityItemAnimation = ({
         border: "1px solid transparent",
       }}
       whileInView={{
-        marginBottom: "1.25rem",
         marginLeft: "0.5rem",
         marginRight: "0.5rem",
 
         paddingLeft: "1rem",
         paddingRight: "1rem",
 
-        backgroundColor: "#111111",
+        backgroundColor: "var(--card)",
         borderRadius: "0.5rem",
-        border: "0.5px solid #112121",
+        border: "0.5px solid hsl(var(--border))",
       }}
       transition={{
         duration: 0.3,

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -11,7 +11,7 @@ export default async function HomePage() {
       <AppHeader />
       <AppNav />
       <main className="flex flex-col items-center justify-center gap-10 py-20">
-        <div className="flex flex-col">
+        <div className="flex flex-col gap-4">
           {activities.map((activity) => (
             <ActivityItem key={activity.id} activity={activity} />
           ))}