Embed activity SVG section

This commit is contained in:
Space-Banane
2026-05-29 19:55:29 +02:00
parent df462c07e5
commit 6cb077afe4
2 changed files with 40 additions and 0 deletions

View File

@@ -4,6 +4,7 @@ import { useProfile } from "../context/ProfileContext";
import { Hero } from "../sections/Hero"; import { Hero } from "../sections/Hero";
import { WorkExperience } from "../sections/WorkExperience"; import { WorkExperience } from "../sections/WorkExperience";
import { Uptime } from "../sections/Uptime"; import { Uptime } from "../sections/Uptime";
import { Activity } from "../sections/Activity";
import { Affiliates } from "../sections/Affiliates"; import { Affiliates } from "../sections/Affiliates";
import { ProjectCard } from "../components/ProjectCard"; import { ProjectCard } from "../components/ProjectCard";
import { MiniProjectCard } from "../components/MiniProjectCard"; import { MiniProjectCard } from "../components/MiniProjectCard";
@@ -71,6 +72,8 @@ export default function Home() {
<Uptime /> <Uptime />
<Activity />
<Affiliates /> <Affiliates />
<TechStack /> <TechStack />

37
src/sections/Activity.tsx Normal file
View File

@@ -0,0 +1,37 @@
"use client";
const activitySvg =
"https://gitact.spaceistyping.com/activity.svg?days=365&source=all&theme=dark";
export function Activity() {
return (
<section className="w-full max-w-6xl mx-auto space-y-8 px-4">
<div className="text-center space-y-4">
<h2 className="text-3xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-blue-400 to-purple-500">
Activity
</h2>
<p className="text-gray-400 max-w-2xl mx-auto">
A live snapshot of my recent Git activity.
</p>
</div>
<div className="max-w-5xl mx-auto rounded-3xl border border-white/10 bg-white/5 backdrop-blur-sm p-4 md:p-6 shadow-[0_20px_80px_rgba(0,0,0,0.35)]">
<a
href={activitySvg}
target="_blank"
rel="noreferrer"
className="block overflow-hidden rounded-2xl border border-white/10 bg-[#0a0a12] transition-transform duration-300 hover:scale-[1.01] hover:border-blue-400/40"
aria-label="Open Git activity SVG in a new tab"
>
<img
src={activitySvg}
alt="Git activity graph"
className="block h-auto w-full object-contain"
loading="lazy"
referrerPolicy="no-referrer"
/>
</a>
</div>
</section>
);
}