damjan_savic/Portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: capture live server state before migration (2026-06-10)

Browse Source
This commit is contained in:
damjan_savic
2026-06-10 23:56:36 +02:00
parent 97bf6da106
commit b6ad1e0b2f
52 changed files with 704 additions and 691 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/portfolio/PortfolioCard.tsx
+18 -18
View File
@@ -30,11 +30,11 @@ const PortfolioCard = ({ project }: PortfolioCardProps) => {
return (
<Link
href={`/${locale}/portfolio/${project.slug}`}
className="group relative block bg-zinc-900/50 backdrop-blur-sm
className="group relative block bg-background/50 backdrop-blur-sm
rounded-xl shadow-lg hover:shadow-2xl
ring-1 ring-zinc-800 hover:ring-zinc-700
ring-1 ring-border hover:ring-accent
transition-all duration-500 focus:outline-none focus:ring-2
focus:ring-zinc-600 focus:ring-offset-2 focus:ring-offset-zinc-950
focus:ring-ring focus:ring-offset-2 focus:ring-offset-background
transform hover:-translate-y-1"
>
<motion.div
@@ -45,7 +45,7 @@ const PortfolioCard = ({ project }: PortfolioCardProps) => {
className="relative overflow-hidden rounded-xl"
>
{/* Image Container */}
<div className="aspect-[16/9] w-full relative overflow-hidden bg-zinc-900">
<div className="aspect-[16/9] w-full relative overflow-hidden bg-background">
<Image
src={`/images/projects/${project.slug}/cover.avif`}
alt={project.title}
@@ -56,9 +56,9 @@ const PortfolioCard = ({ project }: PortfolioCardProps) => {
</div>
{/* Content */}
<div className="relative -mt-2 p-6 bg-zinc-900 z-10">
<div className="relative -mt-2 p-6 bg-background z-10">
{/* Project Info */}
<div className="flex items-center gap-4 mb-4 text-zinc-500">
<div className="flex items-center gap-4 mb-4 text-muted-foreground">
{project.date && (
<div className="flex items-center gap-2 text-sm">
<Calendar className="h-4 w-4" />
@@ -74,12 +74,12 @@ const PortfolioCard = ({ project }: PortfolioCardProps) => {
</div>
{/* Title & Description */}
<h3 className="text-xl font-semibold text-white mb-3
group-hover:text-zinc-100 transition-colors duration-300">
<h3 className="text-xl font-semibold text-foreground mb-3
group-hover:text-foreground/90 transition-colors duration-300">
{project.title}
</h3>
<p className="text-zinc-400 text-sm line-clamp-2 mb-4
group-hover:text-zinc-300 transition-colors duration-300">
<p className="text-muted-foreground text-sm line-clamp-2 mb-4
group-hover:text-foreground/70 transition-colors duration-300">
{project.excerpt || project.description}
</p>
@@ -88,17 +88,17 @@ const PortfolioCard = ({ project }: PortfolioCardProps) => {
{displayTags.slice(0, 3).map((tag, index) => (
<span
key={index}
className="px-3 py-1 bg-zinc-800/50
text-sm text-zinc-400 rounded-full
ring-1 ring-zinc-700/50 group-hover:ring-zinc-600/50
group-hover:bg-zinc-800/70 group-hover:text-zinc-300
className="px-3 py-1 bg-card/50
text-sm text-muted-foreground rounded-full
ring-1 ring-border/50 group-hover:ring-accent/50
group-hover:bg-card/70 group-hover:text-foreground/80
transition-all duration-300"
>
{tag}
</span>
))}
{displayTags.length > 3 && (
<span className="text-sm text-zinc-600">
<span className="text-sm text-muted-foreground/60">
+{displayTags.length - 3} more
</span>
)}
@@ -106,17 +106,17 @@ const PortfolioCard = ({ project }: PortfolioCardProps) => {
{/* Link Icon */}
<div className="absolute top-6 right-6 p-2.5 rounded-full
bg-zinc-800/60 backdrop-blur-sm ring-1 ring-zinc-700/50
bg-card/60 backdrop-blur-sm ring-1 ring-border/50
opacity-0 group-hover:opacity-100
transform translate-y-2 group-hover:translate-y-0
transition-all duration-300">
<ExternalLink className="h-4 w-4 text-zinc-400" />
<ExternalLink className="h-4 w-4 text-muted-foreground" />
</div>
</div>
{/* Subtle Hover Border */}
<div className="absolute inset-0 rounded-xl pointer-events-none
ring-1 ring-zinc-600/0 group-hover:ring-zinc-600/30
ring-1 ring-ring/0 group-hover:ring-ring/30
transition-all duration-500" />
</motion.div>
</Link>