-
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #287 from Ajay-Dhangar/dev-1.1
Dev 1.1
- Loading branch information
Showing
59 changed files
with
580 additions
and
107 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import React from "react"; | ||
import { projects } from "../../../data"; | ||
import { ThreeDCardDemo } from "../../../ui/Card3D"; | ||
|
||
const Projects = () => { | ||
return ( | ||
<section id="projects" className="py-20"> | ||
<h1 className="heading text-4xl text-center lg:text-6xl mb-10"> | ||
A collection of{" "} | ||
<span className="text-primaryColor">recent projects</span> | ||
</h1> | ||
<div className="flex flex-wrap items-center justify-center gap-10"> | ||
{projects.map((item) => ( | ||
<div | ||
className="h-[35rem] md:h-[37rem] lg:min-h-[32.5rem] w-90" | ||
key={item.id} | ||
> | ||
<ThreeDCardDemo | ||
title={item.title} | ||
description={item.des} | ||
imgSource={item.img} | ||
icons={item.iconLists} | ||
link={item.link} | ||
/> | ||
</div> | ||
))} | ||
</div> | ||
</section> | ||
); | ||
}; | ||
|
||
export default Projects; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,86 @@ | ||
import React from "react"; | ||
import { CardBody, CardContainer, CardItem } from "./Card3DConfig"; | ||
import { FaLocationArrow } from "react-icons/fa6"; | ||
import Link from "@docusaurus/Link"; | ||
|
||
export const ThreeDCardDemo = ({ | ||
title, | ||
description, | ||
imgSource, | ||
icons, | ||
link, | ||
onClickHandler, | ||
otherClasses, | ||
}: { | ||
title?: string; | ||
description?: string; | ||
imgSource: string; | ||
icons: string[]; | ||
link: string; | ||
onClickHandler?: () => void; | ||
otherClasses?: string; | ||
}) => { | ||
return ( | ||
<CardContainer className="inter-var"> | ||
<CardBody | ||
className="bg-gray-50 relative group/card dark:hover:shadow-2xl cursor-pointer dark:hover:shadow-emerald-500/[0.1] dark:bg-[#1e293b] dark:border-white/[0.2] border-black/[0.1] | ||
grid grid-cols-1 grid-rows-1 rounded-xl shadow-lg hover:shadow-2xl transition-all duration-300 ease-in-out w-auto h-auto rounded-xl p-6 border-[1px] border-gray-200 dark:border-[#1e293b] dark:text-white" | ||
> | ||
<CardItem | ||
translateZ="50" | ||
className="text-xl font-bold text-neutral-600 dark:text-white" | ||
> | ||
{title} | ||
</CardItem> | ||
<CardItem | ||
as="p" | ||
translateZ="60" | ||
className="text-neutral-500 text-sm max-w-sm mt-2 dark:text-neutral-300" | ||
> | ||
{description} | ||
</CardItem> | ||
<CardItem translateZ="100" className="w-full mt-4 p-2"> | ||
<img | ||
src={imgSource} | ||
height="1000" | ||
width="1000" | ||
className="h-60 w-full object-cover rounded-xl group-hover/card:shadow-xl" | ||
alt="thumbnail" | ||
/> | ||
</CardItem> | ||
<div className="flex justify-between gap-2 items-center mt-10"> | ||
<CardItem | ||
translateZ={20} | ||
as="button" | ||
className=" py-2 rounded-xl text-sm font-normal dark:bg-[#1e293b] dark:text-black text-primaryColor bg-gray-100" | ||
> | ||
<div className="flex items-center"> | ||
{icons.map((icon, index) => ( | ||
<div | ||
key={index} | ||
className="border border-primaryColor/[.4] rounded-full bg-gray-700 lg:w-10 lg:h-10 w-8 h-8 flex justify-center items-center" | ||
style={{ | ||
transform: `translateX(-${5 * index + 2}px)`, | ||
}} | ||
> | ||
<img src={icon} alt="icon5" className="p-2" /> | ||
</div> | ||
))} | ||
</div> | ||
</CardItem> | ||
<CardItem | ||
translateZ={20} | ||
as="button" | ||
className="flex items-center gap-x-2 px-4 py-2 rounded-xl bg-gray dark:bg-[#1e293b] dark:text-black text-sm md:text-base font-bold" | ||
> | ||
<Link to={link} target="_blank"> | ||
Demo | ||
</Link> | ||
|
||
<FaLocationArrow /> | ||
</CardItem> | ||
</div> | ||
</CardBody> | ||
</CardContainer> | ||
); | ||
}; |
Oops, something went wrong.