browser-plugin-creator
Version:
A modern scaffolding tool for creating browser extensions with ease
92 lines (83 loc) • 2.91 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>{{name}} - 选项</title>
<link rel="stylesheet" href="options.css">
</head>
<body>
<div class="container">
<header>
<h1>{{name}} 设置</h1>
<p class="subtitle">自定义扩展功能和行为</p>
</header>
<main>
<section class="setting-group">
<h2>常规设置</h2>
<div class="setting-item">
<label>
<input type="checkbox" id="auto-start">
<span class="checkmark"></span>
自动启动分析
</label>
<p class="description">打开页面时自动开始分析</p>
</div>
<div class="setting-item">
<label>
<input type="checkbox" id="show-notifications">
<span class="checkmark"></span>
显示通知
</label>
<p class="description">在操作完成时显示系统通知</p>
</div>
<div class="setting-item">
<label>
<input type="checkbox" id="dark-mode">
<span class="checkmark"></span>
深色模式
</label>
<p class="description">使用深色主题界面</p>
</div>
</section>
<section class="setting-group">
<h2>分析设置</h2>
<div class="setting-item">
<label for="analysis-depth">分析深度:</label>
<select id="analysis-depth">
<option value="basic">基础</option>
<option value="standard">标准</option>
<option value="deep">深度</option>
</select>
<p class="description">选择页面分析的详细程度</p>
</div>
<div class="setting-item">
<label for="auto-save-interval">自动保存间隔:</label>
<select id="auto-save-interval">
<option value="0">禁用</option>
<option value="30">30秒</option>
<option value="60">1分钟</option>
<option value="300">5分钟</option>
</select>
<p class="description">自动保存分析结果的频率</p>
</div>
</section>
<section class="setting-group">
<h2>数据导出</h2>
<div class="setting-item">
<button id="export-settings" class="btn">导出设置</button>
<button id="import-settings" class="btn">导入设置</button>
<input type="file" id="import-file" accept=".json" style="display: none;">
</div>
<div class="setting-item">
<button id="reset-settings" class="btn danger">重置所有设置</button>
</div>
</section>
</main>
<footer>
<button id="save-options" class="btn primary">保存设置</button>
<span id="save-status" class="status"></span>
</footer>
</div>
<script src="options.js"></script>
</body>
</html>