Skip to content

Commit 5bd4497

Browse files
Woahai321Woahai321
authored
🏁 ✅ Final v0.4.3
Adding HTML admin panel
1 parent cdbaa99 commit 5bd4497

File tree

1 file changed

+237
-0
lines changed

1 file changed

+237
-0
lines changed

‎index.html

Lines changed: 237 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,237 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>SeerrBridge Admin Panel</title>
7+
<style>
8+
/* General Styles */
9+
body {
10+
font-family: 'Arial', sans-serif;
11+
margin: 0;
12+
padding: 0;
13+
background: linear-gradient(135deg, #6a11cb, #2575fc);
14+
color: #fff;
15+
display: flex;
16+
justify-content: center;
17+
align-items: center;
18+
min-height: 100vh;
19+
}
20+
21+
.container {
22+
background: rgba(255, 255, 255, 0.1);
23+
backdrop-filter: blur(10px);
24+
border-radius: 15px;
25+
padding: 30px;
26+
width: 40%;
27+
max-width: 800px;
28+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
29+
margin: 50px;
30+
}
31+
32+
.container img {
33+
width: 100%;
34+
border-radius: 15px 15px 0 0; /* Rounded top corners */
35+
margin-bottom: 20px; /* Space between image and content */
36+
}
37+
38+
h1 {
39+
font-size: 2.5rem;
40+
margin-bottom: 10px;
41+
color: #fff;
42+
text-align: center;
43+
}
44+
45+
h2, h3 {
46+
font-size: 1.5rem;
47+
margin-bottom: 20px;
48+
color: #e0e0e0;
49+
text-align: center;
50+
}
51+
52+
.env-vars {
53+
margin-top: 20px;
54+
}
55+
56+
.env-var {
57+
background: rgba(255, 255, 255, 0.1);
58+
padding: 15px;
59+
border-radius: 10px;
60+
margin-bottom: 10px;
61+
display: flex;
62+
justify-content: space-between;
63+
align-items: center;
64+
transition: transform 0.2s ease, box-shadow 0.2s ease;
65+
}
66+
67+
.env-var:hover {
68+
transform: translateY(-5px);
69+
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
70+
}
71+
72+
.env-var label {
73+
font-weight: bold;
74+
color: #fff;
75+
}
76+
77+
.env-var .value {
78+
color: #e0e0e0;
79+
font-family: 'Courier New', Courier, monospace;
80+
}
81+
82+
.env-var .valid {
83+
color: #4caf50;
84+
}
85+
86+
.env-var .invalid {
87+
color: #f44336;
88+
}
89+
90+
/* Responsive Design */
91+
@media (max-width: 1086px) {
92+
h1 {
93+
font-size: 2rem;
94+
}
95+
96+
h2, h3 {
97+
font-size: 1.2rem;
98+
}
99+
100+
.env-var {
101+
flex-direction: column;
102+
align-items: flex-start;
103+
}
104+
105+
.env-var .value {
106+
margin-top: 5px;
107+
}
108+
}
109+
/* Responsive Design */
110+
@media (max-width: 1086px) {
111+
.container {
112+
width: 95%; /* Wider container for smaller screens */
113+
padding: 20px; /* Reduced padding */
114+
margin: 10px; /* Reduced margin */
115+
}
116+
117+
h1 {
118+
font-size: 2rem; /* Smaller font size for headings */
119+
}
120+
121+
h2, h3 {
122+
font-size: 1.2rem; /* Smaller font size for subheadings */
123+
}
124+
125+
.env-var {
126+
flex-direction: column; /* Stack label and value vertically */
127+
align-items: flex-start;
128+
}
129+
130+
.env-var .value {
131+
margin-top: 5px; /* Space between label and value */
132+
}
133+
}
134+
135+
@media (max-width: 480px) {
136+
h1 {
137+
font-size: 1.8rem; /* Even smaller font size for very small screens */
138+
}
139+
140+
h2, h3 {
141+
font-size: 1rem; /* Smaller font size for subheadings */
142+
}
143+
144+
.env-var {
145+
padding: 10px; /* Reduced padding */
146+
}
147+
148+
.env-var label {
149+
font-size: 0.9rem; /* Smaller font size for labels */
150+
}
151+
152+
.env-var .value {
153+
font-size: 0.9rem; /* Smaller font size for values */
154+
}
155+
}
156+
</style>
157+
</head>
158+
<body>
159+
<div class="container">
160+
<!-- Add the image here -->
161+
<img src="https://private-user-images.githubusercontent.com/115117306/380367027-653eae72-538a-4648-b132-04faae3fb82e.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MzU5NjIxNTksIm5iZiI6MTczNTk2MTg1OSwicGF0aCI6Ii8xMTUxMTczMDYvMzgwMzY3MDI3LTY1M2VhZTcyLTUzOGEtNDY0OC1iMTMyLTA0ZmFhZTNmYjgyZS5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjUwMTA0JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI1MDEwNFQwMzM3MzlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT1iZmU0ZGY4NWY5MTY0ODYwZGNmYmUzYTJiNTUyM2YzMzVmOWU3M2FkNzdmNGNhN2I2MGI2YWM1NmFlNTIwOWUwJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCJ9.eJs1VvO77_P3_G7H9IiDXg0vC74vyJtZXg-DKtMri_0" alt="SeerrBridge Logo">
162+
<h1>SeerrBridge is Running!</h1>
163+
<h2>Not much to see here. Check the terminal for more information.</h2>
164+
<h3>This is only an API endpoint for the Overseerr Webhook!</h3>
165+
<div class="env-vars">
166+
<!-- Sensitive information -->
167+
<div class="env-var">
168+
<label>RD_ACCESS_TOKEN:</label>
169+
<span class="value" id="rd-access-token"></span>
170+
</div>
171+
<div class="env-var">
172+
<label>RD_REFRESH_TOKEN:</label>
173+
<span class="value" id="rd-refresh-token"></span>
174+
</div>
175+
<div class="env-var">
176+
<label>RD_CLIENT_ID:</label>
177+
<span class="value" id="rd-client-id"></span>
178+
</div>
179+
<div class="env-var">
180+
<label>RD_CLIENT_SECRET:</label>
181+
<span class="value" id="rd-client-secret"></span>
182+
</div>
183+
<div class="env-var">
184+
<label>OVERSEERR_API_KEY:</label>
185+
<span class="value" id="overseerr-api-key"></span>
186+
</div>
187+
<div class="env-var">
188+
<label>TRAKT_API_KEY:</label>
189+
<span class="value" id="trakt-api-key"></span>
190+
</div>
191+
<!-- Non-sensitive information -->
192+
<div class="env-var">
193+
<label>HEADLESS_MODE:</label>
194+
<span class="value" id="headless-mode"></span>
195+
</div>
196+
<div class="env-var">
197+
<label>ENABLE_AUTOMATIC_BACKGROUND_TASK:</label>
198+
<span class="value" id="enable-automatic-background-task"></span>
199+
</div>
200+
<div class="env-var">
201+
<label>TORRENT_FILTER_REGEX:</label>
202+
<span class="value" id="torrent-filter-regex"></span>
203+
</div>
204+
<div class="env-var">
205+
<label>REFRESH_INTERVAL_MINUTES:</label>
206+
<span class="value" id="refresh-interval-minutes"></span>
207+
</div>
208+
<!-- URL check -->
209+
<div class="env-var">
210+
<label>OVERSEERR_BASE:</label>
211+
<span class="value" id="overseerr-base"></span>
212+
</div>
213+
</div>
214+
</div>
215+
<script>
216+
async function fetchEnvVars() {
217+
const response = await fetch('/env-vars');
218+
const data = await response.json();
219+
// Sensitive information
220+
document.getElementById('rd-access-token').textContent = data.RD_ACCESS_TOKEN;
221+
document.getElementById('rd-refresh-token').textContent = data.RD_REFRESH_TOKEN;
222+
document.getElementById('rd-client-id').textContent = data.RD_CLIENT_ID;
223+
document.getElementById('rd-client-secret').textContent = data.RD_CLIENT_SECRET;
224+
document.getElementById('overseerr-api-key').textContent = data.OVERSEERR_API_KEY;
225+
document.getElementById('trakt-api-key').textContent = data.TRAKT_API_KEY;
226+
// Non-sensitive information
227+
document.getElementById('headless-mode').textContent = data.HEADLESS_MODE;
228+
document.getElementById('enable-automatic-background-task').textContent = data.ENABLE_AUTOMATIC_BACKGROUND_TASK;
229+
document.getElementById('torrent-filter-regex').textContent = data.TORRENT_FILTER_REGEX;
230+
document.getElementById('refresh-interval-minutes').textContent = data.REFRESH_INTERVAL_MINUTES;
231+
// URL check
232+
document.getElementById('overseerr-base').textContent = data.OVERSEERR_BASE;
233+
}
234+
fetchEnvVars();
235+
</script>
236+
</body>
237+
</html>

0 commit comments

Comments
 (0)