61 lines
1.9 KiB
HTML
61 lines
1.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Firefox Focus Mode Settings</title>
|
|
<link rel="stylesheet" href="theme.css">
|
|
<link rel="stylesheet" href="options.css">
|
|
</head>
|
|
<body>
|
|
<main class="options-shell">
|
|
<section class="options-hero">
|
|
<p class="eyebrow">Settings</p>
|
|
<h1>Focus Mode</h1>
|
|
<p class="subtitle">Choose up to four bookmarks and decide which extra blockers should be enabled.</p>
|
|
</section>
|
|
|
|
<form id="settings-form">
|
|
<section class="panel">
|
|
<div class="section-heading">
|
|
<h2>Bookmarks</h2>
|
|
<p>Only four appear on the home page.</p>
|
|
</div>
|
|
|
|
<div id="bookmark-fields" class="bookmark-fields"></div>
|
|
</section>
|
|
|
|
<section class="panel">
|
|
<div class="section-heading">
|
|
<h2>Blocking</h2>
|
|
<p>Tracker blocking is on by default. The other categories are optional.</p>
|
|
</div>
|
|
|
|
<label class="toggle">
|
|
<input type="checkbox" name="trackers">
|
|
<span>Block common trackers</span>
|
|
</label>
|
|
<label class="toggle">
|
|
<input type="checkbox" name="ads">
|
|
<span>Block ads</span>
|
|
</label>
|
|
<label class="toggle">
|
|
<input type="checkbox" name="analytics">
|
|
<span>Block analytics</span>
|
|
</label>
|
|
<label class="toggle">
|
|
<input type="checkbox" name="social">
|
|
<span>Block social widgets</span>
|
|
</label>
|
|
</section>
|
|
|
|
<div class="actions">
|
|
<button type="submit">Save Settings</button>
|
|
<p id="save-status" aria-live="polite"></p>
|
|
</div>
|
|
</form>
|
|
</main>
|
|
|
|
<script src="options.js"></script>
|
|
</body>
|
|
</html>
|