139 lines
4.0 KiB
Vue
139 lines
4.0 KiB
Vue
<template>
|
||
<section id="about" class="about">
|
||
<div class="container">
|
||
<div class="about-layout">
|
||
<div class="about-text">
|
||
<div class="tag">关于我们</div>
|
||
<h2 class="section-title" style="margin-top:16px">
|
||
专注 AI 落地<br>深耕企业场景
|
||
</h2>
|
||
<p class="section-sub" style="margin-top:16px">
|
||
北京硅基伙伴科技有限公司，成立于 2019 年，
|
||
总部位于北京。我们由一批来自顶级互联网公司和 AI 研究院的技术专家创立，
|
||
专注于企业 AI 数字化转型技术服务，致力于让先进的 AI 能力真正在企业中落地生根。
|
||
</p>
|
||
<p class="section-sub" style="margin-top:12px; font-size: 15px;">
|
||
我们相信，AI 不应该只是大企业的特权。
|
||
通过我们的产品和服务，让每一家企业都能享受到 AI 带来的生产力革命。
|
||
</p>
|
||
|
||
<div class="team-tags">
|
||
<span v-for="t in teamTags" :key="t">{{ t }}</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="about-cards">
|
||
<div class="about-card" v-for="c in aboutCards" :key="c.title">
|
||
<div class="about-card-icon" v-html="c.icon"></div>
|
||
<h3>{{ c.title }}</h3>
|
||
<p>{{ c.desc }}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
const teamTags = [
|
||
'前阿里巴巴', '前腾讯', '前百度 AI', '清华大学 CS',
|
||
'北京大学', '斯坦福大学', 'IEEE Fellow'
|
||
]
|
||
|
||
const aboutCards = [
|
||
{
|
||
title: '使命',
|
||
desc: '让 AI 成为每家企业的核心竞争力，推动中国企业数字化转型进入智能时代。',
|
||
icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10b981" stroke-width="1.8"><circle cx="12" cy="12" r="10"/><path d="M12 8v4l3 3"/></svg>`,
|
||
},
|
||
{
|
||
title: '愿景',
|
||
desc: '成为中国企业 AI 数字化转型领域最受信赖的技术伙伴，服务超过 10,000 家企业。',
|
||
icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10b981" stroke-width="1.8"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>`,
|
||
},
|
||
{
|
||
title: '价值观',
|
||
desc: '客户成功优先、技术诚实透明、持续创新迭代、共赢长期主义。',
|
||
icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10b981" stroke-width="1.8"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></svg>`,
|
||
},
|
||
]
|
||
</script>
|
||
|
||
<style scoped>
|
||
.about {
|
||
padding: 120px 0;
|
||
background: var(--white);
|
||
}
|
||
.about-layout {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 80px;
|
||
align-items: center;
|
||
}
|
||
.team-tags {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 8px;
|
||
margin-top: 32px;
|
||
}
|
||
.team-tags span {
|
||
padding: 6px 14px;
|
||
background: var(--gray-100);
|
||
border-radius: 50px;
|
||
font-size: 13px;
|
||
font-weight: 600;
|
||
color: var(--gray-600);
|
||
}
|
||
.about-cards {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 16px;
|
||
}
|
||
.about-card {
|
||
display: flex;
|
||
gap: 20px;
|
||
align-items: flex-start;
|
||
background: var(--gray-50);
|
||
border-radius: var(--radius-lg);
|
||
padding: 28px;
|
||
border: 1.5px solid var(--gray-100);
|
||
transition: all .2s;
|
||
}
|
||
.about-card:hover {
|
||
border-color: var(--green-200);
|
||
background: var(--green-50);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
.about-card-icon {
|
||
width: 48px;
|
||
height: 48px;
|
||
background: white;
|
||
border-radius: 14px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
box-shadow: var(--shadow-sm);
|
||
border: 1px solid var(--gray-100);
|
||
}
|
||
.about-card h3 {
|
||
font-size: 16px;
|
||
font-weight: 800;
|
||
color: var(--gray-900);
|
||
letter-spacing: -.02em;
|
||
margin-bottom: 8px;
|
||
}
|
||
.about-card p {
|
||
font-size: 14px;
|
||
color: var(--gray-500);
|
||
line-height: 1.65;
|
||
}
|
||
|
||
@media (max-width: 1024px) {
|
||
.about-layout { grid-template-columns: 1fr; }
|
||
}
|
||
@media (max-width: 640px) {
|
||
.about { padding: 80px 0; }
|
||
}
|
||
</style>
|