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>
This commit is contained in:
Leon-in
2026-04-26 18:19:56 +08:00
commit 95eb362bfc
134 changed files with 25831 additions and 0 deletions
+92
View File
@@ -0,0 +1,92 @@
@import "tailwindcss";
/* Webflow base resets are in webflow.css */
/* Dark mode: override Webflow CSS variables */
.dark {
--core--colors--neutral--800: #f5f5f5;
--core--colors--neutral--700: #e0e0e0;
--core--colors--neutral--600: #a0a0a0;
--core--colors--neutral--500: #707070;
--core--colors--neutral--400: #2a2a2a;
--core--colors--neutral--300: #1e1e1e;
--core--colors--neutral--200: #161616;
--core--colors--neutral--100: #0d0d0d;
--font--colors--title: var(--core--colors--neutral--800);
--font--colors--paragraph: var(--core--colors--neutral--600);
}
.dark body,
.dark .page-wrapper {
background-color: #0d0d0d;
color: #e0e0e0;
}
.dark .section-small,
.dark .section,
.dark .hero-v1-grid-wrapper,
.dark .cta-section:not(.v4) {
background-color: #0d0d0d;
}
.dark .border-wrapper,
.dark .corner-gradient-container:not(.row) {
background-color: #141414;
}
.dark .input:not(.dark-mode) {
background-color: #1a1a1a;
border-color: #2a2a2a;
color: #e0e0e0;
}
.dark .input:not(.dark-mode)::placeholder {
color: #666;
}
.dark .header-wrapper,
.dark .header-wrapper---absolute {
background-color: rgba(13, 13, 13, 0.9);
backdrop-filter: blur(12px);
}
.dark .link .link-text {
color: #d0d0d0;
}
.dark .footer-wrapper {
background-color: #0a0a0a;
}
/* Show/hide elements based on theme */
.show-dark-mode {
display: none;
}
.dark .show-dark-mode {
display: block;
}
.dark .show-light-mode {
display: none;
}
/* Theme toggle button */
.theme-toggle {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 8px;
border: 1px solid var(--core--colors--neutral--400);
background: transparent;
cursor: pointer;
color: var(--core--colors--neutral--700);
transition: background-color 0.2s, color 0.2s;
}
.theme-toggle:hover {
background-color: var(--core--colors--neutral--300);
}