Commit 4e4217d1 authored by xuchentao's avatar xuchentao

优化联系我们页面:抖音矩阵改抖音账号,移除hero右侧银印章及几何装饰,删除到访提示文案

parent c55c6b1d
Pipeline #419 failed with stages
in 0 seconds
......@@ -3,8 +3,8 @@ import Base from "../../layouts/Base.astro"; import Header from "../../component
const title = `联系我们|${site.brand.name}`; const description = "联系银妆银饰,咨询足银首饰、私人定制、旧银加工、DIY编织、门店与售后服务。全国客服400-811-3922。";
---
<Base {title} {description}><Header /><main id="main-content">
<section class="contact-hero"><div class="container contact-hero__grid"><div data-reveal><div class="breadcrumb"><a href="/">首页</a> / 联系我们</div><div class="eyebrow eyebrow--gold"><span></span>CONTACT INZUNG</div><h1>{site.contact.heading}</h1><p>{site.contact.intro}</p><a class="button button--gold" href="tel:4008113922">立即致电</a></div><div class="contact-seal" data-reveal><strong>银</strong><span>以银为信<br/>以心相见</span></div></div></section>
<section class="section-pad section-cream"><div class="container contact-grid"><article data-reveal><span>01</span><h2>全国客服热线</h2><a class="contact-big-link" href="tel:4008113922">{site.contact.phone}</a><p>产品咨询、定制沟通、门店与售后服务</p></article><article data-reveal><span>02</span><h2>公司地址</h2><address>{site.contact.address}</address><p>建议到访前先致电确认接待安排</p></article><article data-reveal><span>03</span><h2>抖音矩阵</h2>{site.contact.douyin.map((name) => <strong class="social-name">{name}</strong>)}<p>关注产品上新与门店内容</p></article><article data-reveal><span>04</span><h2>官方网站</h2><a class="contact-big-link contact-big-link--small" href="https://www.inzung.cn">{site.contact.website}</a><p>银妆银饰官方信息窗口</p></article></div></section>
<section class="contact-hero"><div class="container contact-hero__grid"><div data-reveal><div class="breadcrumb"><a href="/">首页</a> / 联系我们</div><div class="eyebrow eyebrow--gold"><span></span>CONTACT INZUNG</div><h1>{site.contact.heading}</h1><p>{site.contact.intro}</p><a class="button button--gold" href="tel:4008113922">立即致电</a></div></div></section>
<section class="section-pad section-cream"><div class="container contact-grid"><article data-reveal><span>01</span><h2>全国客服热线</h2><a class="contact-big-link" href="tel:4008113922">{site.contact.phone}</a><p>产品咨询、定制沟通、门店与售后服务</p></article><article data-reveal><span>02</span><h2>公司地址</h2><address>{site.contact.address}</address></article><article data-reveal><span>03</span><h2>抖音账号</h2>{site.contact.douyin.map((name) => <strong class="social-name">{name}</strong>)}<p>关注产品上新与门店内容</p></article><article data-reveal><span>04</span><h2>官方网站</h2><a class="contact-big-link contact-big-link--small" href="https://www.inzung.cn">{site.contact.website}</a><p>银妆银饰官方信息窗口</p></article></div></section>
<section class="section-pad section-white"><div class="container visit-grid"><div><div class="eyebrow"><span></span>BEFORE YOU VISIT</div><h2>带上一个想法,就可以开始</h2></div><ol><li><span>01</span><div><strong>告诉我们用途</strong><p>自戴、送礼、纪念还是旧银改造</p></div></li><li><span>02</span><div><strong>准备参考信息</strong><p>喜欢的风格、尺寸、文字或图案</p></div></li><li><span>03</span><div><strong>确认预算时间</strong><p>便于顾问给出更合适的材质与工艺建议</p></div></li></ol></div></section>
<section class="contact-bottom"><div class="container"><p>INZUNG · SILVER MADE PERSONAL</p><h2>让银饰成为<br/>你想留住的那一刻</h2><a class="button button--gold" href="tel:4008113922">咨询定制方案</a></div></section>
</main><Footer /></Base>
......@@ -262,16 +262,11 @@ h1, h2, h3 { color: var(--ink); font-family: var(--serif); font-weight: 700; lin
.contact-hero { position: relative; overflow: hidden; background: var(--ink); color: #fff; }
.contact-hero::before { position: absolute; inset: 0; opacity: .12; background-image: radial-gradient(circle at 1px 1px, var(--gold) 1px, transparent 0); background-size: 28px 28px; content: ""; }
.contact-hero__grid { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; min-height: 570px; align-items: center; gap: 80px; padding-block: 80px; }
.contact-hero__grid { position: relative; display: grid; grid-template-columns: 1fr; min-height: 570px; align-items: center; gap: 80px; padding-block: 80px; }
.contact-hero .breadcrumb { color: #9c928a; }
.contact-hero h1 { margin-bottom: 22px; color: #fff; font-size: clamp(55px, 7vw, 92px); }
.contact-hero p { max-width: 660px; color: #d0c7bf; font-size: 17px; }
.contact-hero .button { margin-top: 20px; }
.contact-seal { position: relative; display: grid; width: min(28vw, 330px); aspect-ratio: 1; place-items: center; justify-self: center; border: 1px solid rgba(244,220,132,.42); border-radius: 50%; }
.contact-seal::before, .contact-seal::after { position: absolute; inset: 24px; border: 1px solid rgba(244,220,132,.2); border-radius: 50%; content: ""; }
.contact-seal::after { inset: 48px; }
.contact-seal strong { color: var(--gold); font-family: var(--serif); font-size: 105px; font-weight: 400; }
.contact-seal span { position: absolute; right: -20px; bottom: 40px; padding: 12px 18px; background: var(--primary); color: #fff; font-size: 13px; letter-spacing: .12em; }
.contact-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.contact-grid article { min-height: 260px; padding: 35px; background: #fff; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.contact-grid article > span { color: var(--gold-deep); font-family: var(--serif); }
......@@ -411,7 +406,6 @@ h1, h2, h3 { color: var(--ink); font-family: var(--serif); font-weight: 700; lin
.faq-layout { gap: 45px; }
.faq-layout aside { position: static; }
.contact-hero__grid { gap: 40px; }
.contact-seal { width: 260px; }
.contact-grid { grid-template-columns: 1fr; }
.article-grid { grid-template-columns: 1fr; }
.article-detail-layout { grid-template-columns: 1fr; gap: 20px; padding-top: 45px; }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment