joshpatra/my-portfolio
1
0
Fork 0
mirror of https://github.com/SoPat712/my-portfolio.git synced 2025-08-21 10:18:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

2 by rows and hover/classes fix

Browse Source
This commit is contained in:
Josh Patra
2025-08-17 16:12:33 -04:00
parent c9e3fed588
commit 4c17b19c8e
1 changed files with 23 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/routes/+page.svelte
View File

@@ -159,11 +159,16 @@
graduation: "Expected May 2026", graduation: "Expected May 2026",
gpa: "3.7/4.0", gpa: "3.7/4.0",
courses: [ courses: [
{ code: "01:198:419", name: "Computer Security", status: "In Progress" }, {
code: "01:198:428",
name: "Intro to Computer Graphics",
status: "In Progress",
},
{ code: "01:198:419", name: "Computer Security", status: "Complete" },
{ {
code: "01:198:344", code: "01:198:344",
name: "Design & Analysis of Algorithms", name: "Design & Analysis of Algorithms",
status: "In Progress", status: "Completed",
}, },
{ code: "01:198:214", name: "Systems Programming", status: "Completed" }, { code: "01:198:214", name: "Systems Programming", status: "Completed" },
{ code: "01:198:352", name: "Internet Technology", status: "Completed" }, { code: "01:198:352", name: "Internet Technology", status: "Completed" },
@@ -576,20 +581,20 @@
<!-- Projects Section --> <!-- Projects Section -->
<section id="projects" class="py-16 border-b border-gray-800 scroll-mt-16"> <section id="projects" class="py-16 border-b border-gray-800 scroll-mt-16">
<h2 class="text-3xl font-bold mb-8 text-green-400">❯ Projects</h2> <h2 class="text-3xl font-bold mb-8 text-green-400">❯ Projects</h2>
<div class="space-y-16"> <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
{#each projects as project} {#each projects as project}
<div <div
class="bg-gray-900 rounded-lg overflow-hidden border border-gray-700 hover:border-green-500 transition duration-300" class="project-card bg-gray-900 rounded-lg overflow-hidden border border-gray-700 transition-all duration-300"
> >
<div class="flex flex-col md:flex-row md:h-[410px]"> <div class="h-full flex flex-col">
<div class="md:w-2/5 h-64 md:h-full"> <div class="h-48">
<img <img
src={project.image} src={project.image}
alt={project.name} alt={project.name}
class="w-full h-full object-cover" class="w-full h-full object-cover"
/> />
</div> </div>
<div class="md:w-3/5 p-6 flex flex-col justify-center"> <div class="p-6 flex flex-col flex-grow">
<h3 class="text-2xl font-semibold mb-2"> <h3 class="text-2xl font-semibold mb-2">
<a <a
href={project.link} href={project.link}
@@ -599,7 +604,9 @@
{project.name} {project.name}
</a> </a>
</h3> </h3>
<p class="text-gray-400 mb-4">{project.description}</p> <p class="text-gray-400 mb-4 flex-grow">
{project.description}
</p>
<div class="mb-4"> <div class="mb-4">
<h4 class="text-green-400 mb-2">Tech Stack:</h4> <h4 class="text-green-400 mb-2">Tech Stack:</h4>
<div class="flex flex-wrap gap-2"> <div class="flex flex-wrap gap-2">
@@ -939,4 +946,12 @@
opacity: 0; opacity: 0;
} }
} }
.project-card:hover {
transform: translateY(-10px) scale(1.03);
box-shadow:
0 0 15px rgba(52, 211, 153, 0.3),
0 0 30px rgba(52, 211, 153, 0.2);
border-color: rgba(52, 211, 153, 0.5);
}
</style> </style>