sunct
3c3bf53ae4
- 新增「简记memo」一体化小程序产品原型设计文档 - 新增简记memo完整版UI视觉设计规范和界面细节 - 添加IDEA项目配置文件.gitignore - 创建404页面HTML文件，包含响应式布局和错误提示 - 添加关于页面HTML文件，展示品牌介绍和团队信息 - 实现AES加解密工具函数，支持请求体加密 - 添加用户协议页面基础框架
148 lines
11 KiB
HTML
148 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>关于我们 - 简记memo</title>
|
|
<link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/index.css">
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
html { scroll-behavior: smooth; }
|
|
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background: #f8fafc; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<!-- 公共头部 -->
|
|
<div id="commonHeader"></div>
|
|
|
|
<!-- 页面内容 -->
|
|
<main style="padding: 84px 24px 40px; min-height: calc(100vh - 140px);">
|
|
<div style="max-width: 1000px; margin: 0 auto;">
|
|
<!-- 品牌介绍 -->
|
|
<section style="text-align: center; margin-bottom: 48px;">
|
|
<img id="brandLogo" src="/static/images/logo.png" alt="logo" style="width: 80px; height: 80px; border-radius: 20px; margin: 0 auto 20px; display: block;" onerror="this.style.display='none'; document.getElementById('fallbackLogo').style.display='flex';">
|
|
<div id="fallbackLogo" style="width: 80px; height: 80px; background: linear-gradient(135deg, #4F9EDE 0%, #3A8BC9 100%); border-radius: 20px; display: none; align-items: center; justify-content: center; margin: 0 auto 20px;">
|
|
<span style="font-size: 32px;">📝</span>
|
|
</div>
|
|
<h1 style="font-size: 28px; font-weight: 700; color: #1e293b; margin-bottom: 12px;" id="brandName">简记memo</h1>
|
|
<p style="font-size: 15px; color: #64748b; max-width: 500px; margin: 0 auto;" id="brandDesc">集待办任务、账单记录、心情日记于一体的个人事务管理工具</p>
|
|
</section>
|
|
|
|
<!-- 关于我们 -->
|
|
<section style="background: #fff; border-radius: 16px; padding: 24px; margin-bottom: 20px;">
|
|
<h2 style="font-size: 18px; font-weight: 600; color: #1e293b; margin-bottom: 20px; display: flex; align-items: center;">
|
|
<span style="width: 4px; height: 18px; background: linear-gradient(135deg, #4F9EDE 0%, #3A8BC9 100%); border-radius: 2px; margin-right: 10px;"></span>
|
|
关于我们
|
|
</h2>
|
|
<div style="line-height: 1.8;">
|
|
<p style="font-size: 14px; color: #475569; margin-bottom: 16px;">
|
|
简记memo是一款致力于帮助用户更好地管理个人事务的工具。我们相信，良好的记录习惯能够让生活更加有序，让每一天都变得更有意义。
|
|
</p>
|
|
<p style="font-size: 14px; color: #475569; margin-bottom: 16px;">
|
|
我们的愿景是打造一个简洁、优雅、实用的记录平台，让用户能够轻松记录待办任务、心情变化和收支情况，同时通过成长体系激励用户养成良好的习惯。
|
|
</p>
|
|
<p style="font-size: 14px; color: #475569;">
|
|
团队成员来自不同领域，我们怀着对产品的热爱和对用户体验的追求，不断优化和完善产品，希望能够为用户带来更好的使用体验。
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- 联系我们 -->
|
|
<section style="background: #fff; border-radius: 16px; padding: 24px; margin-bottom: 20px;">
|
|
<h2 style="font-size: 18px; font-weight: 600; color: #1e293b; margin-bottom: 20px; display: flex; align-items: center;">
|
|
<span style="width: 4px; height: 18px; background: linear-gradient(135deg, #4F9EDE 0%, #3A8BC9 100%); border-radius: 2px; margin-right: 10px;"></span>
|
|
联系我们
|
|
</h2>
|
|
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px;">
|
|
<div style="display: flex; align-items: center; gap: 12px;">
|
|
<div style="width: 40px; height: 40px; background: rgba(79, 158, 222, 0.1); border-radius: 10px; display: flex; align-items: center; justify-content: center;">
|
|
<svg style="width: 20px; height: 20px; fill: none; stroke: #4F9EDE;" viewBox="0 0 24 24">
|
|
<path d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<div style="font-size: 14px; color: #64748b;">邮箱</div>
|
|
<div style="font-size: 15px; color: #1e293b;" id="contactEmail">support@jianji-memo.com</div>
|
|
</div>
|
|
</div>
|
|
<div style="display: flex; align-items: center; gap: 12px;">
|
|
<div style="width: 40px; height: 40px; background: rgba(34, 197, 94, 0.1); border-radius: 10px; display: flex; align-items: center; justify-content: center;">
|
|
<svg style="width: 20px; height: 20px; fill: none; stroke: #22c55e;" viewBox="0 0 24 24">
|
|
<path d="M8.691 2.188C3.891 2.188 0 5.476 0 9.53c0 2.212 1.17 4.203 3.002 5.55a.59.59 0 01.213.665l-.39 1.48c-.019.07-.048.141-.048.213 0 .163.13.295.29.295a.326.326 0 00.167-.054l1.903-1.114a.864.864 0 01.717-.098 10.16 10.16 0 002.837.403c4.801 0 8.692-3.287 8.692-7.342 0-4.054-3.891-7.34-8.692-7.34z"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<div style="font-size: 14px; color: #64748b;">微信公众号</div>
|
|
<div style="font-size: 15px; color: #1e293b;" id="contactWechat">简记memo</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- 团队介绍 -->
|
|
<section style="background: #fff; border-radius: 16px; padding: 24px;">
|
|
<h2 style="font-size: 18px; font-weight: 600; color: #1e293b; margin-bottom: 20px; display: flex; align-items: center;">
|
|
<span style="width: 4px; height: 18px; background: linear-gradient(135deg, #4F9EDE 0%, #3A8BC9 100%); border-radius: 2px; margin-right: 10px;"></span>
|
|
团队成员
|
|
</h2>
|
|
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 20px;">
|
|
<div style="text-align: center;">
|
|
<div style="width: 64px; height: 64px; background: linear-gradient(135deg, #4F9EDE 0%, #3A8BC9 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;">
|
|
<span style="font-size: 24px;">👨💻</span>
|
|
</div>
|
|
<div style="font-size: 14px; font-weight: 600; color: #1e293b;">产品经理</div>
|
|
<div style="font-size: 12px; color: #64748b;">负责产品规划和设计</div>
|
|
</div>
|
|
<div style="text-align: center;">
|
|
<div style="width: 64px; height: 64px; background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;">
|
|
<span style="font-size: 24px;">👩💻</span>
|
|
</div>
|
|
<div style="font-size: 14px; font-weight: 600; color: #1e293b;">前端开发</div>
|
|
<div style="font-size: 12px; color: #64748b;">负责界面开发</div>
|
|
</div>
|
|
<div style="text-align: center;">
|
|
<div style="width: 64px; height: 64px; background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;">
|
|
<span style="font-size: 24px;">👨🔧</span>
|
|
</div>
|
|
<div style="font-size: 14px; font-weight: 600; color: #1e293b;">后端开发</div>
|
|
<div style="font-size: 12px; color: #64748b;">负责服务端开发</div>
|
|
</div>
|
|
<div style="text-align: center;">
|
|
<div style="width: 64px; height: 64px; background: linear-gradient(135deg, #ec4899 0%, #db2777 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;">
|
|
<span style="font-size: 24px;">🎨</span>
|
|
</div>
|
|
<div style="font-size: 14px; font-weight: 600; color: #1e293b;">UI设计师</div>
|
|
<div style="font-size: 12px; color: #64748b;">负责界面设计</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- 公共底部 -->
|
|
<div id="commonFooter"></div>
|
|
</div>
|
|
|
|
<script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script>
|
|
<script src="https://unpkg.com/element-ui@2.15.14/lib/index.js"></script>
|
|
<script src="/static/js/config.js"></script>
|
|
<script src="/static/js/common-components.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
document.getElementById('commonHeader').innerHTML = renderCommonHeader('/about');
|
|
document.getElementById('commonFooter').innerHTML = renderCommonFooter();
|
|
initCommonComponents();
|
|
|
|
if (typeof SITE_CONFIG !== 'undefined') {
|
|
document.getElementById('brandName').textContent = SITE_CONFIG.name || '简记memo';
|
|
document.getElementById('brandDesc').textContent = SITE_CONFIG.description || '集待办任务、账单记录、心情日记于一体的个人事务管理工具';
|
|
document.getElementById('contactEmail').textContent = SITE_CONFIG.email || 'support@jianji-memo.com';
|
|
if (SITE_CONFIG.wechat) {
|
|
document.getElementById('contactWechat').textContent = SITE_CONFIG.wechat.name || '简记memo';
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |