src/components/MarketPlace/MainSection.jsx

@@ -41,6 +41,18 @@ export default function MainSection({
   return (
     <div className={`market-place-section w-full ${className || ""}`}>
       <div className="market-place-wrapper w-full">
+        {/* contentDisplay toggler */}
+        <div className="w-full flex items-center justify-end">
+          <div className="p-2 w-[35px] h-[35px] bg-white dark:bg-slate-200 rounded-lg">
+              <img 
+                title={contentDisplay=='grid'? 'list view' : 'grid view'}
+                onClick={()=>setContentDisplay((prev)=>prev=='grid'? 'list' : 'grid')}
+                src={contentDisplay=='grid'? ListView : GridView}
+                className="w-full h-full cursor-pointer" alt="view" 
+              />
+          </div>
+        </div>
+        {/* end of contentDisplay toggler */}
         <div className="filter-navigate-area lg:flex justify-between mb-8 items-center">
           <div className="tab-item lg:mb-0 mb-5">
             <div className="md:flex md:space-x-8 space-x-2">
@@ -60,16 +72,14 @@ export default function MainSection({
             </div>
           </div>
           {/* contentDisplay toggler */}
-          <div className="p-2 w-[35px] h-[35px] bg-white dark:bg-slate-200 rounded-lg">
-            {/* <div className="p-1 h-full border flex justify-between items-center"> */}
+          {/* <div className="p-2 w-[35px] h-[35px] bg-white dark:bg-slate-200 rounded-lg">
               <img 
                 title={contentDisplay=='grid'? 'list view' : 'grid view'}
                 onClick={()=>setContentDisplay((prev)=>prev=='grid'? 'list' : 'grid')}
                 src={contentDisplay=='grid'? ListView : GridView}
                 className="w-full h-full cursor-pointer" alt="view" 
               />
-            {/* </div> */}
-          </div>
+          </div> */}
           {/* end of contentDisplay toggler */}
         </div>
         <div className="filter-navigate-content w-full min-h-screen">