469 lines
18 KiB
HTML
469 lines
18 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>情景诗词 - 隐私政策与用户协议</title>
|
||
<style>
|
||
:root {
|
||
--primary: #2563eb;
|
||
--primary-light: #3b82f6;
|
||
--background: #f8fafc;
|
||
--text: #0f172a;
|
||
--text-light: #64748b;
|
||
--border: #e2e8f0;
|
||
--card-bg: #ffffff;
|
||
--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
||
--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
|
||
--radius-sm: 4px;
|
||
--radius-md: 8px;
|
||
--radius-lg: 12px;
|
||
}
|
||
|
||
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
|
||
background-color: var(--background);
|
||
color: var(--text);
|
||
line-height: 1.6;
|
||
padding: 0;
|
||
margin: 0;
|
||
}
|
||
|
||
.container {
|
||
max-width: 900px;
|
||
margin: 0 auto;
|
||
padding: 20px 16px;
|
||
}
|
||
|
||
header {
|
||
background: linear-gradient(135deg, var(--primary), var(--primary-light));
|
||
color: white;
|
||
padding: 40px 20px;
|
||
text-align: center;
|
||
box-shadow: var(--shadow-md);
|
||
}
|
||
|
||
header h1 {
|
||
font-size: 32px;
|
||
font-weight: 700;
|
||
margin-bottom: 12px;
|
||
}
|
||
|
||
header p {
|
||
font-size: 16px;
|
||
opacity: 0.9;
|
||
}
|
||
|
||
.tabs {
|
||
background: var(--card-bg);
|
||
border-radius: var(--radius-lg);
|
||
box-shadow: var(--shadow-md);
|
||
margin: 30px auto;
|
||
max-width: 900px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.tab-buttons {
|
||
display: flex;
|
||
border-bottom: 2px solid var(--border);
|
||
}
|
||
|
||
.tab-btn {
|
||
flex: 1;
|
||
padding: 16px 24px;
|
||
background: none;
|
||
border: none;
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
color: var(--text-light);
|
||
cursor: pointer;
|
||
transition: all 0.3s ease;
|
||
position: relative;
|
||
}
|
||
|
||
.tab-btn:hover {
|
||
background-color: var(--background);
|
||
}
|
||
|
||
.tab-btn.active {
|
||
color: var(--primary);
|
||
}
|
||
|
||
.tab-btn.active::after {
|
||
content: '';
|
||
position: absolute;
|
||
bottom: -2px;
|
||
left: 0;
|
||
right: 0;
|
||
height: 2px;
|
||
background-color: var(--primary);
|
||
}
|
||
|
||
.tab-content {
|
||
display: none;
|
||
padding: 30px;
|
||
animation: fadeIn 0.3s ease;
|
||
}
|
||
|
||
.tab-content.active {
|
||
display: block;
|
||
}
|
||
|
||
@keyframes fadeIn {
|
||
from {
|
||
opacity: 0;
|
||
transform: translateY(10px);
|
||
}
|
||
to {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
}
|
||
}
|
||
|
||
.section {
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 20px;
|
||
font-weight: 700;
|
||
color: var(--text);
|
||
margin-bottom: 16px;
|
||
padding-bottom: 8px;
|
||
border-bottom: 2px solid var(--primary);
|
||
display: inline-block;
|
||
}
|
||
|
||
.subsection-title {
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
color: var(--text);
|
||
margin: 20px 0 12px 0;
|
||
}
|
||
|
||
.paragraph {
|
||
font-size: 15px;
|
||
color: var(--text-light);
|
||
margin-bottom: 16px;
|
||
line-height: 1.8;
|
||
}
|
||
|
||
.bullet-list {
|
||
list-style: none;
|
||
margin: 16px 0;
|
||
}
|
||
|
||
.bullet-list li {
|
||
position: relative;
|
||
padding-left: 24px;
|
||
margin-bottom: 12px;
|
||
font-size: 15px;
|
||
color: var(--text-light);
|
||
}
|
||
|
||
.bullet-list li::before {
|
||
content: '•';
|
||
position: absolute;
|
||
left: 8px;
|
||
color: var(--primary);
|
||
font-weight: bold;
|
||
}
|
||
|
||
.permission-card {
|
||
background: var(--background);
|
||
border: 1px solid var(--border);
|
||
border-radius: var(--radius-md);
|
||
padding: 16px;
|
||
margin-bottom: 12px;
|
||
}
|
||
|
||
.permission-card h4 {
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: var(--text);
|
||
margin-bottom: 6px;
|
||
}
|
||
|
||
.permission-card p {
|
||
font-size: 14px;
|
||
color: var(--text-light);
|
||
}
|
||
|
||
.contact-info {
|
||
background: var(--background);
|
||
border-radius: var(--radius-md);
|
||
padding: 20px;
|
||
margin: 20px 0;
|
||
}
|
||
|
||
.contact-item {
|
||
display: flex;
|
||
margin-bottom: 12px;
|
||
}
|
||
|
||
.contact-label {
|
||
font-weight: 600;
|
||
min-width: 100px;
|
||
color: var(--text);
|
||
}
|
||
|
||
.contact-value {
|
||
color: var(--text-light);
|
||
}
|
||
|
||
.update-date {
|
||
font-size: 13px;
|
||
color: var(--text-light);
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.highlight {
|
||
color: var(--primary);
|
||
font-weight: 600;
|
||
}
|
||
|
||
.footer {
|
||
text-align: center;
|
||
padding: 30px 20px;
|
||
color: var(--text-light);
|
||
font-size: 14px;
|
||
}
|
||
|
||
@media (max-width: 768px) {
|
||
header h1 {
|
||
font-size: 24px;
|
||
}
|
||
|
||
.tab-content {
|
||
padding: 20px;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 18px;
|
||
}
|
||
|
||
.paragraph {
|
||
font-size: 14px;
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<h1>📜 情景诗词</h1>
|
||
<p>隐私政策与用户协议</p>
|
||
</header>
|
||
|
||
<div class="container">
|
||
<div class="tabs">
|
||
<div class="tab-buttons">
|
||
<button class="tab-btn active" onclick="switchTab('privacy')">隐私政策</button>
|
||
<button class="tab-btn" onclick="switchTab('agreement')">用户协议</button>
|
||
</div>
|
||
|
||
<div id="privacy" class="tab-content active">
|
||
<div class="section">
|
||
<h2 class="section-title">关于情景诗词与隐私的声明</h2>
|
||
<p class="update-date">更新日期:2026.3.26</p>
|
||
<p class="paragraph">
|
||
<span class="highlight">情景诗词</span> 是由 <span class="highlight">*****工作室</span> (以下简称"我们")为您提供的,用于在诗词里旅行,在文化中生长的应用。本隐私声明由我们为处理您的个人信息而制定。
|
||
</p>
|
||
<p class="paragraph">
|
||
我们非常重视您的个人信息和隐私保护,将会按照法律要求和业界成熟的安全标准,为您的个人信息提供相应的安全保护措施。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">1. 我们如何收集和使用您的个人信息</h2>
|
||
<p class="paragraph">
|
||
我们仅在有合法性基础的情形下才会使用您的个人信息。根据适用的法律,我们可能会基于您的同意、为履行/订立您与我们的合同所必需、履行法定义务所必需等合法性基础,使用您的个人信息。
|
||
</p>
|
||
|
||
<h3 class="subsection-title">1.1 基于履行法定义务或其他法律法规规定的情形</h3>
|
||
<p class="paragraph">为了实现应用功能,在获取您的同意后我们需要收集您的以下信息:</p>
|
||
<ul class="bullet-list">
|
||
<li>本地笔记数据,用于保存您创建的诗词笔记</li>
|
||
<li>点赞记录,用于展示您收藏的诗词</li>
|
||
<li>历史记录,用于记录您浏览过的诗词</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">2. 设备权限调用</h2>
|
||
<div class="permission-card">
|
||
<h4>📱 存储权限</h4>
|
||
<p>用于保存和读取您的笔记、收藏等本地数据</p>
|
||
</div>
|
||
<div class="permission-card">
|
||
<h4>🌐 网络权限</h4>
|
||
<p>用于获取诗词内容和更新应用信息</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">3. 管理您的个人信息</h2>
|
||
<p class="paragraph">
|
||
如您对您的数据主体权利有进一步要求或存在任何疑问、意见或建议,可通过本声明中"如何联系我们"章节中所述方式与我们取得联系,并行使您的相关权利。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">4. 信息存储地点及期限</h2>
|
||
<p class="paragraph">
|
||
<strong>4.1</strong> 我们承诺,除法律法规另有规定外,我们对您的信息的保存期限应当为实现处理目的所必要的最短时间。
|
||
</p>
|
||
<p class="paragraph">
|
||
<strong>4.2</strong> 上述信息将会传输并保存至中国境内的服务器。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">5. 如何联系我们</h2>
|
||
<p class="paragraph">您可通过以下方式联系我们,并行使您的相关权利,我们会尽快回复。</p>
|
||
<div class="contact-info">
|
||
<div class="contact-item">
|
||
<span class="contact-label">开发者:</span>
|
||
<span class="contact-value">*****工作室</span>
|
||
</div>
|
||
<div class="contact-item">
|
||
<span class="contact-label">地址:</span>
|
||
<span class="contact-value">云南昆明</span>
|
||
</div>
|
||
<div class="contact-item">
|
||
<span class="contact-label">邮箱:</span>
|
||
<span class="contact-value">********@outlook.com</span>
|
||
</div>
|
||
</div>
|
||
<p class="paragraph">
|
||
如果您对我们的回复不满意,特别是当个人信息处理行为损害了您的合法权益时,您还可以通过向有管辖权的人民法院提起诉讼、向行业自律协会或政府相关管理机构投诉等外部途径进行解决。您也可以向我们了解可能适用的相关投诉途径的信息。
|
||
</p>
|
||
</div>
|
||
|
||
<p class="update-date" style="margin-top: 30px;">
|
||
<strong>生效日期:2026年3月26日</strong>
|
||
</p>
|
||
</div>
|
||
|
||
<div id="agreement" class="tab-content">
|
||
<div class="section">
|
||
<h2 class="section-title">用户协议</h2>
|
||
<p class="update-date">生效日期:2026-03-26</p>
|
||
<p class="paragraph">
|
||
欢迎使用 <span class="highlight">情景诗词</span>(以下简称"本App")。本用户协议由个人开发者 <span class="highlight">*****工作室</span> 制定。用户在下载、安装、注册、登录、使用本App服务前,应当仔细阅读并充分理解本协议内容。用户开始使用本App,即视为同意本协议全部条款。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">一、协议适用范围</h2>
|
||
<p class="paragraph">
|
||
本协议适用于用户与开发者 <span class="highlight">*****工作室</span> 之间,关于用户使用 <span class="highlight">情景诗词</span> 产品及服务所建立的权利义务关系。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">二、服务内容</h2>
|
||
<p class="paragraph">
|
||
<span class="highlight">情景诗词</span> 主要提供诗词浏览、收藏、笔记记录、历史记录等功能。具体服务内容以应用内实际展示为准,开发者可根据产品运营情况进行功能优化、升级和调整。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">三、账号与安全</h2>
|
||
<p class="paragraph">
|
||
您应当确保使用本App时遵守相关法律法规。本App目前不需要注册账号,您的本地数据存储在您的设备上,请妥善保管您的设备。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">四、用户行为规范</h2>
|
||
<p class="paragraph">
|
||
用户在使用本App过程中,应当遵守中华人民共和国法律法规,不得利用本App从事违法违规行为,不得发布或传播侵犯他人合法权益的内容,不得实施影响本App安全和稳定运行的行为。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">五、知识产权</h2>
|
||
<p class="paragraph">
|
||
用户知悉并认可,本App(含程序代码、界面设计、功能及其更新、扩展、修复版本)相关权利均归开发者或合法权利人所有。
|
||
</p>
|
||
<p class="paragraph">
|
||
本条所称"知识产权"包括但不限于著作权、商标权、专利权、商业秘密及反不正当竞争法等法律法规项下的一切相关权利。
|
||
</p>
|
||
<p class="paragraph">
|
||
除法律法规另有规定或开发者书面授权外,用户仅获得基于本协议的个人、非独占、不可转让、可撤销的使用许可;用户不得对本App实施复制、修改、改编、翻译、出租、出借、出售、传播、反向工程、反编译、反汇编,或以其他方式尝试获取源代码。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">六、责任限制</h2>
|
||
<p class="paragraph">
|
||
在法律允许范围内,对于因网络异常、设备故障、不可抗力、第三方服务异常等原因导致的服务中断或数据损失,开发者将在能力范围内及时修复或补救,但不承担超出法定范围的责任。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">七、协议更新</h2>
|
||
<p class="paragraph">
|
||
开发者有权根据业务变化、监管要求或法律法规变化更新本协议。更新后的协议将在应用内公示,用户继续使用本App即视为接受更新后的协议内容。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">八、适用法律与争议解决</h2>
|
||
<p class="paragraph">
|
||
本协议适用中华人民共和国法律。因本协议引发的争议,双方应先友好协商;协商不成的,提交被告住所地有管辖权的人民法院处理。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2 class="section-title">九、联系方式</h2>
|
||
<div class="contact-info">
|
||
<div class="contact-item">
|
||
<span class="contact-label">开发者:</span>
|
||
<span class="contact-value">*****工作室</span>
|
||
</div>
|
||
<div class="contact-item">
|
||
<span class="contact-label">应用名称:</span>
|
||
<span class="contact-value">情景诗词</span>
|
||
</div>
|
||
<div class="contact-item">
|
||
<span class="contact-label">联系邮箱:</span>
|
||
<span class="contact-value">********@outlook.com</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer">
|
||
<p>© 2026 情景诗词 - *****工作室</p>
|
||
<p style="margin-top: 8px; font-size: 12px;">在诗词里旅行,在文化中生长</p>
|
||
</div>
|
||
|
||
<script>
|
||
function switchTab(tabName) {
|
||
const tabContents = document.querySelectorAll('.tab-content');
|
||
const tabButtons = document.querySelectorAll('.tab-btn');
|
||
|
||
tabContents.forEach(content => {
|
||
content.classList.remove('active');
|
||
});
|
||
|
||
tabButtons.forEach(button => {
|
||
button.classList.remove('active');
|
||
});
|
||
|
||
document.getElementById(tabName).classList.add('active');
|
||
event.target.classList.add('active');
|
||
}
|
||
</script>
|
||
</body>
|
||
</html>
|