blob: 0f4ba9b3a974d4d790642107b04f04adb5650b9b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ZenInternet - Advanced Settings</title>
<link rel="stylesheet" href="../theme.css">
<link rel="stylesheet" href="../popup/popup.css">
<link rel="stylesheet" href="data-viewer.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body>
<div class="container">
<header class="app-header">
<div id="header-container">
<div class="logo-container">
<img src="../assets/images/logo.png" alt="ZenInternet Logo" class="logo-img">
<h1 class="app-title">Zen Internet Settings</h1>
</div>
<div class="miniheader">
<div id="addon-version" class="addon-version"></div>
<div class="author">by <a href="https://www.sameerasw.com/" target="_blank">@sameerasw</a></div>
</div>
</div>
</header>
<main class="app-content">
<!-- Backup & Restore section moved to top -->
<div class="data-section">
<h2 class="section-title">Backup & Restore ✨</h2>
<div class="backup-restore-container">
<p class="backup-description">
Export your settings to a JSON file or import settings from a previously exported file.
<br><strong>Note:</strong> This includes global settings, website lists, and website-specific
feature toggles, but not the actual style data which will be re-fetched.
</p>
<div class="backup-actions">
<button id="export-settings" class="action-button primary">
<i class="fas fa-upload"></i> Export Settings
</button>
<div class="import-container">
<label for="import-file" class="action-button secondary import-label">
<i class="fas fa-download"></i> Import Settings
</label>
<input type="file" id="import-file" accept=".json" hidden>
</div>
</div>
<div id="import-status" class="import-status"></div>
</div>
</div>
<!-- Global toggles grouped into a single section with a heading -->
<div class="data-section">
<h2 class="section-title">Global Feature Controls ✨</h2>
<div class="global-toggles-container">
<div class="toggle-row">
<div class="toggle-container">
<label class="toggle-switch">
<input type="checkbox" id="disable-transparency">
<span class="slider round"></span>
</label>
<span class="toggle-label">Disable Transparency</span>
</div>
<div class="toggle-container">
<label class="toggle-switch">
<input type="checkbox" id="disable-hover">
<span class="slider round"></span>
</label>
<span class="toggle-label">Disable Hover Effects</span>
</div>
<div class="toggle-container">
<label class="toggle-switch">
<input type="checkbox" id="disable-footer">
<span class="slider round"></span>
</label>
<span class="toggle-label">Keep Footers</span>
</div>
</div>
<div class="setting-description">
These settings control specific feature types across all websites.
Changes apply only to newly opened or reloaded tabs.
</div>
</div>
</div>
<div class="data-section">
<h2 class="section-title">Global Settings</h2>
<div id="global-settings-data" class="data-container"></div>
</div>
<div class="data-section">
<h2 class="section-title">Skip/Enable List</h2>
<div id="skip-list-data" class="data-container"></div>
</div>
<!-- Repository URL section moved above danger zone -->
<div class="data-section">
<h2 class="section-title">Custom Styles Repository ✨</h2>
<div class="repository-url-container">
<p class="setting-description">
Change the URL where styles are fetched from. Use this if you want to use a different styles
repository.
<br><strong>Note:</strong> After changing the URL, you should clear existing styles data for
best results.
</p>
<div class="repository-url-controls">
<input type="text" id="repository-url" class="repository-url-input"
placeholder="Enter repository URL...">
<div class="repository-url-buttons">
<button id="set-repository-url" class="action-button primary">
<i class="fas fa-save"></i> Set URL
</button>
<button id="reset-repository-url" class="action-button secondary">
<i class="fas fa-undo"></i> Reset to Default
</button>
</div>
</div>
<div id="repository-url-status" class="repository-url-status"></div>
</div>
</div>
<div class="danger-zone">
<h3 class="danger-title">Danger Zone</h3>
<div class="danger-actions">
<button id="delete-all-data" class="action-button danger">
<i class="fas fa-trash"></i> Delete All Data
</button>
</div>
</div>
<div class="data-section">
<h2 class="section-title">Websites and CSS</h2>
<div id="combined-websites-data" class="data-container"></div>
</div>
<footer class="app-footer">
<a href="https://sameerasw.github.io/my-internet/" class="footer-link" target="_blank">
<i class="fas fa-book"></i> Styles Repository
</a>
<div class="footer-divider"></div>
<a href="https://github.com/sameerasw/zeninternet" class="footer-link" target="_blank">
<i class="fa-brands fa-github"></i> Project Repository
</a>
</footer>
</main>
</div>
<script src="data-viewer.js"></script>
</body>
</html>
|
