Files
dalcode-website/app/careers/page.tsx
T
Leon-in 95eb362bfc feat: initial commit — Webflow to Next.js conversion
QuantumLab template converted to Next.js 16 + React 19 + TypeScript:
- 8 page routes (home, about, blog, contact, careers, team-members, coming-soon, 404)
- Dynamic routes for blog posts, career positions, and team members
- GSAP animations (marquee, counters, button hovers)
- IntersectionObserver-based scroll reveal (blur-to-clear transitions)
- Dark mode with next-themes
- React Hook Form + Zod contact form
- Framer Motion page transitions
- Lottie animations via lottie-web

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-26 18:19:56 +08:00

72 lines
3.2 KiB
TypeScript

import type { Metadata } from "next"
import Link from "next/link"
import { CAREERS } from "@/lib/careers-data"
export const metadata: Metadata = {
title: "Careers",
description: "Join our team and help shape the future of AI. Explore open positions at DalCode.",
openGraph: {
title: "Careers at DalCode",
description: "Join our team and help shape the future of AI.",
},
}
export default function CareersPage() {
return (
<main>
<section className="section-small top overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div className="inner-container _650px center">
<div className="text-center">
<div className="subtitle">Careers</div>
<div className="mg-top-4x-extra-small">
<h1>Join our team</h1>
</div>
<div className="mg-top-4x-extra-small">
<p>We&apos;re looking for talented people to help us build the future of AI-powered development tools.</p>
</div>
</div>
</div>
<div className="mg-top-regular">
<div className="corner-gradient-container">
<div className="border-wrapper">
<div className="positions-list-wrapper">
{CAREERS.map((career) => (
<Link key={career.slug} href={`/careers/${career.slug}`} className="position-item w-inline-block">
<div className="position-item-content">
<div className="position-info">
<h3 className="display-4">{career.title}</h3>
<div className="position-details">
<div className="item-details">{career.department}</div>
<div className="item-details-divider">&middot;</div>
<div className="item-details">{career.location}</div>
<div className="item-details-divider">&middot;</div>
<div className="item-details">{career.type}</div>
</div>
</div>
<div className="button-icon-wrapper primary">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 17 17" fill="none" className="squared-icon">
<path d="M6.25391 3.45312L10.7458 8.01563L6.25391 12.5781" stroke="currentColor" strokeWidth="1.5" strokeLinecap="square" />
</svg>
<div className="button-icon-bg" />
<div className="button-icon-bg-inside" />
</div>
</div>
</Link>
))}
</div>
</div>
<div className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal top-left" />
<div className="corner-gradient-horizontal bottom-left" />
<div className="corner-gradient-horizontal top-right" />
<div className="corner-gradient-horizontal bottom-right" />
</div>
</div>
</div>
</div>
</section>
</main>
)
}