gitadmin/moviebox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update global styles and refactor MovieList component: change text color in globals.css, enhance MovieList filtering logic with numeric props, and improve MovieCard layout for better UI consistency.

Browse Source
This commit is contained in:
Norbert Maciaszek
2025-08-13 17:13:20 +02:00
parent 83e931c27f
commit 5a50387685
7 changed files with 55 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/app/(withGlobalData)/page.tsx
View File

@@ -3,10 +3,15 @@ import { MovieList } from "@/components/molecules/MovieList";
export default async function Home() {
return (
<>
<MovieList heading="Upcoming" filterUpcoming sortDirection="desc" />
<MovieList heading="My Watchlist" filterReleased />
<MovieList heading="Seen" filterSeen />
<MovieList heading="Favorites" filterFavorites />
<MovieList heading="Upcoming" filterUpcoming={1} sortDirection="desc" />
<MovieList
heading="My Watchlist"
filterReleased={1}
filterSeen={0}
filterFavorites={0}
/>
<MovieList heading="Seen" filterSeen={1} />
<MovieList heading="Favorites" filterFavorites={1} />
</>
);
}

50
src/app/globals.css
View File

@@ -3,7 +3,7 @@
@custom-variant dark (&:is(.dark *));
@theme {
--color-text: #1d1d1d;
--color-text: #fafafa;
--color-primary-50: #eefaff;
--color-primary-100: #dcf5ff;
@@ -17,41 +17,17 @@
--color-primary-900: #00547a;
--color-primary-950: #003049;
--color-secondary-50: #ffeeee;
--color-secondary-100: #ffdada;
--color-secondary-200: #ffbbbb;
--color-secondary-300: #ff8b8b;
--color-secondary-400: #ff4949;
--color-secondary-500: #ff1111;
--color-secondary-600: #ff0000;
--color-secondary-700: #e70000;
--color-secondary: #be0000;
--color-secondary-900: #780000;
--color-secondary-950: #560000;
--color-monza-50: #fff1f2;
--color-monza-100: #ffe0e2;
--color-monza-200: #ffc7cb;
--color-monza-300: #ffa0a7;
--color-monza-400: #ff6974;
--color-monza-500: #fa3947;
--color-monza-600: #e71b2a;
--color-monza-700: #c1121f;
--color-monza-800: #a1131e;
--color-monza-900: #85171f;
--color-monza-950: #49060b;
--color-pink-lady-50: #fef9ee;
--color-pink-lady-100: #fdf0d5;
--color-pink-lady-200: #fadfae;
--color-pink-lady-300: #f7c77a;
--color-pink-lady-400: #f2a545;
--color-pink-lady-500: #ef8a20;
--color-pink-lady-600: #e07016;
--color-pink-lady-700: #ba5514;
--color-pink-lady-800: #944418;
--color-pink-lady-900: #773917;
--color-pink-lady-950: #401c0a;
--color-secondary-50: #fef9ee;
--color-secondary-100: #fdf0d5;
--color-secondary-200: #fadfae;
--color-secondary-300: #f7c77a;
--color-secondary-400: #f2a545;
--color-secondary-500: #ef8a20;
--color-secondary: #e07016;
--color-secondary-700: #ba5514;
--color-secondary-800: #944418;
--color-secondary-900: #773917;
--color-secondary-950: #401c0a;
--color-hippie-blue-50: #f4f7fb;
--color-hippie-blue-100: #e9eff5;
@@ -72,7 +48,7 @@
@layer base {
body {
@apply bg-pink-lady-50 text-text;
@apply bg-hippie-blue-950 text-text;
}
.container {