Merge pull request #80 from AparAgarwal/main

style: minor UI fixes

Author: Alexandrbig1

src/components/Products/ProductCard.jsx

@@ -230,7 +230,7 @@ const ProductCard = forwardRef(({ product }, ref) => {
             onClick={(e) => handleActionClick(e, handleWishlistToggle)}
             className={`
               flex items-center justify-center px-4 py-3 rounded-l-xl border-2 transition-colors duration-150 hover:shadow-lg cursor-pointer focus:outline-none
-              ${isWishlisted ? 'bg-[#023e8a] border-[#023e8a] text-white hover:bg-[#1054ab]' : 'bg-white border-[#023e8a] text-[#023e8a] hover:text-[#1054ab]'}
+              ${isWishlisted ? 'bg-[#023e8a] border-[#023e8a] text-white hover:bg-[#1054ab] hover:border-[#1054ab]' : 'bg-white border-[#023e8a] text-[#023e8a] hover:text-[#1054ab] hover:border-[#1054ab]'}
             `}
             aria-label={isWishlisted ? 'Remove from wishlist' : 'Add to wishlist'}
             aria-pressed={isWishlisted}

src/components/RecentlyViewed.jsx

@@ -42,10 +42,10 @@ export default function RecentlyViewed() {
   const visibleItems = items.slice(currentIndex, currentIndex + itemsPerPage);
 
   return (
-    <section className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+    <section className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
       {/* Header section with title and navigation arrows */}
       <div className="flex items-center justify-between mb-8">
-        <h2 className="text-5xl lg:text-heading-xxl font-montserrat leading-none uppercase text-center tracking-tight py-10 text-stroke-black">
+        <h2 className="text-5xl lg:text-heading-xxl font-montserrat text-black leading-none uppercase text-center tracking-tight py-10 text-stroke-black">
           RECENTLY
           <span className="ml-5 text-[#f7faff]">VIEWED</span>
         </h2>

src/pages/Products/Products.jsx

@@ -55,7 +55,7 @@ export default function Products() {
       <main className="min-h-screen" style={{ backgroundColor: '#F7FAFF' }}>
         {/* Banner Section */}
         <section className="bg-gradient-to-br from-blue-900 via-blue-800 to-purple-900 text-white py-20">
-          <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
             <div className="text-center">
               <h1 className="text-5xl md:text-6xl font-bold mb-6 font-montserrat bg-gradient-to-r from-white to-blue-100 bg-clip-text text-transparent">
                 All Products
@@ -69,7 +69,7 @@ export default function Products() {
         </section>
 
         {/* Toolbar Section */}
-        <section className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+        <section className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
           <div className="flex justify-between items-center">
             {/* Left: All Filters button (non-functional) */}
             <button className="flex items-center gap-2 bg-transparent text-gray-700 px-6 py-3 rounded-lg font-medium border border-gray-300 hover:border-blue-500 hover:text-blue-600 hover:bg-blue-50 transition-all duration-300">
@@ -93,7 +93,7 @@ export default function Products() {
         </section>
 
         {/* Product Grid Section */}
-        <section className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-12">
+        <section className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pb-12">
           <div key={productListKey} className="flex flex-col gap-8">
             <div className="w-full">
               {error && (