sortedcord/mi-sitio-personal
1
1
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

data: Updated placeholders

Browse Source
This commit is contained in:
Aditya Gupta
2026-02-22 17:16:00 +05:30
parent 02fd803370
commit a275fcc2f4
9 changed files with 143 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/img/operator.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 471 KiB

20
src/App.tsx
View File

@@ -3,6 +3,7 @@ import './App.css';
import { THEMES } from './themes';
import { CatEasterEgg } from './components/CatEasterEgg';
import { FooterSection } from './components/FooterSection';
import { EducationSection } from './components/EducationSection';
import { HeroSection } from './components/HeroSection';
import { LabNotesSection } from './components/LabNotesSection';
import { NavigationBar } from './components/NavigationBar';
@@ -63,14 +64,13 @@ export default function App() {
}, [showThemePillTooltip]);
return (
<div className="min-h-screen bg-[var(--bg-base)] text-[var(--text-main)] font-mono selection:bg-[var(--color-accent)] selection:text-[var(--bg-base)] relative overflow-x-hidden">
<div className="min-h-screen bg-(--bg-base) text-(--text-main) font-mono selection:bg-(--color-accent) selection:text-[var(--bg-base)] relative overflow-x-hidden">
{/* SVG Noise Filter for rough paper texture */}
<svg className="hidden">
{/* <svg className="hidden">
<filter id="noiseFilter">
<feTurbulence type="fractalNoise" baseFrequency="0.7" numOctaves="3" stitchTiles="stitch" />
</filter>
</svg>
</svg> */}
<div className="fixed inset-0 z-0 pointer-events-none opacity-[0.04]" style={{ filter: 'url(#noiseFilter)' }} />
{/* Blueprint Dot Grid Background */}
@@ -84,13 +84,9 @@ export default function App() {
}}
/>
{/* Hidden Cat Easter Egg */}
<CatEasterEgg />
<div className="relative z-10 max-w-5xl mx-auto px-6 py-12 flex flex-col gap-16">
<NavigationBar />
<HeroSection
activeThemeName={activeTheme.name}
hasClickedThemePill={hasClickedThemePill}
@@ -100,19 +96,13 @@ export default function App() {
setShowThemePillTooltip(true);
}}
/>
<SystemOverviewSection />
<EducationSection />
<div className="grid grid-cols-1 md:grid-cols-3 gap-12 mt-8">
<ProjectsSection />
<LabNotesSection />
</div>
<FooterSection />
</div>
</div>
);

44
src/components/EducationSection.tsx Normal file
View File

@@ -0,0 +1,44 @@
import { GraduationCap } from 'lucide-react';
import { EDUCATION } from '../data/education';
export function EducationSection() {
return (
<section className="space-y-6">
<div className="flex items-center justify-between border-b-2 border-dashed border-(--border-main) pb-2">
<h2 className="font-sketch text-2xl text-(--text-main) flex items-center gap-2">
<GraduationCap className="w-5 h-5 accent-text" /> education.log
</h2>
<span className="font-sketch text-(--text-dim) text-sm">Oh, the Places You'll Go!
</span>
</div>
<div className="flex flex-col gap-4">
{EDUCATION.map((item) => (
<article
key={item.program}
className="sketch-border-subtle bg-(--bg-surface) p-5 flex flex-col gap-3"
>
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2">
<div>
<h3 className="text-(--text-main) font-bold text-lg font-mono">
{item.program}
</h3>
<div className="text-(--text-muted) font-sketch text-sm">
{item.institution}
</div>
</div>
<div className="text-(--text-dim) font-mono text-xs">
{item.period}
</div>
</div>
<ul className="list-disc list-inside text-(--text-muted) text-sm font-mono space-y-1">
{item.highlights.map((point) => (
<li key={point}>{point}</li>
))}
</ul>
</article>
))}
</div>
</section>
);
}

39
src/components/HeroSection.tsx
View File

