gitea/dalcode-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

checkpoint: before i18n implementation

Browse Source
This commit is contained in:
Leon-in
2026-04-29 00:29:14 +08:00
parent ded6c67a36
commit 437dc976fb
41 changed files with 2167 additions and 1855 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/ContactForm.tsx
+27 -26
View File
@@ -6,14 +6,14 @@ import { z } from "zod"
import { useState } from "react"
const schema = z.object({
firstName: z.string().min(1, "First name is required"),
lastName: z.string().min(1, "Last name is required"),
email: z.string().email("Please enter a valid email"),
country: z.string().min(1, "Country is required"),
phone: z.string().min(1, "Phone number is required"),
company: z.string().min(1, "Company is required"),
companySize: z.string().min(1, "Please select company size"),
message: z.string().min(10, "Message must be at least 10 characters"),
firstName: z.string().min(1, "请填写名字"),
lastName: z.string().min(1, "请填写姓氏"),
email: z.string().email("请输入有效的邮箱地址"),
country: z.string().min(1, "请填写所在国家或地区"),
phone: z.string().min(1, "请填写联系方式"),
company: z.string().min(1, "请填写公司或项目名称"),
companySize: z.string().min(1, "请选择团队规模"),
message: z.string().min(10, "请至少写 10 个字符说明你的需求"),
})
type FormData = z.infer<typeof schema>
@@ -43,15 +43,15 @@ export default function ContactForm() {
if (status === "success") {
return (
<div className="contact-form-block w-form">
<div id="contact-form" className="contact-form-block w-form">
<div className="success-message-wrapper w-form-done" style={{ display: "block" }}>
<div className="contact-success-message">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="contact-success-icon">
<path d="M7.20658 10.9311L9.24116 12.1209L12.7928 7.20696M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z" stroke="currentColor" strokeWidth="1.5" strokeLinecap="square" />
</svg>
<h2 className="display-5">Thank you! We&apos;ll get back to you soon</h2>
<h2 className="display-5">已收到你的信息，我们会尽快联系你</h2>
<div className="mg-top-4x-extra-small">
<p>We have received your message and will get back to you as soon as possible.</p>
<p>如果你在消息里写了团队规模、代码栈和交付约束，后续沟通会更快进入正题。</p>
</div>
</div>
</div>
@@ -60,20 +60,21 @@ export default function ContactForm() {
}
return (
<div className="contact-form-block w-form">
<div id="contact-form" className="contact-form-block w-form">
<form onSubmit={handleSubmit(onSubmit)} className="grid-2-columns contact-form-grid">
<input className={`input contact-form w-input`} maxLength={256} placeholder="First name" type="text" {...register("firstName")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="Last name" type="text" {...register("lastName")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="Email address" type="email" {...register("email")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="Country" type="text" {...register("country")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="(123) 456 - 7890" type="tel" {...register("phone")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="Company" type="text" {...register("company")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="名字" type="text" {...register("firstName")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="姓氏" type="text" {...register("lastName")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="工作邮箱" type="email" {...register("email")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="所在国家 / 地区" type="text" {...register("country")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="微信 / 电话" type="tel" {...register("phone")} />
<input className={`input contact-form w-input`} maxLength={256} placeholder="公司 / 项目名称" type="text" {...register("company")} />
<div className="select-wrapper">
<select className="input select-form w-select" {...register("companySize")}>
<option value="">Company size</option>
<option value="1-20 Employees">1-20 Employees</option>
<option value="20-100 Employees">20-100 Employees</option>
<option value="100+ Employees">100+ Employees</option>
<option value="">团队规模</option>
<option value="1-10">1-10 人</option>
<option value="11-50">11-50 人</option>
<option value="51-200">51-200 人</option>
<option value="200+">200 人以上</option>
</select>
<div className="select-icon-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="select-icon">
@@ -81,21 +82,21 @@ export default function ContactForm() {
</svg>
</div>
</div>
<textarea maxLength={5000} placeholder="Enter your message" className="text-area contact-form w-input" {...register("message")} />
<textarea maxLength={5000} placeholder="介绍你的团队、当前流程、想解决的问题，以及希望 DAL Code 帮你完成什么。" className="text-area contact-form w-input" {...register("message")} />
<div className="contact-form-button-wrapper">
<button type="submit" className="form-button w-button" disabled={isSubmitting}>
{isSubmitting ? "Please wait..." : "Send message"}
{isSubmitting ? "提交中..." : "提交需求"}
</button>
</div>
</form>
{Object.keys(errors).length > 0 && (
<div className="error-message contact-form-error w-form-fail" style={{ display: "block" }}>
<div>Please fill in all required fields correctly.</div>
<div>请先完整填写必填项，并确认邮箱格式正确。</div>
</div>
)}
{status === "error" && (
<div className="error-message contact-form-error w-form-fail" style={{ display: "block" }}>
<div>Oops! Something went wrong. Please try again.</div>
<div>提交失败，请稍后重试。</div>
</div>
)}
</div>
components/Footer.tsx
+34 -157
View File
@@ -3,6 +3,7 @@
import Image from "next/image"
import Link from "next/link"
import NewsletterForm from "@/components/NewsletterForm"
import { CONTACT_CHANNELS, FOOTER_GROUPS, SITE_BRAND, SITE_DESCRIPTION } from "@/lib/site-content"
export default function Footer() {
return (
@@ -12,13 +13,12 @@ export default function Footer() {
<div className="footer-top">
<div className="footer-logo-wrapper">
<Link href="/" className="logo-link w-inline-block w--current">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a73cf7c58867b86184dc28_logo-icon-quantum-webflow-template.svg" width={54} height={54} alt="Logo - Quantum | Webflow Template" className="logo-icon w-variant-7662d6cb-8aa5-f783-c60a-07a613bd9733" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a73cf7c58867b86184dc28_logo-icon-quantum-webflow-template.svg" width={54} height={54} alt="DAL Code logo" className="logo-icon w-variant-7662d6cb-8aa5-f783-c60a-07a613bd9733" />
</Link>
</div>
<Link href="/careers" className="footer-button w-inline-block">
<Link href="/contact" className="footer-button w-inline-block">
<div className="button-content footer">
<div>
Join our team </div>
<div>申请试用</div>
</div>
<div className="button-icon-wrapper footer primary">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 17 17" fill="none" className="squared-icon">
@@ -43,122 +43,40 @@ Join our team </div>
<div className="w-layout-blockcontainer container-default w-container">
<div className="w-layout-grid footer-middle-content">
<div className="inner-container _355px _100-tablet">
<div className="display-6 medium text-titles-dm">
Unlock tomorrow’s most important AI trends </div>
<div className="display-6 medium text-titles-dm">{SITE_BRAND}</div>
<div className="mg-top-8-px">
<p className="text-color-neutral-400 mg-bottom-20px">
Lorem ipsum dolor sit amet consectetur sit mi lacus quis vitae sed pellentesque libero ultricies neque. </p>
<p className="text-color-neutral-400 mg-bottom-20px">{SITE_DESCRIPTION}</p>
</div>
<NewsletterForm variant="dark" />
</div>
<div className="w-layout-grid footer-pages-grid">
<div className="footer-pages-column">
<Link href="/" className="footer-link w-inline-block w--current">
<div className="footer-link-text">
Home </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
<Link href="/about" className="footer-link w-inline-block">
<div className="footer-link-text">
About </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
<Link href="/contact" className="footer-link w-inline-block">
<div className="footer-link-text">
Contact </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
<Link href="/careers" className="footer-link last---left-column w-inline-block">
<div className="footer-link-text">
Careers </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
</div>
<div className="footer-pages-column">
<Link href="/careers/ai-research-scientist" className="footer-link w-inline-block">
<div className="footer-link-text">
Career single </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
<Link href="/blog" className="footer-link w-inline-block">
<div className="footer-link-text">
Blog </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
<Link href="/blog-posts/ai-powered-predictive-models-and-their-impact-across-industries" className="footer-link w-inline-block">
<div className="footer-link-text">
Blog post </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
<Link href="/coming-soon" className="footer-link last---right-column w-inline-block">
<div className="footer-link-text">
Coming soon </div>
<div className="footer-link-icon">
<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">
</path>
</svg>
</div>
<div className="footer-link-bg">
</div>
</Link>
</div>
{FOOTER_GROUPS.map((group) => (
<div key={group.title} className="footer-pages-column">
{group.links.map((link, index) => (
<Link
key={link.href}
href={link.href}
className={`footer-link w-inline-block ${index === group.links.length - 1 ? "last---left-column" : ""}`}
>
<div className="footer-link-text">{link.label}</div>
<div className="footer-link-icon">
<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>
<div className="footer-link-bg" />
</Link>
))}
</div>
))}
</div>
</div>
</div>
</div>
<div className="corner-gradient-container">
<div className="w-layout-grid footer-links-wrapper">
<a data-w-id="08100fe2-7e2d-6e6c-ca53-e21c22c274f5" href="mailto:info@quantum.com" className="footer-contact-link w-inline-block" target="_blank" rel="noopener noreferrer">
{CONTACT_CHANNELS.map((channel, index) => (
<a key={channel.title} data-w-id={`footer-channel-${index}`} href={channel.href} className="footer-contact-link w-inline-block" target={channel.href.startsWith("http") ? "_blank" : undefined} rel={channel.href.startsWith("http") ? "noopener noreferrer" : undefined}>
<div className="footer-contact-link-icon-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24" fill="none" className="footer-contact-link-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M0 2H24V4.31556L12.0001 10.861L0 4.31546V2ZM0 6.59364V22H24V6.59373L12.0001 13.1391L0 6.59364Z" fill="currentColor">
@@ -168,50 +86,13 @@ Coming soon </div>
</div>
</div>
<div>
<div className="text-color-neutral-500">
Email address </div>
<div className="text-color-neutral-500">{channel.title}</div>
<div className="mg-top-5x-extra-small">
<div className="medium text-titles-dm">
info@quantumlab.com </div>
</div>
</div>
</a>
<a href="https://www.intercom.com" target="_blank" className="footer-contact-link w-inline-block" rel="noopener noreferrer">
<div className="footer-contact-link-icon-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24" fill="none" className="footer-contact-link-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M2 1H1V20H5.25V23.7944L6.77605 22.8505L11.3843 20H23V1H2ZM16 9.5H7V6.5H16V9.5ZM7 14.5H14V11.5H7V14.5Z" fill="currentColor">
</path>
</svg>
<div className="footer-contact-link-bg">
</div>
</div>
<div>
<div className="text-color-neutral-500">
Live chat with us </div>
<div className="mg-top-5x-extra-small">
<div className="medium text-titles-dm">
Chat with us </div>
</div>
</div>
</a>
<a data-w-id="7fe5019c-0d48-0b18-79a9-ab7251d22b0b" href="mailto:support@quantum.com" className="footer-contact-link w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="footer-contact-link-icon-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24" fill="none" className="footer-contact-link-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M1.375 12C1.375 6.13197 6.13197 1.375 12 1.375C17.868 1.375 22.625 6.13197 22.625 12C22.625 17.868 17.868 22.625 12 22.625C6.13197 22.625 1.375 17.868 1.375 12ZM12.8543 7.60707H11.0834V5.83623H12.8543V7.60707ZM11.1146 11.1146H9.34375V9.34375H12.8854V15.5417H14.6563V17.3125H9.34375V15.5417H11.1146V11.1146Z" fill="currentColor">
</path>
</svg>
<div className="footer-contact-link-bg">
</div>
</div>
<div>
<div className="text-color-neutral-500">
Support </div>
<div className="mg-top-5x-extra-small">
<div className="medium text-titles-dm">
support@quantumlab.com </div>
<div className="medium text-titles-dm">{channel.value}</div>
</div>
</div>
</a>
))}
</div>
<div className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal bottom-left dark-mode">
@@ -225,21 +106,17 @@ support@quantumlab.com </div>
</div>
</div>
<div className="footer-bottom">
<a href="https://www.brixtemplates.com" target="_blank" className="link-square-icon-left---dark-mode w-inline-block" rel="noopener noreferrer">
<Link href="/about" className="link-square-icon-left---dark-mode w-inline-block">
<div className="icon-40px---dark-mode">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 19" fill="none" className="icon-18px">
<path fillRule="evenodd" clipRule="evenodd" d="M19.7781 4.875L13.8748 16.4155H8.32985L10.8004 11.6326H10.6896C8.65138 14.2785 5.61034 16.0202 1.27734 16.4155V11.6988C1.27734 11.6988 4.04927 11.5351 5.6788 9.82186H1.27734V4.87509H6.22411V8.94374L6.33513 8.94329L8.35659 4.87509H12.0977V8.91794L12.2087 8.91776L14.306 4.875H19.7781Z" fill="currentColor">
</path>
</svg>
</div>
<div>
More Webflow Templates </div>
</a>
<div>了解产品定位</div>
</Link>
<p className="text-color-neutral-500">
Copyright © QuantumLab | Designed by <a href="https://www.brixtemplates.com" target="_blank" className="text-link" rel="noopener noreferrer">
BRIX Templates </a>
and powered by <a href="https://webflow.com" target="_blank" className="text-link" rel="noopener noreferrer">
Webflow </a>
Copyright © 2026 DAL Code by DeepAILab. 官网基于现有 Next.js 骨架持续演进。
</p>
</div>
</div>
components/GsapAnimations.tsx
+3 -6
View File
@@ -13,7 +13,7 @@ export default function GsapAnimations() {
ctx = gsap.context(() => {
initMarquee(gsap, Observer)
initCounters(gsap, ScrollTrigger)
initCounters(gsap)
initScrollReveal(gsap, ScrollTrigger)
initButtonHovers(gsap)
initSmoothScroll()
@@ -93,7 +93,7 @@ function initMarquee(
target: window,
type: "wheel,scroll,touch",
onChangeY: (self: { velocityY: number }) => {
let velocity = gsap.utils.clamp(-40, 40, self.velocityY * 0.002)
const velocity = gsap.utils.clamp(-40, 40, self.velocityY * 0.002)
const dir = velocity < 0 ? -1 : 1
instances.forEach((inst) => {
if (inst.isHoverPaused) return
@@ -115,10 +115,7 @@ function initMarquee(
}
}
function initCounters(
gsap: typeof import("gsap").gsap,
ScrollTrigger: typeof import("gsap/ScrollTrigger").ScrollTrigger,
) {
function initCounters(gsap: typeof import("gsap").gsap) {
const elements = gsap.utils.toArray<HTMLElement>(".count-up-number-animation")
if (!elements.length) return
components/Header.tsx
+19 -41
View File
@@ -5,13 +5,7 @@ import Image from "next/image"
import Link from "next/link"
import { usePathname } from "next/navigation"
import ThemeToggle from "@/components/ThemeToggle"
const NAV_LINKS = [
{ href: "/", label: "Home" },
{ href: "/about", label: "About" },
{ href: "/blog", label: "Blog" },
{ href: "/contact", label: "Contact" },
]
import { NAV_GROUPS, NAV_LINKS } from "@/lib/site-content"
function ChevronIcon() {
return (
@@ -34,6 +28,10 @@ export default function Header() {
const [dropdownOpen, setDropdownOpen] = useState(false)
const [scrolled, setScrolled] = useState(false)
const pathname = usePathname()
const closeMenus = useCallback(() => {
setMobileOpen(false)
setDropdownOpen(false)
}, [])
useEffect(() => {
const onScroll = () => setScrolled(window.scrollY > 20)
@@ -41,11 +39,6 @@ export default function Header() {
return () => window.removeEventListener("scroll", onScroll)
}, [])
useEffect(() => {
setMobileOpen(false)
setDropdownOpen(false)
}, [pathname])
const toggleMobile = useCallback(() => setMobileOpen((v) => !v), [])
return (
@@ -82,6 +75,7 @@ export default function Header() {
<Link
href={href}
className={`link w-inline-block ${pathname === href ? "w--current" : ""}`}
onClick={closeMenus}
>
<div className="link-icon-wrapper">
<div className="link-icon">
@@ -104,7 +98,7 @@ export default function Header() {
aria-expanded={dropdownOpen}
type="button"
>
<div>Pages</div>
<div>Explore</div>
<div className="dropdown-icon">
<DropdownIcon />
</div>
@@ -113,28 +107,12 @@ export default function Header() {
<nav className="dropdown-content-wrapper w-dropdown-list w--open">
<div className="card header-dropdown-card">
<div className="w-layout-grid header-dropdown-grid">
<div>
<div className="dropdown-title">Main pages</div>
<div className="w-layout-grid main-pages-grid">
{NAV_GROUPS.map((group) => (
<div key={group.title}>
<div className="dropdown-title">{group.title}</div>
<div className="w-layout-grid pages-column">
{[
{ href: "/", label: "Home" },
{ href: "/about", label: "About" },
{ href: "/contact", label: "Contact" },
].map(({ href, label }) => (
<Link key={href} href={href} className="link w-inline-block">
<div className="link-icon-wrapper">
<div className="link-icon"><ChevronIcon /></div>
</div>
<div className="link-text">{label}</div>
</Link>
))}
</div>
<div className="w-layout-grid pages-column">
{[
{ href: "/blog", label: "Blog" },
].map(({ href, label }) => (
<Link key={href} href={href} className="link w-inline-block">
{group.links.map(({ href, label }) => (
<Link key={href} href={href} className="link w-inline-block" onClick={closeMenus}>
<div className="link-icon-wrapper">
<div className="link-icon"><ChevronIcon /></div>
</div>
@@ -143,7 +121,7 @@ export default function Header() {
))}
</div>
</div>
</div>
))}
</div>
</div>
</nav>
@@ -151,9 +129,9 @@ export default function Header() {
</div>
</li>
<li className="link-nav-item mbl-button">
<Link href="/contact" className="primary-button w-inline-block">
<Link href="/contact" className="primary-button w-inline-block" onClick={closeMenus}>
<div className="button-content">
<div>Join our team</div>
<div>申请试用</div>
<div className="button-icon-wrapper primary">
<ChevronIcon />
<div className="button-icon-bg" />
@@ -166,9 +144,9 @@ export default function Header() {
</nav>
<div className="hidden-on-mobile-landscape">
<div className="show-light-mode">
<Link href="/contact" className="primary-button w-inline-block">
<Link href="/contact" className="primary-button w-inline-block" onClick={closeMenus}>
<div className="button-content">
<div>Join our team</div>
<div>申请试用</div>
<div className="button-icon-wrapper primary">
<ChevronIcon />
<div className="button-icon-bg" />
@@ -178,9 +156,9 @@ export default function Header() {
</Link>
</div>
<div className="show-dark-mode">
<Link href="/contact" className="secondary-button w-inline-block">
<Link href="/contact" className="secondary-button w-inline-block" onClick={closeMenus}>
<div className="button-content">
<div>Join our team</div>
<div>申请试用</div>
<div className="button-icon-wrapper secondary">
<ChevronIcon />
<div className="button-icon-bg bg-neutral-800" />
components/NewsletterForm.tsx
+5 -5
View File
@@ -6,7 +6,7 @@ import { z } from "zod"
import { useState } from "react"
const schema = z.object({
email: z.string().email("Please enter a valid email address"),
email: z.string().email("请输入有效的邮箱地址"),
})
type FormData = z.infer<typeof schema>
@@ -46,7 +46,7 @@ export default function NewsletterForm({ variant = "dark" }: NewsletterFormProps
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="squared-icon _14px">
<path d="M7.20658 10.9311L9.24116 12.1209L12.7928 7.20696M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z" stroke="currentColor" strokeWidth="1.5" strokeLinecap="square" />
</svg>
<div>Thanks for subscribing to our newsletter!</div>
<div>已订阅 DAL Code 月度洞察。</div>
</div>
</div>
)
@@ -59,7 +59,7 @@ export default function NewsletterForm({ variant = "dark" }: NewsletterFormProps
<input
className={`input ${isDark ? "dark-mode" : ""} w-input`}
maxLength={256}
placeholder="Enter your email"
placeholder="输入邮箱，接收 DAL Code 月度洞察"
type="email"
{...register("email")}
/>
@@ -69,7 +69,7 @@ export default function NewsletterForm({ variant = "dark" }: NewsletterFormProps
className={`form-button inside-input ${isDark ? "dark-mode" : ""} w-button`}
disabled={isSubmitting}
>
{isSubmitting ? "Please wait..." : "Subscribe"}
{isSubmitting ? "提交中..." : "订阅"}
</button>
</div>
</div>
@@ -81,7 +81,7 @@ export default function NewsletterForm({ variant = "dark" }: NewsletterFormProps
</form>
{status === "error" && (
<div className="error-message w-form-fail" style={{ display: "block" }}>
<div>Oops! Something went wrong while submitting the form.</div>
<div>订阅失败，请稍后重试。</div>
</div>
)}
</div>
components/RevealObserver.tsx
+1 -3
View File
@@ -8,9 +8,7 @@ export default function RevealObserver() {
useEffect(() => {
let observer: IntersectionObserver | null = null
let raf: number
raf = requestAnimationFrame(() => {
const raf = requestAnimationFrame(() => {
const allDataWid = document.querySelectorAll<HTMLElement>("[data-w-id]")
const targets: HTMLElement[] = []
components/ThemeToggle.tsx
+6 -4
View File
@@ -1,13 +1,15 @@
"use client"
import { useTheme } from "next-themes"
import { useEffect, useState } from "react"
import { useSyncExternalStore } from "react"
export default function ThemeToggle() {
const { theme, setTheme } = useTheme()
const [mounted, setMounted] = useState(false)
useEffect(() => setMounted(true), [])
const mounted = useSyncExternalStore(
() => () => {},
() => true,
() => false,
)
if (!mounted) {
return <button className="theme-toggle" aria-label="Toggle theme"><span style={{ width: 18, height: 18 }} /></button>
components/about/CareersSection.tsx
+34 -51
View File
@@ -1,70 +1,53 @@
import Image from "next/image"
import { TARGET_PERSONAS } from "@/lib/site-content"
export default function CareersSection() {
return (
<section className="section pd-top-0 overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="57c6d91a-ff5b-0c4b-0e98-f6574583d612" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _650px center">
<div
data-w-id="57c6d91a-ff5b-0c4b-0e98-f6574583d612"
style={{ opacity: "0", filter: "blur(8px)" }}
className="inner-container _650px center"
>
<div className="text-center">
<div className="subtitle">Investors</div>
<div className="subtitle">Who We Build For</div>
<div className="mg-top-4x-extra-small">
<h2>
We partner with purpose-driven investors </h2>
<h2>DAL Code 目前最优先服务的四类用户</h2>
</div>
<div className="mg-top-4x-extra-small">
<div className="inner-container _566px center">
<p>
ipsum dolor sit amet consectetur netus quis ac varius ut nam est tellus ut porttitor ut volutpat malesuada rhoncus quis lacus augue ac urna et eget elementum at elit. </p>
<p>我们不想做一个谁都能说得通、但谁都不真正依赖的 AI IDE，所以官网也直接把核心目标用户讲清楚。</p>
</div>
</div>
</div>
</div>
<div className="mg-top-regular">
<div data-w-id="97dc1372-f411-c523-0bef-128c83baf08b" style={{"opacity": "0", "filter": "blur(8px)"}} className="logo-strip-marquee-wrapper">
<div className="logo-strip-marquee marquee-scroll-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a4098611a628c081a_linkora-logo-quantum-webflow-template.svg" width={125} height={33} alt="Linkora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a23b74de53cc9a64f_converra-logo-quantum-webflow-template.svg" width={130} height={33} alt="Converra Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a24ff0842f7ea9e4f_nexora-logo-quantum-webflow-template.svg" width={110} height={33} alt="Nexora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876ba1593ccde3aeb482_syncell-logo-quantum-webflow-template.svg" width={119} height={33} alt="Syncell Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876c0f4d2d1856ba6b88_socium-logo-quantum-webflow-template.svg" width={125} height={33} alt="Socium Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876bee27e15bc9b9e5a8_bridgr-logo-quantum-webflow-template.svg" width={109} height={33} alt="Bridgr Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a6c28f60e0f1858b8_netspire-logo-quantum-webflow-template.svg" width={121} height={33} alt="Netspire Logo - Quantum | Webflow Template" className="logo-strip-item" />
<div
data-w-id="97dc1372-f411-c523-0bef-128c83baf08b"
style={{ opacity: "0", filter: "blur(8px)" }}
className="corner-gradient-container"
>
<div className="border-wrapper">
<div className="w-layout-grid values-grid">
{TARGET_PERSONAS.map((persona) => (
<div key={persona.title} className="value-item">
<div className="display-4 medium text-titles">{persona.title}</div>
<div className="mg-top-3x-extra-small">
<p>{persona.description}</p>
</div>
</div>
))}
</div>
</div>
<div className="logo-strip-marquee marquee-scroll-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a4098611a628c081a_linkora-logo-quantum-webflow-template.svg" width={125} height={33} alt="Linkora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a23b74de53cc9a64f_converra-logo-quantum-webflow-template.svg" width={130} height={33} alt="Converra Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a24ff0842f7ea9e4f_nexora-logo-quantum-webflow-template.svg" width={110} height={33} alt="Nexora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876ba1593ccde3aeb482_syncell-logo-quantum-webflow-template.svg" width={119} height={33} alt="Syncell Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876c0f4d2d1856ba6b88_socium-logo-quantum-webflow-template.svg" width={125} height={33} alt="Socium Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876bee27e15bc9b9e5a8_bridgr-logo-quantum-webflow-template.svg" width={109} height={33} alt="Bridgr Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a6c28f60e0f1858b8_netspire-logo-quantum-webflow-template.svg" width={121} height={33} alt="Netspire Logo - Quantum | Webflow Template" className="logo-strip-item" />
</div>
<div className="logo-strip-marquee marquee-scroll-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a4098611a628c081a_linkora-logo-quantum-webflow-template.svg" width={125} height={33} alt="Linkora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a23b74de53cc9a64f_converra-logo-quantum-webflow-template.svg" width={130} height={33} alt="Converra Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a24ff0842f7ea9e4f_nexora-logo-quantum-webflow-template.svg" width={110} height={33} alt="Nexora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876ba1593ccde3aeb482_syncell-logo-quantum-webflow-template.svg" width={119} height={33} alt="Syncell Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876c0f4d2d1856ba6b88_socium-logo-quantum-webflow-template.svg" width={125} height={33} alt="Socium Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876bee27e15bc9b9e5a8_bridgr-logo-quantum-webflow-template.svg" width={109} height={33} alt="Bridgr Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a6c28f60e0f1858b8_netspire-logo-quantum-webflow-template.svg" width={121} height={33} alt="Netspire Logo - Quantum | Webflow Template" className="logo-strip-item" />
</div>
<div className="logo-strip-marquee marquee-scroll-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a4098611a628c081a_linkora-logo-quantum-webflow-template.svg" width={125} height={33} alt="Linkora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a23b74de53cc9a64f_converra-logo-quantum-webflow-template.svg" width={130} height={33} alt="Converra Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a24ff0842f7ea9e4f_nexora-logo-quantum-webflow-template.svg" width={110} height={33} alt="Nexora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876ba1593ccde3aeb482_syncell-logo-quantum-webflow-template.svg" width={119} height={33} alt="Syncell Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876c0f4d2d1856ba6b88_socium-logo-quantum-webflow-template.svg" width={125} height={33} alt="Socium Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876bee27e15bc9b9e5a8_bridgr-logo-quantum-webflow-template.svg" width={109} height={33} alt="Bridgr Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a6c28f60e0f1858b8_netspire-logo-quantum-webflow-template.svg" width={121} height={33} alt="Netspire Logo - Quantum | Webflow Template" className="logo-strip-item" />
</div>
<div className="logo-strip-marquee marquee-scroll-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a4098611a628c081a_linkora-logo-quantum-webflow-template.svg" width={125} height={33} alt="Linkora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a23b74de53cc9a64f_converra-logo-quantum-webflow-template.svg" width={130} height={33} alt="Converra Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a24ff0842f7ea9e4f_nexora-logo-quantum-webflow-template.svg" width={110} height={33} alt="Nexora Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876ba1593ccde3aeb482_syncell-logo-quantum-webflow-template.svg" width={119} height={33} alt="Syncell Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876c0f4d2d1856ba6b88_socium-logo-quantum-webflow-template.svg" width={125} height={33} alt="Socium Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876bee27e15bc9b9e5a8_bridgr-logo-quantum-webflow-template.svg" width={109} height={33} alt="Bridgr Logo - Quantum | Webflow Template" className="logo-strip-item" />
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a7876a6c28f60e0f1858b8_netspire-logo-quantum-webflow-template.svg" width={121} height={33} alt="Netspire Logo - Quantum | Webflow Template" className="logo-strip-item" />
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
</div>
</div>
</div>
components/about/HeroSection.tsx
+45 -72
View File
@@ -1,93 +1,66 @@
import LottiePlayer from "@/components/LottiePlayer"
import { COMPANY_STATS } from "@/lib/site-content"
export default function HeroSection() {
return (
<section className="section top overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="28893d6d-b366-6951-6d91-f80940d4e59d" style={{"opacity": "0", "filter": "blur(8px)"}} className="title-left-content-right">
<div
data-w-id="28893d6d-b366-6951-6d91-f80940d4e59d"
style={{ opacity: "0", filter: "blur(8px)" }}
className="title-left-content-right"
>
<div>
<div className="subtitle">About us</div>
<div className="subtitle">Product Positioning</div>
<div className="mg-top-4x-extra-small">
<h1>About our AI lab</h1>
<h1>DAL Code 不是另一个 AI Chat，而是一个 Intent-to-Code 平台</h1>
</div>
</div>
<div className="inner-container _355px">
<p>Lorem ipsum dolor sit amet consectetur maecenas volutpat lobortis ultrices elementum est ut etiam.</p>
<p>
我们在做的是一个会先澄清需求、再规划任务、再驱动工具和模型去完成交付的 AI
Engineering Workspace，而不是把更多模型名堆在界面上。
</p>
</div>
</div>
<div data-w-id="c9aa8bb0-8524-45b8-1337-b4d2c55b6f23" style={{"opacity": "0", "filter": "blur(8px)"}} className="mg-top-regular overflow-hidden">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28b101cd56458bf646202_about-hero-animation-wave-quantum-webflow-template.json" className="about-hero-lottie" loop autoplay />
<div
data-w-id="c9aa8bb0-8524-45b8-1337-b4d2c55b6f23"
style={{ opacity: "0", filter: "blur(8px)" }}
className="mg-top-regular overflow-hidden"
>
<LottiePlayer
src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28b101cd56458bf646202_about-hero-animation-wave-quantum-webflow-template.json"
className="about-hero-lottie"
loop
autoplay
/>
</div>
<div className="mg-top-regular">
<div className="w-layout-grid about-hero-stats-wrapper">
<div data-w-id="d651207f-5e62-7ad5-26ff-8f1f18b04695">
<div className="stat-wrapper _3-digits center-mbl">
<div className="stat-text">
<span data-count="100" className="count-up-number-animation">
</span>
</div>
<div className="stat-arrow-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 15 14" fill="none" className="stat-arrow">
<path d="M7.40431 13.0625L7.4043 2" stroke="currentColor" strokeWidth="1.5">
</path>
<path d="M13.8141 8.40703L7.40703 2L1 8.40703" stroke="currentColor" strokeWidth="1.5">
</path>
</svg>
{COMPANY_STATS.map((stat) => (
<div key={stat.label}>
<div className="stat-wrapper center-mbl">
<div className="stat-text">{stat.value}</div>
<div className="stat-arrow-wrapper">
<svg
xmlns="http://www.w3.org/2000/svg"
width="100%"
viewBox="0 0 15 14"
fill="none"
className="stat-arrow"
>
<path d="M7.40431 13.0625L7.4043 2" stroke="currentColor" strokeWidth="1.5" />
<path
d="M13.8141 8.40703L7.40703 2L1 8.40703"
stroke="currentColor"
strokeWidth="1.5"
/>
</svg>
</div>
</div>
<div className="display-2">{stat.label}</div>
</div>
<div className="display-2">Active users monthly</div>
</div>
<div data-w-id="105a60b4-53cb-8544-7470-f8b8a08cf541">
<div className="stat-wrapper center-mbl">
<div className="stat-text">
<span data-count="92" className="count-up-number-animation">
</span>
</div>
<div className="stat-arrow-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 15 14" fill="none" className="stat-arrow">
<path d="M7.40431 13.0625L7.4043 2" stroke="currentColor" strokeWidth="1.5">
</path>
<path d="M13.8141 8.40703L7.40703 2L1 8.40703" stroke="currentColor" strokeWidth="1.5">
</path>
</svg>
</div>
</div>
<div className="display-2">Average model accuracy</div>
</div>
<div data-w-id="f23f0a63-0eea-7057-9e20-4a5e2141195a">
<div className="stat-wrapper center-mbl">
<div className="stat-text">
<span data-count="89" className="count-up-number-animation">
</span>
</div>
<div className="stat-arrow-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 15 14" fill="none" className="stat-arrow">
<path d="M7.40431 13.0625L7.4043 2" stroke="currentColor" strokeWidth="1.5">
</path>
<path d="M13.8141 8.40703L7.40703 2L1 8.40703" stroke="currentColor" strokeWidth="1.5">
</path>
</svg>
</div>
</div>
<div className="display-2">Productivity increase</div>
</div>
<div data-w-id="b7c967bb-e96e-8b72-b3b0-4b73512ef3ec">
<div className="stat-wrapper center-mbl">
<div className="stat-text">
<span data-count="80" className="count-up-number-animation">
</span>
</div>
<div className="stat-arrow-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 15 14" fill="none" className="stat-arrow">
<path d="M7.40431 13.0625L7.4043 2" stroke="currentColor" strokeWidth="1.5">
</path>
<path d="M13.8141 8.40703L7.40703 2L1 8.40703" stroke="currentColor" strokeWidth="1.5">
</path>
</svg>
</div>
</div>
<div className="display-2">Team members behind</div>
</div>
))}
</div>
</div>
</div>
components/about/MissionSection.tsx
+55 -67
View File
@@ -1,38 +1,51 @@
import Image from "next/image"
import Link from "next/link"
import { ABOUT_VALUES } from "@/lib/site-content"
export default function MissionSection() {
return (
<section className="section-small bg-neutral overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div className="inner-container _1068px center">
<div className="position-relative---z-index-1">
<div data-w-id="384ef9a0-4895-c961-61d5-c03fea5bc587" style={{"opacity": "0", "filter": "blur(8px)"}} className="title-left-content-right">
<div
data-w-id="384ef9a0-4895-c961-61d5-c03fea5bc587"
style={{ opacity: "0", filter: "blur(8px)" }}
className="title-left-content-right"
>
<div className="inner-container _460px">
<div className="subtitle">
</div>
<div className="subtitle">Operating Principles</div>
<div className="mg-top-4x-extra-small">
<h2>
The values behind our platform </h2>
<h2>DAL Code 背后的八个产品原则</h2>
</div>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quis suspendisse nulla. </p>
从中文表达、权限审批到开源边界，我们更关心产品是否能被真实团队长期采用，而不是只在 Demo
里显得聪明。
</p>
</div>
</div>
<Link href="#more-positions" className="tertiary-button w-inline-block">
<Link href="/contact" className="tertiary-button w-inline-block">
<div className="button-content">
<div>
More positions</div>
<div>申请试用</div>
<div className="button-icon-wrapper secondary">
<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">
</path>
<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 bg-neutral-800">
</div>
<div className="button-icon-bg-inside bg-neutral-600">
</div>
<div className="button-icon-bg bg-neutral-800" />
<div className="button-icon-bg-inside bg-neutral-600" />
</div>
</div>
</Link>
@@ -40,63 +53,38 @@ export default function MissionSection() {
</div>
</div>
</div>
<div data-w-id="ff387e65-d5fd-6c3f-9251-5bd1999b387a" style={{"opacity": "0", "filter": "blur(8px)"}} className="container-large">
<div
data-w-id="ff387e65-d5fd-6c3f-9251-5bd1999b387a"
style={{ opacity: "0", filter: "blur(8px)" }}
className="container-large"
>
<div className="corner-gradient-container">
<div className="border-wrapper">
<div className="w-layout-grid values-grid">
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598eeb838c974f3def70a_accuracy-icon-quantum-webflow-template-1.svg" width={64} height={64} alt="Accuracy Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">Transparency</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f0e3caa08df665212f_trust-icon-quantum-webflow-template.svg" width={64} height={64} alt="Trust Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">
</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f1f8443cbbcf767239_intellect-icon-quantum-webflow-template.svg" width={64} height={64} alt="Intellect Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">Innovation</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f00141b9ac31a01989_velocity-icon-quantum-webflow-template.svg" width={64} height={64} alt="Velocity Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">
</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598eefda8dc1927236eb3_clarity-icon-quantum-webflow-template.svg" width={64} height={64} alt="Clarify Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">Safety</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f04600b3080cab823c_scalability-icon-quantum-webflow-template.svg" width={64} height={64} alt="Scalability Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">Reliability</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598ed8d91f474a2d4ecdc_excellence-icon-quantum-webflow-template.svg" width={64} height={64} alt="Excellence Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">Excellence</div>
</div>
<div className="value-item">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598ed19f8b3ed79933a38_communication-icon-quantum-webflow-template.svg" width={64} height={64} alt="Communication Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
<div className="display-4 medium text-titles">Communication</div>
</div>
{ABOUT_VALUES.map((value) => (
<div key={value.title} className="value-item">
<Image
src={value.icon}
width={64}
height={64}
alt={value.title}
data-wf--icon-square--variant="small"
className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f"
/>
<div className="display-4 medium text-titles">{value.title}</div>
</div>
))}
</div>
</div>
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
</div>
</div>
</div>
components/about/SocialLinksSection.tsx
+45 -62
View File
File diff suppressed because one or more lines are too long
components/about/TeamSection.tsx
+72 -250
View File
@@ -1,283 +1,105 @@
import Image from "next/image"
import Link from "next/link"
import { TEAM_MEMBERS } from "@/lib/team-data"
export default function TeamSection() {
return (
<section className="section overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="a61686b5-826c-1f8d-dc8d-43cbbec7dcb0" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _650px center">
<div
data-w-id="a61686b5-826c-1f8d-dc8d-43cbbec7dcb0"
style={{ opacity: "0", filter: "blur(8px)" }}
className="inner-container _650px center"
>
<div className="text-center">
<div className="subtitle">Team members</div>
<div className="subtitle">Build Areas</div>
<div className="mg-top-4x-extra-small">
<h2>
Meet our team</h2>
<h2>我们正在建设的四个核心能力面</h2>
</div>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quis suspendisse nulla amet viverra tortor pharetra. </p>
这里不是虚构团队介绍，而是 DAL Code 当前最重要的产品与工程能力切面。每一层都在决定这是不是一个能长期交付结果的 AI IDE。
</p>
</div>
</div>
</div>
<div data-w-id="b285eee5-c66b-a051-c7d9-48089305f267" style={{"opacity": "0", "filter": "blur(8px)"}} className="team-members-container">
<div
data-w-id="b285eee5-c66b-a051-c7d9-48089305f267"
style={{ opacity: "0", filter: "blur(8px)" }}
className="team-members-container"
>
<div className="corner-gradient-container">
<div className="border-wrapper">
<div className="collection-list-wrapper w-dyn-list">
<div role="list" className="team-members-grid w-dyn-items">
<div role="listitem" className="flex-item w-dyn-item">
<div className="w-layout-grid team-member-item">
<Link href="/team-members/john-carter-wy738" className="avatar-link w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3b39/68a6e5ff7b59be67bb3ac207_john-carter-avatar-quantum-webflow-template.jpg" alt="John Carter" sizes="(max-width: 767px) 100vw, (max-width: 991px) 727.4140625px, 939.9375px" className="avatar-image fit-cover" fill style={{ objectFit: "cover" }} />
</Link>
<div className="team-member-item-content">
<div className="team-member-heading">
<Link href="/team-members/john-carter-wy738" className="heading-link w-inline-block">
<h3 className="display-5">John Carter</h3>
</Link>
<div className="team-member-job-title">
<div className="subtitle">CEO & Founder</div>
{TEAM_MEMBERS.map((member) => (
<div key={member.slug} role="listitem" className="flex-item w-dyn-item">
<div className="w-layout-grid team-member-item">
<Link href={`/team-members/${member.slug}`} className="avatar-link w-inline-block">
<Image
src={member.image}
alt={member.name}
sizes="(max-width: 767px) 100vw, (max-width: 991px) 727px, 940px"
className="avatar-image fit-cover"
fill
style={{ objectFit: "cover" }}
/>
</Link>
<div className="team-member-item-content">
<div className="team-member-heading">
<Link href={`/team-members/${member.slug}`} className="heading-link w-inline-block">
<h3 className="display-5">{member.name}</h3>
</Link>
<div className="team-member-job-title">
<div className="subtitle">{member.role}</div>
</div>
</div>
<div className="mg-top-5x-extra-small">
<p>{member.bio}</p>
</div>
</div>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur diam leo interdum nibh ut at libero elit pharetra in eget. </p>
</div>
</div>
<div className="team-member-buttons-wrapper">
<div>
<a href="https://x.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 19 18" fill="none" className="social-media-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
</svg>
</div>
<div className="team-member-buttons-wrapper">
<Link
href={`/team-members/${member.slug}`}
className="secondary-button small w-inline-block"
>
<div className="button-content">
<div>查看详情</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
<div>
<a href="https://linkedin.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="social-media-icon">
<path d="M1 2.99134C1 2.41413 1.20271 1.93794 1.60811 1.56277C2.01351 1.18758 2.54055 1 3.18919 1C3.82626 1 4.34169 1.18469 4.73552 1.55411C5.14092 1.93506 5.34363 2.43145 5.34363 3.04329C5.34363 3.5974 5.14672 4.05915 4.7529 4.42857C4.3475 4.80952 3.81467 5 3.15444 5H3.13707C2.49999 5 1.98456 4.80952 1.59073 4.42857C1.19691 4.04762 1 3.56854 1 2.99134ZM1.22587 18.1429V6.57576H5.08301V18.1429H1.22587ZM7.22008 18.1429H11.0772V11.684C11.0772 11.2799 11.1236 10.9682 11.2162 10.7489C11.3784 10.3564 11.6245 10.0245 11.9546 9.75324C12.2847 9.48195 12.6988 9.34632 13.1969 9.34632C14.4942 9.34632 15.1429 10.2179 15.1429 11.961V18.1429H19V11.5108C19 9.8023 18.5946 8.50649 17.7838 7.62337C16.973 6.74026 15.9015 6.2987 14.5695 6.2987C13.0753 6.2987 11.9112 6.93939 11.0772 8.22078V8.25541H11.0598L11.0772 8.22078V6.57576H7.22008C7.24324 6.94516 7.25483 8.09378 7.25483 10.0216C7.25483 11.9495 7.24324 14.6565 7.22008 18.1429Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</Link>
</div>
</div>
</div>
</div>
<div role="listitem" className="flex-item w-dyn-item">
<div className="w-layout-grid team-member-item">
<Link href="/team-members/sophie-moore" className="avatar-link w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3b39/68a6e5d29b2f76acd088f052_sophie-moore-avatar-quantum-webflow-template.jpg" alt="Sophie Moore" className="avatar-image fit-cover" fill style={{ objectFit: "cover" }} />
</Link>
<div className="team-member-item-content">
<div className="team-member-heading">
<Link href="/team-members/sophie-moore" className="heading-link w-inline-block">
<h3 className="display-5">Sophie Moore</h3>
</Link>
<div className="team-member-job-title">
<div className="subtitle">
Director of Operations</div>
</div>
</div>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur diam leo interdum nibh ut at libero elit pharetra in eget. </p>
</div>
</div>
<div className="team-member-buttons-wrapper">
<div>
<a href="https://x.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 19 18" fill="none" className="social-media-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
<div>
<a href="https://linkedin.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="social-media-icon">
<path d="M1 2.99134C1 2.41413 1.20271 1.93794 1.60811 1.56277C2.01351 1.18758 2.54055 1 3.18919 1C3.82626 1 4.34169 1.18469 4.73552 1.55411C5.14092 1.93506 5.34363 2.43145 5.34363 3.04329C5.34363 3.5974 5.14672 4.05915 4.7529 4.42857C4.3475 4.80952 3.81467 5 3.15444 5H3.13707C2.49999 5 1.98456 4.80952 1.59073 4.42857C1.19691 4.04762 1 3.56854 1 2.99134ZM1.22587 18.1429V6.57576H5.08301V18.1429H1.22587ZM7.22008 18.1429H11.0772V11.684C11.0772 11.2799 11.1236 10.9682 11.2162 10.7489C11.3784 10.3564 11.6245 10.0245 11.9546 9.75324C12.2847 9.48195 12.6988 9.34632 13.1969 9.34632C14.4942 9.34632 15.1429 10.2179 15.1429 11.961V18.1429H19V11.5108C19 9.8023 18.5946 8.50649 17.7838 7.62337C16.973 6.74026 15.9015 6.2987 14.5695 6.2987C13.0753 6.2987 11.9112 6.93939 11.0772 8.22078V8.25541H11.0598L11.0772 8.22078V6.57576H7.22008C7.24324 6.94516 7.25483 8.09378 7.25483 10.0216C7.25483 11.9495 7.24324 14.6565 7.22008 18.1429Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
</div>
</div>
</div>
<div role="listitem" className="flex-item w-dyn-item">
<div className="w-layout-grid team-member-item">
<Link href="/team-members/lilly-woods" className="avatar-link w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3b39/68a6e5b658f5ca9f60fd5e16_lilly-woods-avatar-quantum-webflow-template.jpg" alt="Lilly Woods" className="avatar-image fit-cover" fill style={{ objectFit: "cover" }} />
</Link>
<div className="team-member-item-content">
<div className="team-member-heading">
<Link href="/team-members/lilly-woods" className="heading-link w-inline-block">
<h3 className="display-5">Lilly Woods</h3>
</Link>
<div className="team-member-job-title">
<div className="subtitle">Lead UX Designer</div>
</div>
</div>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur diam leo interdum nibh ut at libero elit pharetra in eget. </p>
</div>
</div>
<div className="team-member-buttons-wrapper">
<div>
<a href="https://x.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 19 18" fill="none" className="social-media-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
<div>
<a href="https://linkedin.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="social-media-icon">
<path d="M1 2.99134C1 2.41413 1.20271 1.93794 1.60811 1.56277C2.01351 1.18758 2.54055 1 3.18919 1C3.82626 1 4.34169 1.18469 4.73552 1.55411C5.14092 1.93506 5.34363 2.43145 5.34363 3.04329C5.34363 3.5974 5.14672 4.05915 4.7529 4.42857C4.3475 4.80952 3.81467 5 3.15444 5H3.13707C2.49999 5 1.98456 4.80952 1.59073 4.42857C1.19691 4.04762 1 3.56854 1 2.99134ZM1.22587 18.1429V6.57576H5.08301V18.1429H1.22587ZM7.22008 18.1429H11.0772V11.684C11.0772 11.2799 11.1236 10.9682 11.2162 10.7489C11.3784 10.3564 11.6245 10.0245 11.9546 9.75324C12.2847 9.48195 12.6988 9.34632 13.1969 9.34632C14.4942 9.34632 15.1429 10.2179 15.1429 11.961V18.1429H19V11.5108C19 9.8023 18.5946 8.50649 17.7838 7.62337C16.973 6.74026 15.9015 6.2987 14.5695 6.2987C13.0753 6.2987 11.9112 6.93939 11.0772 8.22078V8.25541H11.0598L11.0772 8.22078V6.57576H7.22008C7.24324 6.94516 7.25483 8.09378 7.25483 10.0216C7.25483 11.9495 7.24324 14.6565 7.22008 18.1429Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
</div>
</div>
</div>
<div role="listitem" className="flex-item w-dyn-item">
<div className="w-layout-grid team-member-item">
<Link href="/team-members/matt-cannon" className="avatar-link w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3b39/68a6e5268e58fa10010ce586_matt-cannon-avatar-quantum-webflow-template.jpg" alt="Matt Cannon" sizes="(max-width: 767px) 100vw, (max-width: 991px) 727.4140625px, 939.9375px" className="avatar-image fit-cover" fill style={{ objectFit: "cover" }} />
</Link>
<div className="team-member-item-content">
<div className="team-member-heading">
<Link href="/team-members/matt-cannon" className="heading-link w-inline-block">
<h3 className="display-5">Matt Cannon</h3>
</Link>
<div className="team-member-job-title">
<div className="subtitle">
VP of engineering</div>
</div>
</div>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur diam leo interdum nibh ut at libero elit pharetra in eget. </p>
</div>
</div>
<div className="team-member-buttons-wrapper">
<div>
<a href="https://x.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 19 18" fill="none" className="social-media-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
<path fillRule="evenodd" clipRule="evenodd" d="M7.04543 9.42969L0.0390625 0.25H5.98663L10.1792 5.74312L14.8487 0.25H17.7333L11.5439 7.53115L18.9618 17.25H13.0143L8.41014 11.2177L3.28238 17.25H0.397729L7.04543 9.42969ZM13.8802 15.4998L3.57671 2.00024H5.12071L15.4242 15.4998H13.8802Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
<div>
<a href="https://linkedin.com" className="social-square-icon-link w-variant-09232bd2-04da-efea-f377-662291aed853 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="social-square-icon">
<div className="social-square-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 20 20" fill="none" className="social-media-icon">
<path d="M1 2.99134C1 2.41413 1.20271 1.93794 1.60811 1.56277C2.01351 1.18758 2.54055 1 3.18919 1C3.82626 1 4.34169 1.18469 4.73552 1.55411C5.14092 1.93506 5.34363 2.43145 5.34363 3.04329C5.34363 3.5974 5.14672 4.05915 4.7529 4.42857C4.3475 4.80952 3.81467 5 3.15444 5H3.13707C2.49999 5 1.98456 4.80952 1.59073 4.42857C1.19691 4.04762 1 3.56854 1 2.99134ZM1.22587 18.1429V6.57576H5.08301V18.1429H1.22587ZM7.22008 18.1429H11.0772V11.684C11.0772 11.2799 11.1236 10.9682 11.2162 10.7489C11.3784 10.3564 11.6245 10.0245 11.9546 9.75324C12.2847 9.48195 12.6988 9.34632 13.1969 9.34632C14.4942 9.34632 15.1429 10.2179 15.1429 11.961V18.1429H19V11.5108C19 9.8023 18.5946 8.50649 17.7838 7.62337C16.973 6.74026 15.9015 6.2987 14.5695 6.2987C13.0753 6.2987 11.9112 6.93939 11.0772 8.22078V8.25541H11.0598L11.0772 8.22078V6.57576H7.22008C7.24324 6.94516 7.25483 8.09378 7.25483 10.0216C7.25483 11.9495 7.24324 14.6565 7.22008 18.1429Z" fill="currentColor">
</path>
</svg>
</div>
</div>
<div className="social-square-bg">
</div>
</a>
</div>
</div>
</div>
</div>
))}
</div>
</div>
</div>
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
</div>
</div>
</div>
<div className="mg-top-regular">
<div data-w-id="4195d06f-0501-ccc7-1fa5-38438a921812" style={{"opacity": "0", "filter": "blur(8px)"}} className="buttons-row">
<Link id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" href="/careers" className="primary-button w-inline-block">
<div className="button-content">
<div>
Join our team</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">
</path>
</svg>
<div className="button-icon-bg">
</div>
<div className="button-icon-bg-inside">
<div className="mg-top-40px text-center">
<Link href="/careers" className="tertiary-button w-inline-block">
<div className="button-content">
<div>查看当前建设方向</div>
<div className="button-icon-wrapper secondary">
<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 bg-neutral-800" />
<div className="button-icon-bg-inside bg-neutral-600" />
</div>
</div>
</div>
</Link>
</Link>
</div>
</div>
</div>
</div>
components/about/ValuesSection.tsx
+97 -166
View File
@@ -1,203 +1,134 @@
import Link from "next/link"
import { CAREERS } from "@/lib/careers-data"
const CAREERS_BY_DEPARTMENT = CAREERS.reduce<Record<string, typeof CAREERS>>((acc, career) => {
if (!acc[career.department]) {
acc[career.department] = []
}
acc[career.department].push(career)
return acc
}, {})
const CAREER_GROUPS = Object.entries(CAREERS_BY_DEPARTMENT)
export default function ValuesSection() {
return (
<section id="more-positions" className="section pd-top-0 overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div className="inner-container _1068px center">
<div data-w-id="5c1fa9c3-1e74-faeb-fdc1-94202ec40445" style={{"opacity": "0", "filter": "blur(8px)"}} className="title-left-content-right">
<div
data-w-id="5c1fa9c3-1e74-faeb-fdc1-94202ec40445"
style={{ opacity: "0", filter: "blur(8px)" }}
className="title-left-content-right"
>
<div className="inner-container _460px">
<h2>More positions</h2>
<h2>当前重点建设方向</h2>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quis suspendisse nulla. </p>
<p>我们把官网里的“职位”改成能力建设清单，用更真实的方式展示 DAL Code 接下来 12 个月的投入重点。</p>
</div>
</div>
<Link href="/careers" className="tertiary-button w-inline-block">
<div className="button-content">
<div>
See all positions</div>
<div>查看全部方向</div>
<div className="button-icon-wrapper secondary">
<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">
</path>
<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 bg-neutral-800">
</div>
<div className="button-icon-bg-inside bg-neutral-600">
</div>
<div className="button-icon-bg bg-neutral-800" />
<div className="button-icon-bg-inside bg-neutral-600" />
</div>
</div>
</Link>
</div>
</div>
</div>
<div data-w-id="21838807-4067-5a92-54da-582050a56a5c" style={{"opacity": "0", "filter": "blur(8px)"}} className="container-large">
<div
data-w-id="21838807-4067-5a92-54da-582050a56a5c"
style={{ opacity: "0", filter: "blur(8px)" }}
className="container-large"
>
<div className="corner-gradient-container">
<div className="box-wrapper">
<div className="border-wrapper">
<div className="box-grid">
<div className="box-heading-wrapper">
<h3 className="display-4">Research</h3>
</div>
<div className="w-dyn-list">
<div role="list" className="careers-grid w-dyn-items">
<div role="listitem" className="flex-item w-dyn-item">
<Link href="/careers/ai-research-scientist" className="career-item w-inline-block">
<div>
<h3 className="display-4">AI Research Scientist</h3>
<div className="mg-top-3x-extra-small">
<div className="career-item-details">
<div className="item-details">New York, NY</div>
<div className="item-details-divider">
</div>
<div className="item-details">Full time</div>
{CAREER_GROUPS.map(([department, roles], index) => (
<div key={department} className="border-wrapper">
<div className="box-grid">
<div className="box-heading-wrapper">
<h3 className="display-4">{department}</h3>
</div>
<div className="w-dyn-list">
<div role="list" className="careers-grid w-dyn-items">
{roles.map((career) => (
<div key={career.slug} role="listitem" className="flex-item w-dyn-item">
<Link href={`/careers/${career.slug}`} className="career-item w-inline-block">
<div>
<h3 className="display-4">{career.title}</h3>
<div className="mg-top-3x-extra-small">
<div className="career-item-details">
<div className="item-details">{career.location}</div>
<div className="item-details-divider" />
<div className="item-details">{career.type}</div>
</div>
</div>
</div>
</div>
</div>
<div className="button-icon-wrapper secondary">
<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">
</path>
</svg>
<div className="button-icon-bg bg-neutral-800">
</div>
<div className="button-icon-bg-inside bg-neutral-600">
</div>
</div>
<div className="career-item-bg">
</div>
</Link>
</div>
<div role="listitem" className="flex-item w-dyn-item">
<Link href="/careers/machine-learning-engineer" className="career-item w-inline-block">
<div>
<h3 className="display-4">Machine Learning Engineer</h3>
<div className="mg-top-3x-extra-small">
<div className="career-item-details">
<div className="item-details">Los Angeles, CA</div>
<div className="item-details-divider">
</div>
<div className="item-details">Full time</div>
<div className="button-icon-wrapper secondary">
<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 bg-neutral-800" />
<div className="button-icon-bg-inside bg-neutral-600" />
</div>
</div>
<div className="career-item-bg" />
</Link>
</div>
<div className="button-icon-wrapper secondary">
<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">
</path>
</svg>
<div className="button-icon-bg bg-neutral-800">
</div>
<div className="button-icon-bg-inside bg-neutral-600">
</div>
</div>
<div className="career-item-bg">
</div>
</Link>
))}
</div>
</div>
</div>
</div>
</div>
<div className="box-divider">
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
</div>
</div>
<div className="border-wrapper">
<div className="box-grid">
<div className="box-heading-wrapper">
<h3 className="display-4">Engineering</h3>
</div>
<div className="w-dyn-list">
<div role="list" className="careers-grid w-dyn-items">
<div role="listitem" className="flex-item w-dyn-item">
<Link href="/careers/ai-infrastructure-engineer" className="career-item w-inline-block">
<div>
<h3 className="display-4">AI Infrastructure Engineer</h3>
<div className="mg-top-3x-extra-small">
<div className="career-item-details">
<div className="item-details">
</div>
<div className="item-details-divider">
</div>
<div className="item-details">Full time</div>
</div>
</div>
</div>
<div className="button-icon-wrapper secondary">
<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">
</path>
</svg>
<div className="button-icon-bg bg-neutral-800">
</div>
<div className="button-icon-bg-inside bg-neutral-600">
</div>
</div>
<div className="career-item-bg">
</div>
</Link>
</div>
<div role="listitem" className="flex-item w-dyn-item">
<Link href="/careers/mlops-engineer" className="career-item w-inline-block">
<div>
<h3 className="display-4">
Engineer </h3>
<div className="mg-top-3x-extra-small">
<div className="career-item-details">
<div className="item-details">
</div>
<div className="item-details-divider">
</div>
<div className="item-details">Full time</div>
</div>
</div>
</div>
<div className="button-icon-wrapper secondary">
<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">
</path>
</svg>
<div className="button-icon-bg bg-neutral-800">
</div>
<div className="button-icon-bg-inside bg-neutral-600">
</div>
</div>
<div className="career-item-bg">
</div>
</Link>
{index < CAREER_GROUPS.length - 1 ? (
<div className="box-divider">
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
</div>
</div>
</div>
) : null}
</div>
</div>
))}
</div>
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left" />
<div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right" />
</div>
</div>
</div>
components/blog/CtaSection.tsx
+7 -3
View File
@@ -9,11 +9,14 @@ export default function CtaSection() {
<div className="subtitle dark-mode">Newsletter</div>
<div className="mg-top-4x-extra-small">
<h2 className="text-titles-dm">
Subscribe for cutting-edge AI updates </h2>
每月一封，跟进 DAL Code 的产品洞察与建设进度
</h2>
</div>
<div className="mg-top-4x-extra-small">
<p className="text-paragraph-dm">
ipsum dolor sit amet consectetur at amet felis nulla molestie non viverra diam sed augue gravida ante risus pulvinar diam turpis ut bibendum ut velit felis at nisl lectus. </p>
我们会把官网文章、关键产品判断、路线图变化和典型场景拆解整理成简洁摘要。
中文优先，英文技术术语保留，不发泛泛行业噪音。
</p>
</div>
</div>
<div className="corner-gradient-container">
@@ -31,7 +34,8 @@ export default function CtaSection() {
</path>
</svg>
<div className="text-color-neutral-500">
One email per month — No spam! </div>
每月 1 封，只发和产品建设直接相关的内容
</div>
</div>
</div>
<div className="corner-gradient-wrapper hidden-on-tablet">
components/blog/HeroSection.tsx
+16 -9
View File
@@ -9,21 +9,28 @@ export default function HeroSection() {
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="1d4184ff-9d8d-d0a9-7964-1fe6bc1712ef" style={{ opacity: "0", filter: "blur(8px)" }} className="title-left-content-right">
<div className="inner-container _480px">
<div className="subtitle">Blog</div>
<div className="subtitle">产品洞察</div>
<div className="mg-top-4x-extra-small">
<h1>Latest news</h1>
<h1>把 DAL Code 的产品判断、能力边界和建设路径讲清楚</h1>
</div>
<div className="mg-top-5x-extra-small">
<p>Lorem ipsum dolor sit amet consectetur nec quis suspendisse nulla.</p>
<p>
这里不是泛 AI 新闻聚合，而是围绕 Intent-to-Code、Mission Mode、Smart Routing、
Skills 与中文开发者工作流持续输出的产品文章。
</p>
</div>
</div>
<form action="/search" className="form-block _365px position-relative---z-index-1 w-form">
<label htmlFor="search" className="hidden">Search</label>
<input className="input w-input" maxLength={256} name="query" placeholder="Search for articles…" type="search" id="search" required />
<div className="button-inside-input-wrapper left-mbp">
<input type="submit" className="form-button inside-input light-mode w-button" value="Search" />
<div className="inner-container _355px position-relative---z-index-1">
<p>
当前首批上线 {BLOG_POSTS.length} 篇文章，按产品定位、Agent 与平台能力三个主题组织，
方便快速理解 DAL Code 到底解决什么问题。
</p>
<div className="mg-top-2x-extra-small">
<p className="text-color-neutral-500">
推荐先读置顶两篇，再继续往下看多模型路由、Open Core 与 Skills 平台的完整逻辑。
</p>
</div>
</form>
</div>
</div>
<div className="mg-top-regular">
<div data-w-id="1d4184ff-9d8d-d0a9-7964-1fe6bc1712fd" style={{ opacity: "0", filter: "blur(8px)" }} className="w-dyn-list">
components/blog/PostsGridSection.tsx
+15 -8
View File
@@ -5,9 +5,9 @@ import { BLOG_POSTS, BLOG_CATEGORIES } from "@/lib/blog-data"
import BlogCard from "@/components/BlogCard"
export default function PostsGridSection() {
const [activeCategory, setActiveCategory] = useState("All")
const [activeCategory, setActiveCategory] = useState<(typeof BLOG_CATEGORIES)[number]>(BLOG_CATEGORIES[0])
const filtered = activeCategory === "All"
const filtered = activeCategory === BLOG_CATEGORIES[0]
? BLOG_POSTS
: BLOG_POSTS.filter((p) => p.category === activeCategory)
@@ -15,7 +15,7 @@ export default function PostsGridSection() {
<section className="section">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="41a231e8-d013-bd0a-0639-c179719a51f6" style={{ opacity: "0", filter: "blur(8px)" }} className="title-left-content-right align-center">
<h2>All articles</h2>
<h2>全部文章</h2>
<div className="category-list-wrapper">
<div role="list" className="category-list">
{BLOG_CATEGORIES.map((cat) => (
@@ -24,6 +24,7 @@ export default function PostsGridSection() {
className={`category-link${activeCategory === cat ? " w--current" : ""}`}
onClick={() => setActiveCategory(cat)}
type="button"
aria-pressed={activeCategory === cat}
>
{cat}
</button>
@@ -33,11 +34,17 @@ export default function PostsGridSection() {
</div>
<div className="mg-top-regular">
<div data-w-id="e99a5296-8389-ce52-d99c-66f9d94e1815" style={{ opacity: "0", filter: "blur(8px)" }} className="w-dyn-list">
<div role="list" className="blog-v1-grid w-dyn-items">
{filtered.map((post) => (
<BlogCard key={post.slug} post={post} variant="grid" />
))}
</div>
{filtered.length > 0 ? (
<div role="list" className="blog-v1-grid w-dyn-items">
{filtered.map((post) => (
<BlogCard key={post.slug} post={post} variant="grid" />
))}
</div>
) : (
<div className="inner-container _430px">
<p>这个分类下的内容还在整理中，先看看其他文章。</p>
</div>
)}
</div>
</div>
</div>
components/contact/CardsSection.tsx
+14 -16
View File
@@ -2,16 +2,11 @@
import { useState } from "react"
import Link from "next/link"
const FAQS = [
{ q: "How do I get started with our service?", a: "Lorem ipsum dolor sit amet consectetur ornare dui amet ultrices sed fermentum euismod dictum ut pellentesque aliquet nunc massa sed nisl pretium enim placerat." },
{ q: "Can AI solutions help my business?", a: "Lorem ipsum dolor sit amet consectetur ornare dui amet ultrices sed fermentum euismod dictum ut pellentesque aliquet nunc massa sed nisl pretium enim placerat." },
{ q: "How is ethical AI development ensured?", a: "Lorem ipsum dolor sit amet consectetur ornare dui amet ultrices sed fermentum euismod dictum ut pellentesque aliquet nunc massa sed nisl pretium enim placerat." },
{ q: "What role does QuantumLab Computing play in AI research?", a: "Lorem ipsum dolor sit amet consectetur ornare dui amet ultrices sed fermentum euismod dictum ut pellentesque aliquet nunc massa sed nisl pretium enim placerat." },
]
import { CONTACT_FAQS } from "@/lib/site-content"
export default function CardsSection() {
const [openIndex, setOpenIndex] = useState<number | null>(null)
return (
<section className="section-small">
<div className="w-layout-blockcontainer container-default w-container">
@@ -19,20 +14,23 @@ export default function CardsSection() {
<div className="sticky-top static-mbl">
<div data-w-id="e69dfbb3-1a44-4cc6-11e0-94df71efbf76" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _260px _100-mbl">
<div className="subtitle">
</div>
FAQ
</div>
<div className="mg-top-4x-extra-small">
<h2>Have questions?</h2>
<h2>常见问题</h2>
</div>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quis suspendisse nulla. </p>
如果下面几条还不够覆盖你的情况，直接提交表单会更高效。
</p>
</div>
<div className="mg-top-2x-extra-small">
<div className="buttons-row left">
<a id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" data-wf--primary-button--variant="base" data-w-id="99805214-dd54-e7f3-2549-05c0df1040fb" href="mailto:support@quantum.com" className="primary-button w-inline-block" target="_blank" rel="noopener noreferrer">
<Link id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" data-wf--primary-button--variant="base" href="#contact-form" className="primary-button w-inline-block">
<div className="button-content">
<div>
Get support</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">
@@ -44,22 +42,22 @@ export default function CardsSection() {
</div>
</div>
</div>
</a>
</Link>
</div>
</div>
</div>
</div>
<div className="w-layout-grid faqs-v1-grid">
{FAQS.map((faq, i) => (
{CONTACT_FAQS.map((faq, i) => (
<div key={i} className="card-accordion-v1-wrapper sibling-blur-item" onClick={() => setOpenIndex(openIndex === i ? null : i)} style={{ cursor: "pointer" }}>
<div className="card accordion-card-v1">
<div className="accordion-number">
<div>{String(i + 1).padStart(2, "0")}</div>
</div>
<div className="accordion-content">
<h3 className="accordion-title">{faq.q}</h3>
<h3 className="accordion-title">{faq.question}</h3>
<div className="accordion-body" style={{ maxHeight: openIndex === i ? "200px" : "0px", overflow: "hidden", transition: "max-height 0.3s ease" }}>
<p className="mg-top-4x-extra-small">{faq.a}</p>
<p className="mg-top-4x-extra-small">{faq.answer}</p>
</div>
</div>
<div className="accordion-arrow" style={{ transform: openIndex === i ? "rotate(180deg)" : "rotate(0deg)", transition: "transform 0.3s ease" }}>
components/contact/FormSection.tsx
+68 -64
View File
@@ -1,5 +1,36 @@
import LottiePlayer from "@/components/LottiePlayer"
import Link from "next/link"
import { CONTACT_CHANNELS } from "@/lib/site-content"
const CONTACT_CARDS = [
{
title: "产品试用 / Demo",
description: "适合还在判断 DAL Code 是否匹配当前研发流程的团队，建议先从一个真实任务场景开始聊。",
linkText: "提交试用需求",
href: CONTACT_CHANNELS[0].href,
external: false,
lottie:
"/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28ff8a28b3e0d6614fe9b_help-support-animation-row-wave.json",
},
{
title: "企业方案 / 安全合规",
description: "适合已经明确关注私有化、审批流、权限治理、采购流程和团队协作边界的负责人。",
linkText: "说明企业约束",
href: CONTACT_CHANNELS[1].href,
external: false,
lottie:
"/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28ff844db76df2f0ca451_press-media-animation-row-wave.json",
},
{
title: "生态合作 / Skills 共建",
description: "适合希望围绕插件、模板、知识工作流和开发者社区共同建设产品生态的伙伴。",
linkText: "访问 DeepAILab",
href: CONTACT_CHANNELS[2].href,
external: true,
lottie:
"/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28ff8806a1552f46e35ac_sales-inquiries-animation-visual-row.json",
},
] as const
export default function FormSection() {
return (
@@ -7,82 +38,55 @@ export default function FormSection() {
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="37f8537e-c33a-f3ad-764c-d5c8b3ff1b64" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _650px center">
<div className="text-center">
<div className="subtitle">Contact us</div>
<div className="subtitle">沟通入口</div>
<div className="mg-top-4x-extra-small">
<h2>
Reach us directly</h2>
选择一个更适合你的沟通起点
</h2>
</div>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur ut consequat luctus a ornare auctor mauris necolmer doloe. </p>
如果你能提前说明团队规模、技术栈、希望自动化的环节和安全约束，我们会更容易判断 DAL Code 适合从哪里切入。
</p>
</div>
</div>
</div>
<div className="mg-top-regular">
<div data-w-id="37f8537e-c33a-f3ad-764c-d5c8b3ff1b6a" style={{"opacity": "0", "filter": "blur(8px)"}} className="w-layout-grid contact-cards-grid-v1">
<a data-w-id="c3b7cbc7-6bb0-417d-8af2-d16c83e09934" href="mailto:support@quantumlab.com" className="card contact-card-v1 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="contact-card-v1-content">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28ff8a28b3e0d6614fe9b_help-support-animation-row-wave.json" className="contact-card-v1-image" loop autoplay />
<div>
<h3 className="display-4">Help & support</h3>
<div className="mg-top-5x-extra-small">
<p className="text-paragraph">
ipsum dolor sit amet consectetur nec quis suspendisse nulla amet viverra tortor. </p>
{CONTACT_CARDS.map((card) => {
const body = (
<>
<div className="contact-card-v1-content">
<LottiePlayer src={card.lottie} className="contact-card-v1-image" loop autoplay />
<div>
<h3 className="display-4">{card.title}</h3>
<div className="mg-top-5x-extra-small">
<p className="text-paragraph">{card.description}</p>
</div>
</div>
</div>
</div>
</div>
<div className="contact-card-v1-link-wrapper">
<div className="contact-link-text">support@quantumlab.com</div>
<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">
</path>
</svg>
<div style={{"width": "0%", "height": "100%"}} className="contact-card-link-bg">
</div>
</div>
</a>
<a data-w-id="9fa843fd-acac-5e66-0694-1c416deeff73" href="mailto:media@quantumlab.com" className="card contact-card-v1 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="contact-card-v1-content">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28ff844db76df2f0ca451_press-media-animation-row-wave.json" className="contact-card-v1-image" loop autoplay />
<div>
<h3 className="display-4">Press & media</h3>
<div className="mg-top-5x-extra-small">
<p className="text-paragraph">
ipsum dolor sit amet consectetur nec quis suspendisse nulla amet viverra tortor. </p>
<div className="contact-card-v1-link-wrapper">
<div className="contact-link-text">{card.linkText}</div>
<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">
</path>
</svg>
<div style={{"width": "0%", "height": "100%"}} className="contact-card-link-bg">
</div>
</div>
</div>
</div>
<div className="contact-card-v1-link-wrapper">
<div className="contact-link-text">media@quantumlab.com</div>
<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">
</path>
</svg>
<div style={{"width": "0%", "height": "100%"}} className="contact-card-link-bg">
</div>
</div>
</a>
<a data-w-id="4355aa2b-5646-3ff5-91b3-2f90df58ae42" href="mailto:sales@quantumlab.com" className="card contact-card-v1 w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="contact-card-v1-content">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d28ff8806a1552f46e35ac_sales-inquiries-animation-visual-row.json" className="contact-card-v1-image" loop autoplay />
<div>
<h3 className="display-4">Sales & inquiries</h3>
<div className="mg-top-5x-extra-small">
<p className="text-paragraph">
ipsum dolor sit amet consectetur nec quis suspendisse nulla amet viverra tortor. </p>
</div>
</div>
</div>
<div className="contact-card-v1-link-wrapper">
<div className="contact-link-text">sales@quantumlab.com</div>
<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">
</path>
</svg>
<div style={{"width": "0%", "height": "100%"}} className="contact-card-link-bg">
</div>
</div>
</a>
</>
)
return card.external ? (
<a key={card.title} data-w-id={`contact-card-${card.title}`} href={card.href} className="card contact-card-v1 w-inline-block" target="_blank" rel="noopener noreferrer">
{body}
</a>
) : (
<Link key={card.title} href={card.href} className="card contact-card-v1 w-inline-block">
{body}
</Link>
)
})}
</div>
</div>
</div>
components/contact/HeroSection.tsx
+88 -74
View File
@@ -1,5 +1,19 @@
import Link from "next/link"
import ContactForm from "@/components/ContactForm"
import { CONTACT_CHANNELS, SITE_BRAND } from "@/lib/site-content"
const HERO_CHANNELS = [
{
...CONTACT_CHANNELS[0],
headline: "申请产品演示",
icon: "mail",
},
{
...CONTACT_CHANNELS[1],
headline: "私有化与采购",
icon: "phone",
},
] as const
export default function HeroSection() {
return (
@@ -7,14 +21,17 @@ export default function HeroSection() {
<div className="w-layout-blockcontainer container-default w-container">
<div className="w-layout-grid contact-grid">
<div data-w-id="f1d777b6-f289-d52f-017b-af3a4a212cde" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _430px _100-tablet">
<div className="subtitle">Get in touch</div>
<div className="subtitle">Contact</div>
<div className="mg-top-4x-extra-small">
<h1>
Contact us</h1>
和 {SITE_BRAND} 团队聊聊你的真实场景
</h1>
</div>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur laculis nunc risus sed eu eget quam sodales adipiscing purus erat quisque arcu adipiscing. </p>
无论你想申请试用、评估企业方案，还是讨论 Skills / 插件生态，都建议先把团队背景、
代码栈、交付约束和预期目标告诉我们，后续沟通会更高效。
</p>
</div>
</div>
<div id="w-node-_77c06870-1d0c-5ed5-aea2-38d8dab4dc54-60eb3ba7" className="position-relative---z-index-2">
@@ -36,80 +53,77 @@ export default function HeroSection() {
</div>
<div id="w-node-a2c7d873-a197-1a9e-135d-10f912dd9a40-60eb3ba7" data-w-id="a2c7d873-a197-1a9e-135d-10f912dd9a40" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _430px _100-tablet">
<div className="w-layout-grid contact-links-grid">
<div className="corner-gradient-container">
<a data-w-id="15c69e95-b060-7429-fd6f-a7d6b84c5b9f" href="mailto:info@quantumlab.com" className="contact-v1-link w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="contact-icon-wrapper">
<div style={{"width": "0%", "height": "100%"}} className="contact-icon-bg">
{HERO_CHANNELS.map((channel) => {
const isExternal = channel.href.startsWith("http")
const content = (
<>
<div className="contact-icon-wrapper">
<div style={{"width": "0%", "height": "100%"}} className="contact-icon-bg">
</div>
{channel.icon === "mail" ? (
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24" fill="none" className="contact-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M0 2H24V4.31556L12.0001 10.861L0 4.31546V2ZM0 6.59364V22H24V6.59373L12.0001 13.1391L0 6.59364Z" fill="currentColor">
</path>
</svg>
) : (
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 33" fill="none" className="contact-icon">
<g clipPath="url(#contact-hero-phone)">
<path fillRule="evenodd" clipRule="evenodd" d="M17.4208 23.0719L19.6275 19.3745L20.2074 18.403L21.2951 18.7137L30.7718 21.4215L31.9775 21.7659L31.8283 23.011L30.907 30.7015L30.7429 32.0718L29.3648 31.9954C24.7899 31.7419 20.2596 30.4521 16.1565 28.1239C13.8427 26.8111 11.6667 25.1692 9.69696 23.1995C7.72725 21.2298 6.08529 19.0538 4.77246 16.74C2.44438 12.6369 1.15446 8.1065 0.901036 3.53162L0.824707 2.1536L2.19504 1.98942L9.8854 1.06812L11.1305 0.918945L11.4751 2.12475L14.1827 11.6014L14.4934 12.6892L13.522 13.269L9.82445 15.4758C10.8063 16.9482 11.9474 18.3468 13.2482 19.6476C14.5492 20.9486 15.9481 22.0899 17.4208 23.0719Z" fill="currentColor">
</path>
</g>
<defs>
<clipPath id="contact-hero-phone">
<rect width="32" height="32" fill="white" transform="translate(0 0.5)" />
</clipPath>
</defs>
</svg>
)}
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24" fill="none" className="contact-icon">
<path fillRule="evenodd" clipRule="evenodd" d="M0 2H24V4.31556L12.0001 10.861L0 4.31546V2ZM0 6.59364V22H24V6.59373L12.0001 13.1391L0 6.59364Z" fill="currentColor">
</path>
</svg>
</div>
<div className="contact-v1-link-content">
<div>Email address</div>
<div className="mg-top-5x-extra-small">
<div className="display-2 medium text-titles">info@quantumlab.com</div>
<div className="contact-v1-link-content">
<div>{channel.title}</div>
<div className="mg-top-5x-extra-small">
<div className="display-2 medium text-titles">{channel.headline}</div>
</div>
<div className="mg-top-5x-extra-small">
<p>{channel.description}</p>
</div>
</div>
<div className="bottom-right-button-wrapper">
<div className="icon-button">
<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">
</path>
</svg>
</div>
</div>
</>
)
return (
<div key={channel.title} className={`corner-gradient-container${channel.icon === "phone" ? " row" : ""}`}>
{isExternal ? (
<a data-w-id={`contact-channel-${channel.title}`} href={channel.href} className="contact-v1-link w-inline-block" target="_blank" rel="noopener noreferrer">
{content}
</a>
) : (
<Link href={channel.href} className="contact-v1-link w-inline-block">
{content}
</Link>
)}
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
</div>
</div>
<div className="bottom-right-button-wrapper">
<div className="icon-button">
<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">
</path>
</svg>
</div>
</div>
</a>
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
</div>
</div>
<div className="corner-gradient-container row">
<a data-w-id="4e3cabf1-a0a7-6659-c002-9e212a09258e" href="tel:(123)456-7890" className="contact-v1-link w-inline-block" target="_blank" rel="noopener noreferrer">
<div className="contact-icon-wrapper">
<div style={{"width": "0%", "height": "100%"}} className="contact-icon-bg">
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 33" fill="none" className="contact-icon">
<g clipPath="url(#clip0_16077_4034)">
<path fillRule="evenodd" clipRule="evenodd" d="M17.4208 23.0719L19.6275 19.3745L20.2074 18.403L21.2951 18.7137L30.7718 21.4215L31.9775 21.7659L31.8283 23.011L30.907 30.7015L30.7429 32.0718L29.3648 31.9954C24.7899 31.7419 20.2596 30.4521 16.1565 28.1239C13.8427 26.8111 11.6667 25.1692 9.69696 23.1995C7.72725 21.2298 6.08529 19.0538 4.77246 16.74C2.44438 12.6369 1.15446 8.1065 0.901036 3.53162L0.824707 2.1536L2.19504 1.98942L9.8854 1.06812L11.1305 0.918945L11.4751 2.12475L14.1827 11.6014L14.4934 12.6892L13.522 13.269L9.82445 15.4758C10.8063 16.9482 11.9474 18.3468 13.2482 19.6476C14.5492 20.9486 15.9481 22.0899 17.4208 23.0719Z" fill="currentColor">
</path>
</g>
</svg>
</div>
<div className="contact-v1-link-content">
<div>Phone number</div>
<div className="mg-top-5x-extra-small">
<div className="display-2 medium text-titles">(123) 456-7890</div>
</div>
</div>
<div className="bottom-right-button-wrapper">
<div className="icon-button">
<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">
</path>
</svg>
</div>
</div>
</a>
<div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
</div>
<div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
</div>
</div>
</div>
)
})}
</div>
</div>
</div>
components/home/BlogPreviewSection.tsx
+41 -100
View File
@@ -1,27 +1,26 @@
import Image from "next/image"
import Link from "next/link"
import { BLOG_POSTS } from "@/lib/blog-data"
export default function BlogPreviewSection() {
const featured = BLOG_POSTS.slice(0, 2)
return (
<section className="section overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="b227046f-7b8d-96be-04ed-4ad8f3500f81" style={{"opacity": "0", "filter": "blur(8px)"}} className="title-left-content-right">
<div className="inner-container _480px">
<div className="subtitle">
</div>
<div className="subtitle">Insights</div>
<div className="mg-top-4x-extra-small">
<h2>
Our latest news & articles </h2>
<h2>把产品判断写成文章，而不是散落在对话里</h2>
</div>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quis suspendisse nulla. </p>
<p>这些内容围绕 DAL Code 的产品隐喻、Agent 执行、多模型路由和 Skills 平台展开。</p>
</div>
</div>
<Link id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" href="/blog" className="primary-button w-inline-block">
<div className="button-content">
<div>
See all articles</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">
@@ -38,106 +37,48 @@ export default function BlogPreviewSection() {
<div className="mg-top-regular">
<div data-w-id="f1b0018b-51d6-aaa6-2d43-c2ee184868a3" style={{"opacity": "0", "filter": "blur(8px)"}} className="w-dyn-list">
<div role="list" className="w-dyn-items">
<div role="listitem" className="flex-item w-dyn-item">
<div className="blog-featured-v1-wrapper">
<div className="border-wrapper">
<Link href="/blog-posts/ai-powered-predictive-models-and-their-impact-across-industries" className="blog-card-v1 w-inline-block">
<div className="blog-v1-image-wrapper">
<Image alt="AI-powAI-powered predictive models and their impact across industries" src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3b39/68a6e7e2a643b738b2cb06fc_ai-powered-predictive-models-and-their-impact-thumbnail-quantum-webflow-template.png" sizes="(max-width: 767px) 100vw, (max-width: 991px) 95vw, 939.96533203125px" className="image" fill style={{ objectFit: "cover" }} />
</div>
<div className="blog-v1-content">
<div className="inner-container _420px">
<h3 className="display-6">AI-powered predictive models and their impact across industries </h3>
<div className="mg-top-4x-extra-small">
<p className="text-paragraph">
ipsum dolor sit amet consectetur sit mi lacus quis vitae sed pellentesque libero ultricies neque. </p>
{featured.map((post) => (
<div key={post.slug} role="listitem" className="flex-item w-dyn-item">
<div className="blog-featured-v1-wrapper">
<div className="border-wrapper">
<Link href={`/blog-posts/${post.slug}`} className="blog-card-v1 w-inline-block">
<div className="blog-v1-image-wrapper">
<Image alt={post.imageAlt} src={post.image} sizes="(max-width: 767px) 100vw, (max-width: 991px) 95vw, 939.96533203125px" className="image" fill style={{ objectFit: "cover" }} />
</div>
<div className="blog-v1-content">
<div className="inner-container _420px">
<h3 className="display-6">{post.title}</h3>
<div className="mg-top-4x-extra-small">
<p className="text-paragraph">{post.excerpt}</p>
</div>
<div className="mg-top-3x-extra-small">
<div className="blog-details-wrapper">
<div className="item-details">{post.date}</div>
<div className="item-details-divider">&middot;</div>
<div className="item-details">{post.category}</div>
</div>
</div>
</div>
<div className="mg-top-3x-extra-small">
<div className="blog-details-wrapper">
<div className="item-details">
, 2025 </div>
<div className="item-details-divider">
</div>
<div className="item-details">
</div>
<div className="bottom-right-button-wrapper">
<div className="icon-button">
<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="icon-button-bg" />
</div>
</div>
</div>
<div className="bottom-right-button-wrapper">
<div className="icon-button">
<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">
</path>
</svg>
<div className="icon-button-bg">
</div>
</div>
</div>
</div>
</Link>
</div>
<div data-wf--corner-gradient-outline--variant="base" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal top-left">
</Link>
</div>
<div className="corner-gradient-horizontal bottom-left">
</div>
<div className="corner-gradient-horizontal top-right">
</div>
<div className="corner-gradient-horizontal bottom-right">
<div data-wf--corner-gradient-outline--variant="base" 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>
<div role="listitem" className="flex-item w-dyn-item">
<div className="blog-featured-v1-wrapper">
<div className="border-wrapper">
<Link href="/blog-posts/how-ai-is-shaping-the-future-of-healthcare-and-medicine" className="blog-card-v1 w-inline-block">
<div className="blog-v1-image-wrapper">
<Image alt="How AI How AI is shaping the future of healthcare and medicine" src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3b39/68a6e7c24025d4081cbfa426_how-ai-is-shaping-the-future-thumbnail-quantum-webflow-template.png" sizes="(max-width: 767px) 100vw, (max-width: 991px) 95vw, 939.96533203125px" className="image" fill style={{ objectFit: "cover" }} />
</div>
<div className="blog-v1-content">
<div className="inner-container _420px">
<h3 className="display-6">How AI is shaping the future of healthcare and medicine </h3>
<div className="mg-top-4x-extra-small">
<p className="text-paragraph">
ipsum dolor sit amet consectetur sit mi lacus quis vitae sed pellentesque libero ultricies neque. </p>
</div>
<div className="mg-top-3x-extra-small">
<div className="blog-details-wrapper">
<div className="item-details">
, 2025 </div>
<div className="item-details-divider">
</div>
<div className="item-details">
Applications</div>
</div>
</div>
</div>
<div className="bottom-right-button-wrapper">
<div className="icon-button">
<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">
</path>
</svg>
<div className="icon-button-bg">
</div>
</div>
</div>
</div>
</Link>
</div>
<div data-wf--corner-gradient-outline--variant="base" className="corner-gradient-wrapper">
<div className="corner-gradient-horizontal top-left">
</div>
<div className="corner-gradient-horizontal bottom-left">
</div>
<div className="corner-gradient-horizontal top-right">
</div>
<div className="corner-gradient-horizontal bottom-right">
</div>
</div>
</div>
</div>
))}
</div>
</div>
</div>
components/home/CtaSection.tsx
+6 -7
View File
@@ -6,21 +6,20 @@ export default function CtaSection() {
<section className="cta-section v1">
<div className="w-layout-blockcontainer container-default position-relative---z-index-1 w-container">
<div className="inner-container _430px">
<div className="subtitle">Get in touch</div>
<div className="subtitle">Next Step</div>
<div className="mg-top-3x-extra-small">
<h2 className="text-titles-dm">
Join our team that is shaping the next era of intelligence </h2>
<h2 className="text-titles-dm">把模糊想法交给 DAL Code，先从一次清晰的需求采访开始</h2>
</div>
<div className="mg-top-4x-extra-small">
<p className="text-paragraph-dm">
ipsum dolor sit amet consectetur nec quis suspendisse nulla amet viverra tortor pharetra mauris a maecenas habitant est mattis. </p>
这版官网展示的是产品方法论、核心能力和建设方向。下一步最适合的是拉一次产品场景沟通，确认你的团队到底需要 Mission Mode、私有化还是多模型路由。
</p>
</div>
<div className="mg-top-2x-extra-small">
<div className="buttons-row left">
<Link id="w-node-_83c75c2f-9f22-4125-8dc1-2c204e7d3592-4e7d3592" href="/careers" className="secondary-button w-inline-block">
<Link id="w-node-_83c75c2f-9f22-4125-8dc1-2c204e7d3592-4e7d3592" href="/contact" className="secondary-button w-inline-block">
<div className="button-content">
<div>
Join our team</div>
<div>联系团队</div>
<div className="button-icon-wrapper secondary">
<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">
components/home/HeroSection.tsx
+64 -105
View File
@@ -1,7 +1,6 @@
import LottiePlayer from "@/components/LottiePlayer"
import Image from "next/image"
import Link from "next/link"
import VideoLightbox from "@/components/VideoLightbox"
import LottiePlayer from "@/components/LottiePlayer"
export default function HeroSection() {
return (
@@ -10,28 +9,26 @@ export default function HeroSection() {
<div className="w-layout-grid hero-v1-grid">
<div className="position-relative---z-index-1">
<div className="position-relative---z-index-1">
<div data-w-id="7939bd8a-3226-7306-66d9-84e6bb7ffc0a" style={{"opacity": "0", "filter": "blur(8px)"}} className="inner-container _480px _100-tablet">
<h1>
The future beyond human intelligence </h1>
<div data-w-id="7939bd8a-3226-7306-66d9-84e6bb7ffc0a" style={{ opacity: "0", filter: "blur(8px)" }} className="inner-container _480px _100-tablet">
<div className="subtitle">DAL Code by DeepAILab</div>
<h1>让 AI 先把需求问清楚，再把它变成代码</h1>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur convallis ut et in id enim tempus quis amet consequat ut rhoncus morbi ullamcorper faucibus in natoque. </p>
DAL Code 不是另一个只会接 prompt 的 AI IDE。
它把 Intent Capture、Mission Mode、Smart Routing 和可审批的工程执行组合成一条完整工作流。
</p>
</div>
<div className="mg-top-2x-extra-small">
<div className="buttons-row left">
<Link id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" href="#about-us" className="primary-button w-inline-block">
<Link href="/about" className="primary-button w-inline-block">
<div className="button-content">
<div>
About our company</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">
</path>
<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>
<div className="button-icon-bg-inside">
</div>
<div className="button-icon-bg" />
<div className="button-icon-bg-inside" />
</div>
</div>
</Link>
@@ -39,116 +36,78 @@ export default function HeroSection() {
</div>
</div>
</div>
<div data-w-id="f313e881-ebc1-d314-e333-4417f945cb80" style={{"opacity": "0", "filter": "blur(8px)"}} className="hero-v1-bg-wrapper">
<div data-w-id="f313e881-ebc1-d314-e333-4417f945cb80" style={{ opacity: "0", filter: "blur(8px)" }} className="hero-v1-bg-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 381 382" fill="none">
<rect x="0.509766" y="305" width={76} height={76} stroke="currentColor">
</rect>
<rect x="0.509766" y="229" width={76} height={76} stroke="currentColor">
</rect>
<rect x="0.509766" y="153" width={76} height={76} stroke="currentColor">
</rect>
<rect x="0.509766" y="77" width={76} height={76} stroke="currentColor">
</rect>
<rect x="0.509766" y="1" width={76} height={76} stroke="currentColor">
</rect>
<rect x="76.5098" y="305" width={76} height={76} stroke="currentColor">
</rect>
<rect x="76.5098" y="229" width={76} height={76} stroke="currentColor">
</rect>
<rect x="76.5098" y="153" width={76} height={76} stroke="currentColor">
</rect>
<rect x="76.5098" y="77" width={76} height={76} stroke="currentColor">
</rect>
<rect x="76.5098" y="1" width={76} height={76} stroke="currentColor">
</rect>
<rect x="152.51" y="305" width={76} height={76} stroke="currentColor">
</rect>
<rect x="152.51" y="229" width={76} height={76} stroke="currentColor">
</rect>
<rect x="152.51" y="153" width={76} height={76} stroke="currentColor">
</rect>
<rect x="152.51" y="77" width={76} height={76} stroke="currentColor">
</rect>
<rect x="152.51" y="1" width={76} height={76} stroke="currentColor">
</rect>
<rect x="228.51" y="305" width={76} height={76} stroke="currentColor">
</rect>
<rect x="228.51" y="229" width={76} height={76} stroke="currentColor">
</rect>
<rect x="228.51" y="153" width={76} height={76} stroke="currentColor">
</rect>
<rect x="228.51" y="77" width={76} height={76} stroke="currentColor">
</rect>
<rect x="228.51" y="1" width={76} height={76} stroke="currentColor">
</rect>
<rect x="304.51" y="305" width={76} height={76} stroke="currentColor">
</rect>
<rect x="304.51" y="229" width={76} height={76} stroke="currentColor">
</rect>
<rect x="304.51" y="153" width={76} height={76} stroke="currentColor">
</rect>
<rect x="304.51" y="77" width={76} height={76} stroke="currentColor">
</rect>
<rect x="304.51" y="1" width={76} height={76} stroke="currentColor">
</rect>
<rect x="0.509766" y="305" width={76} height={76} stroke="currentColor" />
<rect x="0.509766" y="229" width={76} height={76} stroke="currentColor" />
<rect x="0.509766" y="153" width={76} height={76} stroke="currentColor" />
<rect x="0.509766" y="77" width={76} height={76} stroke="currentColor" />
<rect x="0.509766" y="1" width={76} height={76} stroke="currentColor" />
<rect x="76.5098" y="305" width={76} height={76} stroke="currentColor" />
<rect x="76.5098" y="229" width={76} height={76} stroke="currentColor" />
<rect x="76.5098" y="153" width={76} height={76} stroke="currentColor" />
<rect x="76.5098" y="77" width={76} height={76} stroke="currentColor" />
<rect x="76.5098" y="1" width={76} height={76} stroke="currentColor" />
<rect x="152.51" y="305" width={76} height={76} stroke="currentColor" />
<rect x="152.51" y="229" width={76} height={76} stroke="currentColor" />
<rect x="152.51" y="153" width={76} height={76} stroke="currentColor" />
<rect x="152.51" y="77" width={76} height={76} stroke="currentColor" />
<rect x="152.51" y="1" width={76} height={76} stroke="currentColor" />
<rect x="228.51" y="305" width={76} height={76} stroke="currentColor" />
<rect x="228.51" y="229" width={76} height={76} stroke="currentColor" />
<rect x="228.51" y="153" width={76} height={76} stroke="currentColor" />
<rect x="228.51" y="77" width={76} height={76} stroke="currentColor" />
<rect x="228.51" y="1" width={76} height={76} stroke="currentColor" />
<rect x="304.51" y="305" width={76} height={76} stroke="currentColor" />
<rect x="304.51" y="229" width={76} height={76} stroke="currentColor" />
<rect x="304.51" y="153" width={76} height={76} stroke="currentColor" />
<rect x="304.51" y="77" width={76} height={76} stroke="currentColor" />
<rect x="304.51" y="1" width={76} height={76} stroke="currentColor" />
</svg>
<div className="hero-v1-bg-gradient">
</div>
<div className="hero-v1-bg-gradient" />
</div>
</div>
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d1a7d9c54a9b73191bb531_hero-v1-animation-quantum-webflow-template.json" className="hero-v1-lottie" loop autoplay />
</div>
<div id="about-us" data-w-id="bce231a0-6e79-c8d3-8883-56d99499b3ad" style={{"opacity": "0", "filter": "blur(8px)"}} className="about-section-wrapper">
<div id="about-us" data-w-id="bce231a0-6e79-c8d3-8883-56d99499b3ad" style={{ opacity: "0", filter: "blur(8px)" }} className="about-section-wrapper">
<div className="about-section-top-content">
<div className="subtitle">About us</div>
<div className="subtitle">Why DAL Code</div>
<div className="mg-top-small">
<p className="about-text">
Introducing QuantumLab: Pioneering the Future of AI Research. Engineered to push the limits of artificial intelligence, Quantum identifies emerging trends before they disrupt the industry. Choose Research Mode for in-depth, data-driven analysis or Development Mode for groundbreaking algorithm testing. Built with advanced AI systems and state-of-the-art computational power for unparalleled performance.
<br />
Crafted by top-tier experts and fueled by global collaboration, Quantum is not just a lab—it&apos;s the core of tomorrow&apos;s innovations, shaping the future one breakthrough at a time.
传统 AI 编程工具默认用户已经知道怎么提技术需求，所以产品重点落在补全、改代码和聊天上。
DAL Code 把核心交互改成另一件事：让 AI 主动采访用户，把模糊业务目标变成结构化工程任务。
然后再通过 Agent、Skills、多模型路由和上下文压缩，把代码、测试、文档和审批一起交付出来。
</p>
</div>
</div>
<div className="about-section-bottom-content">
<VideoLightbox
thumbnailSrc="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a612636043d8e5dcb04ad0_about-us-video-thumbnail-quantum-webflow-template.jpg"
videoUrl="https://www.youtube.com/watch?v=Ojiv9Smi4XE"
className="lightbox-link w-inline-block w-lightbox"
>
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a612636043d8e5dcb04ad0_about-us-video-thumbnail-quantum-webflow-template.jpg" width={660} height={372} alt="About Us Thumbnail" className="lightbox-thumbnail" />
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 49 49" fill="none" className="play-button">
<path d="M33.2598 24.4998L20.5863 31.8168L20.5863 17.1827L33.2598 24.4998Z" fill="currentColor" />
</svg>
</VideoLightbox>
<Link href="/about" className="lightbox-link w-inline-block">
<Image
src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a612636043d8e5dcb04ad0_about-us-video-thumbnail-quantum-webflow-template.jpg"
width={660}
height={372}
alt="DAL Code product overview"
className="lightbox-thumbnail"
/>
</Link>
<div className="position-relative---z-index-1">
<div className="hidden-on-mobile-portrait">
<div className="display-3 medium text-titles">
Watch video</div>
<div className="display-3 medium text-titles">Intent to build</div>
</div>
</div>
<div className="about-section-bg">
<svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 507 659" fill="none">
<path d="M0 535L135.811 535" stroke="currentColor">
</path>
<path d="M135.811 0L135.811 535" stroke="currentColor">
</path>
<path d="M506.811 535L355.811 535" stroke="currentColor">
</path>
<path d="M0 658L135.811 658" stroke="currentColor">
</path>
<path d="M506.811 658L355.811 658" stroke="currentColor">
</path>
<path d="M136 535L356 535" stroke="currentColor">
</path>
<path d="M136 658L356 658" stroke="currentColor">
</path>
<path d="M0 535L135.811 535" stroke="currentColor" />
<path d="M135.811 0L135.811 535" stroke="currentColor" />
<path d="M506.811 535L355.811 535" stroke="currentColor" />
<path d="M0 658L135.811 658" stroke="currentColor" />
<path d="M506.811 658L355.811 658" stroke="currentColor" />
<path d="M136 535L356 535" stroke="currentColor" />
<path d="M136 658L356 658" stroke="currentColor" />
</svg>
<div className="about-section-gradient top">
</div>
<div className="about-section-gradient left">
</div>
<div className="about-section-gradient right">
</div>
<div className="about-section-gradient top" />
<div className="about-section-gradient left" />
<div className="about-section-gradient right" />
</div>
</div>
</div>
components/home/IntegrationsSection.tsx
+18 -334
View File
@@ -1,353 +1,37 @@
import Image from "next/image"
import Link from "next/link"
import { INTEGRATION_ITEMS } from "@/lib/site-content"
const MARQUEE_ROWS = Array.from({ length: 3 }, () => INTEGRATION_ITEMS)
export default function IntegrationsSection() {
return (
<section className="section-small bg-neutral overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="ee652702-222a-0ca5-2508-17b1a107582a" style={{"opacity": "0", "filter": "blur(8px)"}} className="title-left-content-right">
<div data-w-id="ee652702-222a-0ca5-2508-17b1a107582a" style={{ opacity: "0", filter: "blur(8px)" }} className="title-left-content-right">
<div className="inner-container _400px _100-tablet">
<div className="subtitle">Integrations</div>
<div className="subtitle">Work Surfaces</div>
<div className="mg-top-4x-extra-small">
<h2>
AI engineered to integrate across every platform </h2>
<h2>一个产品里，接住从需求澄清到工程交付的整条链路</h2>
</div>
</div>
<div className="inner-container _400px _100-tablet">
<p>
ipsum dolor sit amet consectetur scelerisque quam dui dictumst suspendisse iaculis ac gravida venenatis mattis sed. </p>
DAL Code 把 Desktop IDE、Web Workspace、Mobile Review、Mission Planner、RAG、Tools、Diff 审批和企业治理放到同一条体验链上。
</p>
</div>
</div>
<div className="mg-top-regular">
<div data-w-id="f6559b35-9557-2504-f076-3a36fa5775a3" style={{"opacity": "0", "filter": "blur(8px)"}} className="integrations-marquee-wrapper marquee-hover-stop" {...{"tr-marquee-speed":"50","tr-marquee-element":"component","tr-marquee-scrolldirection":"true","tr-marquee-scrollscrub":"false"}}>
<div className="integrations-marquee marquee-scroll-item">
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd871d459c0979566_integration-icon-01-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf5972224012a489b_integration-icon-02-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c26ffe1a8726e9533_integration-icon-03-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf394ef82f934055b_integration-icon-04-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c880d199c46c914ff_integration-icon-05-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70c337055b4648809b_integration-icon-06-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70e3d7d6153e132c82_integration-icon-07-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70d20bb145ee19163a_integration-icon-08-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e0bb9fa69c599d6b3_integration-icon-10-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70a151641726e87b52_integration-icon-11-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e925ff15bf5fa0586_integration-icon-12-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6de0050ea1d7414790_integration-icon-13-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd711092b9d58a062_integration-icon-14-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6d09ed29d4a9cfd6ed_integration-icon-15-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68ee6c592c38ae8672ba037d_integration-icon-16-quantum-webflow-template 1.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
</div>
<div className="integrations-marquee marquee-scroll-item">
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd871d459c0979566_integration-icon-01-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf5972224012a489b_integration-icon-02-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c26ffe1a8726e9533_integration-icon-03-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf394ef82f934055b_integration-icon-04-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c880d199c46c914ff_integration-icon-05-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70c337055b4648809b_integration-icon-06-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70e3d7d6153e132c82_integration-icon-07-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70d20bb145ee19163a_integration-icon-08-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e0bb9fa69c599d6b3_integration-icon-10-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70a151641726e87b52_integration-icon-11-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e925ff15bf5fa0586_integration-icon-12-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6de0050ea1d7414790_integration-icon-13-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd711092b9d58a062_integration-icon-14-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6d09ed29d4a9cfd6ed_integration-icon-15-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68ee6c592c38ae8672ba037d_integration-icon-16-quantum-webflow-template 1.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
</div>
<div className="integrations-marquee marquee-scroll-item">
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd871d459c0979566_integration-icon-01-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf5972224012a489b_integration-icon-02-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c26ffe1a8726e9533_integration-icon-03-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf394ef82f934055b_integration-icon-04-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c880d199c46c914ff_integration-icon-05-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70c337055b4648809b_integration-icon-06-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70e3d7d6153e132c82_integration-icon-07-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70d20bb145ee19163a_integration-icon-08-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e0bb9fa69c599d6b3_integration-icon-10-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70a151641726e87b52_integration-icon-11-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e925ff15bf5fa0586_integration-icon-12-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6de0050ea1d7414790_integration-icon-13-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd711092b9d58a062_integration-icon-14-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6d09ed29d4a9cfd6ed_integration-icon-15-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68ee6c592c38ae8672ba037d_integration-icon-16-quantum-webflow-template 1.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
</div>
<div className="integrations-marquee marquee-scroll-item">
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd871d459c0979566_integration-icon-01-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf5972224012a489b_integration-icon-02-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c26ffe1a8726e9533_integration-icon-03-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6cf394ef82f934055b_integration-icon-04-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6c880d199c46c914ff_integration-icon-05-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70c337055b4648809b_integration-icon-06-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70e3d7d6153e132c82_integration-icon-07-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70d20bb145ee19163a_integration-icon-08-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e0bb9fa69c599d6b3_integration-icon-10-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b70a151641726e87b52_integration-icon-11-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6e925ff15bf5fa0586_integration-icon-12-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6de0050ea1d7414790_integration-icon-13-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6dd711092b9d58a062_integration-icon-14-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68cd8b6d09ed29d4a9cfd6ed_integration-icon-15-quantum-webflow-template.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
<a href="#" className="integration-marquee-item w-inline-block">
<Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68ee6c592c38ae8672ba037d_integration-icon-16-quantum-webflow-template 1.svg" width={94} height={94} alt="Integration Icon - Quantum | Webflow Template" style={{"filter": "invert(0%)"}} className="integration-marquee-item-image" />
<div style={{"width": "0%", "height": "100%"}} className="integration-marquee-item-bg">
</div>
</a>
</div>
</div>
</div>
<div className="mg-top-regular">
<div data-w-id="c8f34226-476e-bf6e-d16d-132f8960d38b" style={{"opacity": "0", "filter": "blur(8px)"}} className="buttons-row">
<Link id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" href="/contact" className="primary-button w-inline-block">
<div className="button-content">
<div>
See all Apps</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">
</path>
</svg>
<div className="button-icon-bg">
</div>
<div className="button-icon-bg-inside">
</div>
</div>
<div data-w-id="f6559b35-9557-2504-f076-3a36fa5775a3" style={{ opacity: "0", filter: "blur(8px)" }} className="integrations-marquee-wrapper marquee-hover-stop" {...{ "tr-marquee-speed": "50", "tr-marquee-element": "component", "tr-marquee-scrolldirection": "true", "tr-marquee-scrollscrub": "false" }}>
{MARQUEE_ROWS.map((items, rowIndex) => (
<div key={rowIndex} className="integrations-marquee marquee-scroll-item">
{items.map((item) => (
<a key={`${rowIndex}-${item.label}`} href="/about" className="integration-marquee-item w-inline-block">
<Image src={item.icon} width={94} height={94} alt={item.label} style={{ filter: "invert(0%)" }} className="integration-marquee-item-image" />
<div style={{ width: "0%", height: "100%" }} className="integration-marquee-item-bg" />
</a>
))}
</div>
</Link>
))}
</div>
</div>
</div>
components/home/PrinciplesSection.tsx
+14 -35
View File
@@ -1,55 +1,35 @@
import LottiePlayer from "@/components/LottiePlayer"
import Link from "next/link"
import { HOME_PRINCIPLES } from "@/lib/site-content"
export default function PrinciplesSection() {
return (
<section className="section overflow-hidden">
<div className="w-layout-blockcontainer container-default w-container">
<div data-w-id="372e7f28-67fd-5f5e-6061-256f8b7997a5" style={{"opacity": "0", "filter": "blur(8px)"}} className="text-center">
<div className="subtitle">Core principles</div>
<div className="subtitle">Core Principles</div>
<div className="mg-top-4x-extra-small">
<h2>
Architecting tomorrow's mind </h2>
<h2>DAL Code 最值得被记住的三件事</h2>
</div>
<div className="mg-top-4x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quis suspendisse nulla amet viverra tortor pharetra. </p>
<p>如果这三件事讲不清楚，DAL Code 就会被误解成另一个模板化 AI IDE。</p>
</div>
</div>
<div className="mg-top-large">
<div data-w-id="3f196c4e-8732-f3ef-e6a2-04398a5349e2" style={{"opacity": "0", "filter": "blur(8px)"}} className="corner-gradient-container">
<div className="border-wrapper">
<div className="w-layout-grid principles-grid">
<div className="card principles-card">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d1d66f46dd336c7d633316_velocity-quantum-webflow-template-top-to-bottom.json" className="max-width-280px-mbl" loop autoplay />
<div>
<h3 className="display-4">Velocity</h3>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quuis suspendisse nulla amet viverra tortor. </p>
{HOME_PRINCIPLES.map((item) => (
<div key={item.title} className="card principles-card">
<LottiePlayer src={item.animation} className="max-width-280px-mbl" loop autoplay />
<div>
<h3 className="display-4">{item.title}</h3>
<div className="mg-top-5x-extra-small">
<p>{item.description}</p>
</div>
</div>
</div>
</div>
<div className="card principles-card">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d1d6cf4cfbc189da50f80b_generality-quantum-webflow-template-top-to-bottom.json" className="max-width-280px-mbl" loop autoplay />
<div>
<h3 className="display-4">Generality</h3>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quuis suspendisse nulla amet viverra tortor. </p>
</div>
</div>
</div>
<div className="card principles-card">
<LottiePlayer src="/assets/cdn-prod-website-files-com/68a342b7066c56fa60eb3af1/68d1d6a76e480413794c2aa3_intelect-quantum-webflow-template-top-to-bottom.json" className="max-width-280px-mbl" loop autoplay />
<div>
<h3 className="display-4">Intellect</h3>
<div className="mg-top-5x-extra-small">
<p>
ipsum dolor sit amet consectetur nec quuis suspendisse nulla amet viverra tortor. </p>
</div>
</div>
</div>
))}
</div>
</div>
<div data-wf--corner-gradient-outline--variant="base" className="corner-gradient-wrapper">
@@ -76,8 +56,7 @@ export default function PrinciplesSection() {
<div data-w-id="bffe9e02-73d6-d2d3-239d-bbcb4bd7d83d" style={{"opacity": "0", "filter": "blur(8px)"}} className="buttons-row">
<Link id="w-node-_99805214-dd54-e7f3-2549-05c0df1040fb-df1040fb" href="/about" className="primary-button w-inline-block">
<div className="button-content">
<div>
About our company</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">