Portfolio v3
Scroll-scrubbed lifeline timeline for a fullstack developer — Jon Doe filler career with fictional companies. Drop images and videos into public/ slots. New projects only (shadcn init --template next).
Scroll-scrubbed lifeline timeline for a fullstack developer — Jon Doe filler career with fictional companies. Drop images and videos into public/ slots. New projects only (shadcn init --template next).
import type { Metadata } from "next"
import { GeistSans } from "geist/font/sans"
import type { ReactNode } from "react"
import { ThemeProvider } from "../components/theme-provider"
import "./globals.css"
export const metadata: Metadata = {
title: "Jon Doe",
description:
"Fullstack developer — a scroll-scrubbed timeline of sites shipped and teams joined.",
}
export default function RootLayout({ children }: { children: ReactNode }) {
return (
<html
lang="en"
className={`h-full ${GeistSans.variable} antialiased`}
suppressHydrationWarning
>
<body
className={`${GeistSans.className} flex min-h-svh flex-col bg-background font-sans text-foreground`}
>
<ThemeProvider>{children}</ThemeProvider>
</body>
</html>
)
}
New Next.js project only (same flow as https://ui.shadcn.com/create): npx shadcn@latest init --template next -y "https://uiception.com/r/portfolio-v3.json"
This scaffolds Next.js + shadcn, then installs the full timeline site.
Edit milestones, global events, and companies in lib/jon-doe.ts. Four color-coded tracks: set an event's category to "work", "college", or "destination" for an amber/violet/teal timeline dot, and list conference/meetup entries under a milestone's globalEvents for a pink dot with a company icon. Drop moment stills into public/images/moments/, destination photos into public/images/destinations/, and clips into public/videos/moments/ (matching the .gitkeep names). Destination events also accept a video filename under public/videos/destinations/. Fresh install uses the same local-first + CDN fallback as blocks (https://uiception.com/images|videos/templates/portfolio-v3/...). A local file with the same base name wins. Drop public/avatar.png to replace the demo avatar. Preview at /view/portfolio-v3. Theme switcher is in the footer.
Lifeline components are vendored from https://github.com/evilrabbit/lifeline (MIT).
