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.

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

View File

@@ -41,14 +41,14 @@ export const Search = () => {
return (
<>
<button
className="text-text hover:text-primary-900 cursor-pointer"
className="text-text hover:text-secondary cursor-pointer transition-colors"
onClick={() => setIsSearchOpen(!isSearchOpen)}
>
<IoSearch size={25} fill="currentColor" />
</button>
{isSearchOpen && (
<div className="fixed inset-0 bg-black/50 z-20 backdrop-blur-sm overflow-y-auto flex items-center">
<div className="fixed inset-0 bg-black/50 z-20 backdrop-blur-sm overflow-y-auto flex py-20">
<button
className="absolute top-4 right-4 text-white cursor-pointer"
onClick={handleClose}
@@ -66,7 +66,7 @@ export const Search = () => {
/>
</div>
{results && (
<div className="col-span-full">
<div className="col-span-full mt-2 lg:mt-10 text-center ">
<p className="text-white">{total_results} movies found</p>
</div>
)}

View File

@@ -14,7 +14,7 @@ const links = [
export const Navbar = () => {
return (
<header className="bg-white shadow-sm max-sm:sticky top-0 w-full z-30">
<header className="bg-hippie-blue-700 shadow-sm max-sm:sticky top-0 w-full z-30">
<div className="container">
<div className="flex items-center gap-8 py-4">
<Link className="block text-teal-600" href="/">
@@ -42,7 +42,7 @@ export const Navbar = () => {
<div className="flex gap-4 sm:gap-6">
<Search />
<a
className="block rounded-md bg-primary px-5 py-2.5 text-sm font-medium text-white transition hover:bg-primary-900"
className="block border-b-2 border-secondary-700 px-5 py-2.5 text-sm font-medium text-white transition hover:bg-secondary-700"
href="#"
>
Random Movie