@@ -1,4 +1,4 @@
import { Activity, User } from 'lucide-react';
import { Activity } from 'lucide-react';
type HeroSectionProps = {
activeThemeName: string;
@@ -36,14 +36,14 @@ export function HeroSection({
</div>
)}
</div>
<h1 className="text-4xl sm:text-5xl font-bold tracking-tight text-[var(--text-main)] leading-tight">
I engineer <span className="accent-text relative inline-block">
infrastructure
<h1 className="text-3xl sm:text-5xl font-bold tracking-tight text-[var(--text-main)] leading-tight">
I overdesign <span className="accent-text relative inline-block">
controllable systems
<svg className="absolute w-full h-3 -bottom-1 left-0 accent-text" viewBox="0 0 100 20" preserveAspectRatio="none" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round"><path d="M2,15 Q50,-5 98,15" /></svg>
</span>,<br /> reverse-engineer black boxes,<br /> and build tools.
</span>,<br /> deconstruct black boxes, and build tools.
</h1>
<p className="text-lg text-[var(--text-muted)] leading-relaxed max-w-xl font-mono text-sm">
Based in New Delhi. Exploring homelab orchestration, low-level input devices, and dynamic theming engines. This is my public scratchpad and systems notebook.
<p className="text-md text-(--text-muted) leading-relaxed max-w-xl font-mono">
Systems engineer in the making. From window managers and game engines to self-hosted infrastructure.
</p>
</div>
@@ -51,10 +51,27 @@ export function HeroSection({
<div className="absolute -top-3 -right-4 w-12 h-6 bg-[var(--color-accent-muted)] transform rotate-45 opacity-60 backdrop-blur-sm sketch-border-subtle border-none" />
<div className="absolute -bottom-3 -left-4 w-12 h-6 bg-[var(--color-accent-muted)] transform rotate-45 opacity-60 backdrop-blur-sm sketch-border-subtle border-none" />
<div className="absolute inset-2 border-2 border-dashed border-[var(--border-main)] flex flex-col items-center justify-center text-[var(--text-dim)] group-hover:text-[var(--color-accent)] transition-colors duration-300 group-hover:bg-[var(--color-accent-muted)]/5">
<User className="w-12 h-12 mb-3 opacity-50" />
<span className="font-sketch text-sm">avatar.jpg</span>
<span className="font-mono text-[10px] opacity-40 mt-1">[1024x1024]</span>
<div className="absolute inset-2 border-2 border-dashed border-[var(--border-main)] overflow-hidden">
<img
src="/img/operator.jpg"
alt="Operator portrait"
className="h-full w-full object-cover filter grayscale contrast-125 brightness-90"
loading="lazy"
/>
<div
className="absolute inset-0 opacity-70"
style={{
background: 'linear-gradient(135deg, transparent 10%, var(--color-accent) 100%)',
mixBlendMode: 'multiply',
}}
/>
<div
className="absolute inset-0 opacity-55"
style={{
background: 'var(--color-accent)',
mixBlendMode: 'color',
}}
/>
</div>
<div className="absolute -bottom-8 -left-12 font-sketch text-xs accent-text -rotate-[15deg] hidden md:flex items-center gap-2 opacity-80">

29
src/components/InteractiveSystemOverview.tsx
View File

@@ -6,21 +6,24 @@ const CONTENT_MODULES = [
title: '/home/aditya/bio.txt',
tty: 'tty1',
content: (
<div className="font-mono text-sm sm:text-base text-[var(--text-muted)] leading-relaxed flex-1 space-y-4">
<div className="font-mono text-sm sm:text-base text-(--text-muted) leading-relaxed flex-1 space-y-4">
<div>
<span className="accent-text font-sketch text-xl mr-2">{'>'}</span>
<span className="text-[var(--text-main)]">whoami</span>
<p className="mt-2 ml-4 border-l-2 border-[var(--border-main)] pl-4 text-[var(--text-main)]">
Aditya Gupta. 20. Based in New Delhi. <br />
I don't just write code; I build and dismantle systems.
<span className="text-(--text-main)">whoami</span>
<p className="mt-2 ml-4 border-l-2 border-(--border-main) pl-4 text-(--text-main)">
Aditya Gupta. 20. New Delhi.<br />
Chess climbs, rhythm games, an unhealthy attachment to good audio.
<br />
I take things apart software, hardware, workflows.<br />
Curious enough to wire it back together.
</p>
</div>
<div>
<span className="accent-text font-sketch text-xl mr-2">{'>'}</span>
<span className="text-[var(--text-main)]">cat mindset.md</span>
<div className="mt-2 ml-4 space-y-2 border-l-2 border-[var(--border-main)] pl-4">
<span className="text-(--text-main)">cat mindset.md</span>
<div className="mt-2 ml-4 space-y-2 border-l-2 border-(--border-main) pl-4">
<p>Treat the environment as a continuous experiment.</p>
<p className="text-xs text-[var(--text-dim)] mt-2">Split this pane to view technical stack.</p>
<p className="text-xs text-(--text-dim) mt-2">Split this pane to view technical stack.</p>
</div>
</div>
</div>
@@ -31,15 +34,15 @@ const CONTENT_MODULES = [
title: 'ls /usr/bin/skills',
tty: 'tty2',
content: (
<div className="font-mono text-xs text-[var(--text-main)] flex-1 content-start">
<div className="font-mono text-xs text-(--text-main) flex-1 content-start">
<div className="flex flex-wrap gap-2 mt-1">
{['Rust', 'Go', 'C/C++', 'eBPF', 'Kubernetes', 'TrueNAS', 'Linux/KWin', 'React'].map((skill) => (
<span key={skill} className="px-2 py-1 bg-[var(--bg-surface)] border border-[var(--border-main)] rounded-sm hover:border-[var(--color-accent)] hover:text-[var(--color-accent)] transition-colors cursor-default">
<span key={skill} className="px-2 py-1 bg-(--bg-surface) border border-(--border-main) rounded-sm hover:border-(--color-accent) hover:text-[var(--color-accent)] transition-colors cursor-default">
{skill}
</span>
))}
</div>
<p className="mt-4 text-[10px] text-[var(--text-dim)] animate-pulse border-t border-dashed border-[var(--border-main)] pt-2">Split for infrastructure status...</p>
<p className="mt-4 text-[10px] text-(--text-dim) animate-pulse border-t border-dashed border-(--border-main) pt-2">Split for infrastructure status...</p>
</div>
)
},
@@ -48,10 +51,10 @@ const CONTENT_MODULES = [
title: 'kubectl get nodes',
tty: 'tty3',
content: (
<div className="font-mono text-[10px] sm:text-xs text-[var(--text-muted)] flex-1 overflow-x-auto">
<div className="font-mono text-[10px] sm:text-xs text-(--text-muted) flex-1 overflow-x-auto">
<table className="w-full text-left border-collapse">
<thead>
<tr className="text-[var(--text-dim)] border-b border-[var(--border-main)]">
<tr className="text-(--text-dim) border-b border-(--border-main)">
<th className="pb-1 font-normal">NAME</th>
<th className="pb-1 font-normal">STATUS</th>
<th className="pb-1 font-normal">ROLES</th>

18
src/components/LabNotesSection.tsx
View File

@@ -4,10 +4,10 @@ import { LAB_NOTES } from '../data/contentData';
export function LabNotesSection() {
return (
<section className="space-y-6">
<h2 className="font-sketch text-2xl text-[var(--text-main)] border-b-2 border-dashed border-[var(--border-main)] pb-2 flex items-center gap-2">
<h2 className="font-sketch text-2xl text-(--text-main) border-b-2 border-dashed border-(--border-main) pb-2 flex items-center gap-2">
<ChevronRight className="w-5 h-5 accent-text" /> lab_notes.txt
</h2>
<div className="flex flex-col gap-4 border-l-2 border-dashed border-[var(--border-main)] ml-2 relative">
<div className="flex flex-col gap-4 border-l-2 border-dashed border-(--border-main) ml-2 relative">
<div className="absolute -left-10 top-0 font-sketch text-xs accent-text -rotate-12 hidden sm:block">
recent
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="ml-2 transform rotate-90"><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg>
@@ -15,22 +15,22 @@ export function LabNotesSection() {
{LAB_NOTES.map((note, i) => (
<div key={i} className="relative pl-6 py-2 group cursor-pointer">
<div className="absolute left-[-9px] top-[14px] w-[16px] h-[16px] flex items-center justify-center bg-[var(--bg-base)] group-hover:scale-125 transition-transform">
<span className="text-[var(--text-dim)] group-hover:text-[var(--color-accent)] font-sketch text-lg leading-none transform -rotate-12">x</span>
<div className="absolute -left-2.25 top-3.5 w-4 h-4 flex items-center justify-center bg-(--bg-base) group-hover:scale-125 transition-transform">
<span className="text-(--text-dim) group-hover:text-(--color-accent) font-sketch text-lg leading-none transform -rotate-12">x</span>
</div>
<div className="font-mono text-[10px] text-[var(--text-dim)] mb-1">{note.date}</div>
<h3 className="text-sm font-mono text-[var(--text-muted)] group-hover:text-[var(--text-main)] transition-colors leading-relaxed">
<div className="font-mono text-[10px] text-(--text-dim) mb-1">{note.date}</div>
<h3 className="text-sm font-mono text-(--text-muted) group-hover:text-(--text-main) transition-colors leading-relaxed">
{note.title}
</h3>
</div>
))}
</div>
<div className="mt-10 p-5 sketch-border bg-[var(--color-accent-muted)]/5 transform rotate-1">
<div className="mt-10 p-5 sketch-border bg-(--color-accent-muted)/5 transform rotate-1">
<div className="flex gap-3 items-start">
<Terminal className="w-5 h-5 accent-text mt-1 flex-shrink-0" />
<p className="text-[var(--text-muted)] text-sm font-mono leading-relaxed">
<Terminal className="w-5 h-5 accent-text mt-1 shrink-0" />
<p className="text-(--text-muted) text-sm font-mono leading-relaxed">
<span className="font-sketch text-lg accent-text block mb-1">Observation:</span>
All systems operating nominally. Proceeding with hardware teardown sequence 0x4B.
</p>

10
src/components/NavigationBar.tsx
View File

@@ -2,10 +2,10 @@ import { Github, Mail, Terminal } from 'lucide-react';
export function NavigationBar() {
return (
<nav className="flex flex-col sm:flex-row justify-between items-start sm:items-center border-b-2 border-dashed border-[var(--border-main)] pb-4 gap-4">
<div className="flex items-center gap-2 text-sm text-[var(--text-muted)] relative group">
<nav className="flex flex-col sm:flex-row justify-between items-start sm:items-center border-b-2 border-dashed border-(--border-main) pb-4 gap-4">
<div className="flex items-center gap-2 text-sm text-(--text-muted) relative group">
<Terminal className="w-5 h-5 accent-text transform -rotate-12 group-hover:rotate-12 transition-transform" />
<span className="font-sketch text-2xl text-[var(--text-main)] tracking-wide">aditya_gupta <span className="text-[var(--text-dim)]">//</span> sortedcord</span>
<span className="font-sketch text-2xl text-(--text-main) tracking-wide">aditya_gupta <span className="text-(--text-dim)">//</span> sortedcord</span>
<div className="absolute -top-6 -right-16 font-sketch text-sm accent-text rotate-12 flex items-center gap-1 opacity-80">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="transform -scale-x-100 rotate-45"><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg>
@@ -14,8 +14,8 @@ export function NavigationBar() {
</div>
<div className="flex items-center gap-6">
<a href="#" className="font-sketch text-lg hover:text-[var(--text-main)] transition-colors flex items-center gap-2 group"><Github className="w-4 h-4 group-hover:-translate-y-1 transition-transform" /> github</a>
<a href="#" className="font-sketch text-lg hover:text-[var(--text-main)] transition-colors flex items-center gap-2 group"><Mail className="w-4 h-4 group-hover:-translate-y-1 transition-transform" /> contact</a>
<a href="#" className="font-sketch text-lg hover:text-(--text-main) transition-colors flex items-center gap-2 group"><Github className="w-4 h-4 group-hover:-translate-y-1 transition-transform" /> github</a>
<a href="#" className="font-sketch text-lg hover:text-(--text-main) transition-colors flex items-center gap-2 group"><Mail className="w-4 h-4 group-hover:-translate-y-1 transition-transform" /> contact</a>
</div>
</nav>
);

2
src/data/content.tsx
View File

@@ -29,6 +29,6 @@ export const PROJECTS = [
export const LAB_NOTES = [
{ date: '2026-02-14', title: 'GT730 and handling some Nvidia Voodoo Magic' },
{ date: '2026-01-28', title: 'Why I stopped using Nginx and wrote my own router' },
{ date: '2026-01-28', title: "So, how's that VPS business going?" },
{ date: '2025-12-10', title: 'Injecting dynamic themes via CSS variable mutations' },
];

35
src/data/education.ts Normal file
View File

@@ -0,0 +1,35 @@
export type EducationItem = {
program: string;
institution: string;
period: string;
highlights: string[];
};
export const EDUCATION: EducationItem[] = [
{
program: 'B.Sc, Artificial Intelligence & Data Science',
institution: 'Indian Institute of Technology, Madras',
period: '2024 - Present',
highlights: [
'Math, Statistics for Machine Learning',
'LLMs - Text Processing, Sentiment Analysis, Text Extraction',
'Workflow Atuomation: Jules, CI/CD, Copilot',
'RAG & Multimodal: Vector Databases, Embeddings, Typesense'
]
},
{
program: 'B.Tech, Computer Science',
institution: 'Maharaja Agrasen Institute of Technology',
period: '2024 — Present',
highlights: [
'Focus: Low-Level Design, Full Stack Development',
'Coursework: OS, compilers',
],
},
{
program: 'Higher Secondary (PCM)',
institution: 'Birla Vidya Niketan',
period: '2009 — 2023',
highlights: ['Science + CS intensive track', 'Tech club + hackathons'],
},
];