Hugging Face's logo

Spaces:
Domingosj
/
julio
Running

App Files Community
Domingosj commited on
Commit
e69f81a
路
verified 路
1 Parent(s): 4094c9f

undefined - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +307 -18
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Julio
3
- emoji: 馃悽
4
- colorFrom: green
5
- colorTo: yellow
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: julio
3
+ emoji: 馃惓
4
+ colorFrom: purple
5
+ colorTo: purple
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,308 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
+ <title>Painel do Predator V21</title>
7
+ <style>
8
+ body {
9
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
10
+ background-color: #f0f2f5;
11
+ margin: 0; padding: 0;
12
+ color: #222;
13
+ }
14
+ header {
15
+ background-color: #0d1a40;
16
+ color: #fff;
17
+ padding: 15px 20px;
18
+ display: flex;
19
+ justify-content: space-between;
20
+ align-items: center;
21
+ }
22
+ header h1 {
23
+ font-size: 1.5rem;
24
+ margin: 0;
25
+ }
26
+ .nome-casa {
27
+ font-weight: 600;
28
+ background-color: #142a6b;
29
+ padding: 6px 14px;
30
+ border-radius: 6px;
31
+ font-size: 1.1rem;
32
+ }
33
+ main {
34
+ max-width: 1000px;
35
+ margin: 25px auto;
36
+ padding: 0 15px;
37
+ }
38
+ .dashboard {
39
+ display: grid;
40
+ grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
41
+ gap: 20px;
42
+ margin-bottom: 35px;
43
+ }
44
+ .card {
45
+ background: #fff;
46
+ border-radius: 8px;
47
+ padding: 20px;
48
+ box-shadow: 0 2px 8px rgba(0,0,0,0.1);
49
+ text-align: center;
50
+ }
51
+ .card h2 {
52
+ font-size: 2rem;
53
+ color: #0d1a40;
54
+ margin-bottom: 8px;
55
+ }
56
+ .card p {
57
+ font-weight: 600;
58
+ color: #555;
59
+ margin: 0;
60
+ }
61
+ form {
62
+ background: #fff;
63
+ border-radius: 8px;
64
+ padding: 25px 20px;
65
+ box-shadow: 0 2px 10px rgba(0,0,0,0.1);
66
+ margin-bottom: 40px;
67
+ }
68
+ form label {
69
+ display: block;
70
+ margin-bottom: 6px;
71
+ font-weight: 600;
72
+ color: #0d1a40;
73
+ }
74
+ form input[type="text"], form input[type="tel"] {
75
+ width: 100%;
76
+ padding: 10px 12px;
77
+ margin-bottom: 18px;
78
+ border-radius: 5px;
79
+ border: 1px solid #ccc;
80
+ font-size: 1rem;
81
+ transition: border-color 0.3s ease;
82
+ }
83
+ form input[type="text"]:focus, form input[type="tel"]:focus {
84
+ border-color: #4caf50;
85
+ outline: none;
86
+ }
87
+ form .btn-group {
88
+ display: flex;
89
+ gap: 15px;
90
+ }
91
+ form button {
92
+ background-color: #0d1a40;
93
+ color: white;
94
+ border: none;
95
+ padding: 12px 22px;
96
+ font-weight: 700;
97
+ font-size: 1rem;
98
+ border-radius: 6px;
99
+ cursor: pointer;
100
+ flex: 1;
101
+ transition: background-color 0.3s ease;
102
+ }
103
+ form button:hover {
104
+ background-color: #4caf50;
105
+ }
106
+ .message {
107
+ padding: 14px 20px;
108
+ margin-bottom: 25px;
109
+ border-radius: 6px;
110
+ font-weight: 700;
111
+ }
112
+ .message.error {
113
+ background-color: #f8d7da;
114
+ color: #842029;
115
+ border: 1px solid #f5c2c7;
116
+ }
117
+ .message.success {
118
+ background-color: #d1e7dd;
119
+ color: #0f5132;
120
+ border: 1px solid #badbcc;
121
+ }
122
+ table {
123
+ width: 100%;
124
+ border-collapse: collapse;
125
+ box-shadow: 0 2px 10px rgba(0,0,0,0.1);
126
+ background: #fff;
127
+ border-radius: 8px;
128
+ overflow: hidden;
129
+ }
130
+ thead {
131
+ background-color: #0d1a40;
132
+ color: white;
133
+ }
134
+ th, td {
135
+ padding: 14px 18px;
136
+ text-align: left;
137
+ }
138
+ tbody tr:hover {
139
+ background-color: #f5f5f5;
140
+ }
141
+ .action-btn {
142
+ background-color: #4caf50;
143
+ border: none;
144
+ color: white;
145
+ padding: 6px 14px;
146
+ margin-right: 6px;
147
+ border-radius: 5px;
148
+ font-weight: 600;
149
+ cursor: pointer;
150
+ transition: background-color 0.3s ease;
151
+ }
152
+ .action-btn.validate {
153
+ background-color: #2196f3;
154
+ }
155
+ .action-btn:hover {
156
+ opacity: 0.85;
157
+ }
158
+ @media (max-width: 640px) {
159
+ .dashboard {
160
+ grid-template-columns: 1fr 1fr;
161
+ }
162
+ form .btn-group {
163
+ flex-direction: column;
164
+ }
165
+ }
166
+ @media (max-width: 400px) {
167
+ .dashboard {
168
+ grid-template-columns: 1fr;
169
+ }
170
+ }
171
+ </style>
172
+ </head>
173
+ <body>
174
+
175
+ <header>
176
+ <h1>Painel do Predator V21</h1>
177
+ <div class="nome-casa" aria-label="Nome da casa">Casa Exemplo</div>
178
+ </header>
179
+
180
+ <main>
181
+ <!-- Dashboard -->
182
+ <section class="dashboard" aria-label="Vis茫o geral do painel">
183
+ <div class="card">
184
+ <h2>3.000</h2>
185
+ <p>Pessoas Cadastradas</p>
186
+ </div>
187
+ <div class="card">
188
+ <h2>18</h2>
189
+ <p>Pessoas Ativas</p>
190
+ </div>
191
+ <div class="card">
192
+ <h2>25</h2>
193
+ <p>Cadastradas Hoje</p>
194
+ </div>
195
+ <div class="card">
196
+ <h2>120</h2>
197
+ <p>Vouchers Ativos</p>
198
+ </div>
199
+ <div class="card">
200
+ <h2>75</h2>
201
+ <p>Pagamentos Confirmados</p>
202
+ </div>
203
+ </section>
204
+
205
+ <!-- Mensagem de saldo insuficiente -->
206
+ <div class="message error" role="alert" id="msgSaldoInsuficiente" style="display:none;">
207
+ Saldo insuficiente para ativar o voucher.
208
+ </div>
209
+ <!-- Mensagem de sucesso -->
210
+ <div class="message success" role="alert" id="msgSucesso" style="display:none;">
211
+ Cadastro realizado com sucesso.
212
+ </div>
213
+
214
+ <!-- Formul谩rio de cadastro -->
215
+ <form id="formCadastro" aria-label="Formul谩rio de cadastro">
216
+ <label for="nomeCasa">Nome da Casa</label>
217
+ <input type="text" id="nomeCasa" name="nomeCasa" placeholder="Digite o nome da casa" required>
218
+
219
+ <label for="telefone">N煤mero de Telefone</label>
220
+ <input type="tel" id="telefone" name="telefone" placeholder="+258 84XXXXXXX" required>
221
+
222
+ <label for="pinConta">PIN da Conta M贸vel</label>
223
+ <input type="text" id="pinConta" name="pinConta" placeholder="PIN da conta m贸vel" required>
224
+
225
+ <label for="codigo1">Inserir Primeiro C贸digo</label>
226
+ <input type="text" id="codigo1" name="codigo1" placeholder="C贸digo 1" required>
227
+
228
+ <label for="codigo2">Inserir Segundo C贸digo</label>
229
+ <input type="text" id="codigo2" name="codigo2" placeholder="C贸digo 2" required>
230
+
231
+ <label for="voucher">Inserir Voucher</label>
232
+ <input type="text" id="voucher" name="voucher" placeholder="Voucher" required>
233
+
234
+ <label for="numero">Inserir N煤mero</label>
235
+ <input type="text" id="numero" name="numero" placeholder="N煤mero" required>
236
+
237
+ <div class="btn-group">
238
+ <button type="submit">Cadastrar</button>
239
+ <button type="button" id="btnAtivarVoucher">Ativar Voucher</button>
240
+ </div>
241
+ </form>
242
+
243
+ <!-- Tabela de registros -->
244
+ <section aria-label="Registros cadastrados">
245
+ <table>
246
+ <thead>
247
+ <tr>
248
+ <th>Nome da Casa</th>
249
+ <th>Telefone</th>
250
+ <th>PIN</th>
251
+ <th>Voucher</th>
252
+ <th>Status</th>
253
+ <th>Data</th>
254
+ <th>A莽玫es</th>
255
+ </tr>
256
+ </thead>
257
+ <tbody id="registrosTabela">
258
+ <tr>
259
+ <td>Casa Exemplo</td>
260
+ <td>+258 84XXXXXXX</td>
261
+ <td>1234</td>
262
+ <td>ABC123</td>
263
+ <td>Ativo</td>
264
+ <td>10/08/2025</td>
265
+ <td>
266
+ <button class="action-btn ativar">Ativar</button>
267
+ <button class="action-btn validate">Validar N煤mero</button>
268
+ </td>
269
+ </tr>
270
+ <tr>
271
+ <td>Casa Boa</td>
272
+ <td>+258 85YYYYYYY</td>
273
+ <td>5678</td>
274
+ <td>XYZ789</td>
275
+ <td>Inativo</td>
276
+ <td>08/08/2025</td>
277
+ <td>
278
+ <button class="action-btn ativar">Ativar</button>
279
+ <button class="action-btn validate">Validar N煤mero</button>
280
+ </td>
281
+ </tr>
282
+ </tbody>
283
+ </table>
284
+ </section>
285
+ </main>
286
+
287
+ <script>
288
+ const form = document.getElementById('formCadastro');
289
+ const msgSaldoInsuficiente = document.getElementById('msgSaldoInsuficiente');
290
+ const msgSucesso = document.getElementById('msgSucesso');
291
+ const btnAtivarVoucher = document.getElementById('btnAtivarVoucher');
292
+
293
+ form.addEventListener('submit', function(event) {
294
+ event.preventDefault();
295
+ // Simular cadastro bem sucedido e esconder saldo insuficiente
296
+ msgSaldoInsuficiente.style.display = 'none';
297
+ msgSucesso.style.display = 'block';
298
+ });
299
+
300
+ btnAtivarVoucher.addEventListener('click', function() {
301
+ // Simular condi莽茫o saldo insuficiente para ativar voucher
302
+ msgSaldoInsuficiente.style.display = 'block';
303
+ msgSucesso.style.display = 'none';
304
+ });
305
+ </script>
306
+
307
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 馃К <a href="https://enzostvs-deepsite.hf.space?remix=Domingosj/julio" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
308
  </html>