- added project brand images

components/content/carousel/index.tsx

@@ -25,12 +25,11 @@ const ContentCarousel = ({
     return (
         <div className="flex flex-row justify-between">
             <div style={{width: '-webkit-fill-available'}} className={`p-4 ${portfolioData.prototypeIframeURL ? '' : 'px-10'} flex flex-col`}>
-                <div className=" w-fit pb-1 border-b-2 border-white">{portfolioData.title}</div>
-                {portfolioData.heroImgSrc && <div className="mb-8"><Image src={portfolioData.heroImgSrc} alt=""/></div>}
                 <div className="flex flex-row self-auto justify-between">
                     {(currentPageIdx > 0) && <span className="cursor-pointer" onClick={() => setCurrentPageIdx(currentPageIdx - 1)}><FontAwesomeIcon width={50} height={50} icon={faChevronCircleLeft} className="fas fa-chevron-circle-left" style={{ color: "white" }} /></span>}
                     {(currentPageIdx < pageLength - 1) && <span className="cursor-pointer" onClick={() => setCurrentPageIdx(currentPageIdx + 1)}><FontAwesomeIcon width={25} height={50} icon={faChevronCircleRight} className="fas fa-chevron-circle-right" style={{ color: "white" }} /></span>}
                 </div>
+                <div className=" w-fit self-center pb-1 border-b-2 border-white">{portfolioData.title}</div>
                 <div>{portfolioData.description}</div>
                 {portfolioData.prototypeIframeURL && <div style={{height: 100, minHeight: '100%'}} className="my-4 flex flex-row justify-center">
                     {/* {<embed
@@ -42,13 +41,13 @@ const ContentCarousel = ({
                             height: '1px'
                         }}
                     />} */}
-                    <Link className="w-full h-full bg-blue-500 align-middle text-white flex flex-row justify-center" href={portfolioData.prototypeIframeURL} target="#">
+                    {portfolioData.heroImgSrc && <Link className="w-full h-full align-middle flex flex-row justify-center" href={portfolioData.prototypeIframeURL} target="#">
                         <div className="flex flex-col justify-center">
                             <span>
-                                {portfolioData.title}
+                                <div className="mb-8 w-full flex-row flex justify-center bg-white"><Image height={150} width={150} src={portfolioData.heroImgSrc} alt=""/></div>
                             </span>
                         </div>
-                    </Link>
+                    </Link>}
                 </div>}
             </div>
         </div>

lib/portfolio.ts

@@ -1,7 +1,10 @@
+import gethip from '@/public/gethip-image.png';
+import aqua from '@/public/aqua_intelligence_image.png';
+import vendoo from '@/public/vendoo-image.png';
 const portfolioValues = [
     {
         title: 'Vendoo',
-        heroImgSrc: '',
+        heroImgSrc: vendoo,
         description: '',
         prototypeIframeURL: 'https://www.kroleo.com/invision/Vendoo/#/screens'
     },
@@ -13,13 +16,13 @@ const portfolioValues = [
     // },
     {
         title: 'Aqua',
-        heroImgSrc: '',
+        heroImgSrc: aqua,
         description: '',
         prototypeIframeURL: 'https://projects.invisionapp.com/share/QV9OA25MA#/screens'
     },
     {
         title: 'GetHip',
-        heroImgSrc: '',
+        heroImgSrc: gethip,
         description: '',
         prototypeIframeURL: 'https://www.kroleo.com/invision/GetHip/#/screens'
     },