harivansh-afk/React-Portfolio
1
0
Fork 0
mirror of https://github.com/harivansh-afk/React-Portfolio.git synced 2026-04-20 15:01:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: imrpovements and added solvex

Browse source
This commit is contained in:
Harivansh Rathi 2025-01-05 17:19:14 +05:30
parent 65a9478880
commit ca323a77d1
3 changed files with 51 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
public/images/project5.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 530 KiB

5
src/content_option.js
View file

@ -126,6 +126,11 @@ const services = [{
]; ];
const dataportfolio = [{ const dataportfolio = [{
img: "/images/project5.jpg",
description: "Founded SolveX, a gamified algorithm practice platform featuring real-time battles, AI-powered problem generation, and competitive matchmaking",
link: "https://solvex-pi.vercel.app/",
},
{
img: "/images/project1.jpg", img: "/images/project1.jpg",
description: "Built a React/TypeScript RAG AI chat application with n8n, achieving 95% query response accuracy", description: "Built a React/TypeScript RAG AI chat application with n8n, achieving 95% query response accuracy",
link: "https://rag-ui-six.vercel.app/", link: "https://rag-ui-six.vercel.app/",

68
src/pages/portfolio/style.css
View file

@ -43,12 +43,15 @@
align-items: flex-start; align-items: flex-start;
background: linear-gradient( background: linear-gradient(
to top, to top,
rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.8) 0%,
rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0.4) 50%,
rgba(0, 0, 0, 0) 100% rgba(8, 8, 8, 0.2) 100%
); );
opacity: 0; opacity: 0;
transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
border-top: 1px solid rgba(255, 255, 255, 0.1);
} }
.project_item:hover .content { .project_item:hover .content {
@ -61,32 +64,39 @@
font-weight: 600; font-weight: 600;
margin-bottom: 0.8rem; margin-bottom: 0.8rem;
text-align: left; text-align: left;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
} }
.project_item .content p { .project_item .content p {
color: rgba(255, 255, 255, 0.9); color: rgba(255, 255, 255, 0.95);
font-size: 0.95rem; font-size: 0.95rem;
line-height: 1.5; line-height: 1.5;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
text-align: left; text-align: left;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
} }
.project_item .content a { .project_item .content a {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
padding: 0.8rem 1.5rem; padding: 0.8rem 1.5rem;
background: var(--primary-color); background: rgba(255, 161, 22, 0.9);
border-radius: 8px; border-radius: 8px;
font-weight: 500; font-weight: 500;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 0.5rem; gap: 0.5rem;
transition: all 0.2s ease; transition: all 0.2s ease;
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
border: 1px solid rgba(255, 255, 255, 0.1);
} }
.project_item .content a:hover { .project_item .content a:hover {
background: var(--secondary-color); background: rgba(255, 161, 22, 1);
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
} }
/* Mobile Styles */ /* Mobile Styles */
@ -97,32 +107,46 @@
} }
.project_item { .project_item {
aspect-ratio: 3/2; aspect-ratio: 16/12;
border-radius: 12px;
} }
.project_item .content { .project_item .content {
opacity: 1; opacity: 1;
padding: 1.5rem; padding: 1.25rem;
background: linear-gradient( background: linear-gradient(
to top, to top,
rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.75) 0%,
rgba(0, 0, 0, 0.8) 40%, rgba(0, 0, 0, 0.4) 50%,
rgba(0, 0, 0, 0.4) 100% rgba(8, 8, 8, 0.2) 100%
); );
} justify-content: flex-end;
gap: 0.75rem;
.project_item .content h3 { backdrop-filter: blur(10px);
font-size: 1.1rem; -webkit-backdrop-filter: blur(10px);
margin-bottom: 0.6rem; border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.project_item .content p {
font-size: 0.9rem;
margin-bottom: 1rem;
} }
.project_item .content a { .project_item .content a {
padding: 0.6rem 1.2rem; padding: 0.75rem 1.25rem;
font-size: 0.9rem; font-size: 0.9rem;
border-radius: 6px;
background: rgba(255, 161, 22, 0.9);
width: 100%;
text-align: center;
justify-content: center;
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
border: 1px solid rgba(255, 255, 255, 0.1);
}
.project_item:active {
transform: scale(0.98);
transition: transform 0.2s ease;
}
.project_item img {
filter: brightness(0.9);
} }
} }