checkpoint: before i18n implementation
This commit is contained in:
Leon-in
@@ -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" }}>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user