keepmove commited on
Commit
b9dcf3b
·
verified ·
1 Parent(s): 722fe0a

Create templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +135 -0
templates/index.html ADDED
@@ -0,0 +1,135 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>Working Proxies</title>
7
+ <style>
8
+ /* 全局基础样式 */
9
+ * {
10
+ margin: 0;
11
+ padding: 0;
12
+ box-sizing: border-box;
13
+ }
14
+
15
+ /* 背景样式 */
16
+ body {
17
+ font-family: Arial, sans-serif;
18
+ margin: 0;
19
+ padding: 0;
20
+ color: #ffffff;
21
+ overflow: hidden;
22
+ background: linear-gradient(135deg, #e74c3c, #c0392b);
23
+ position: relative;
24
+ }
25
+
26
+ /* 封面页特殊样式,带有渐变效果的覆盖 */
27
+ body::before {
28
+ content: '';
29
+ position: absolute;
30
+ width: 200%;
31
+ height: 200%;
32
+ background: rgba(255, 255, 255, 0.1);
33
+ transform: translateX(-50%) translateY(-50%) rotate(-45deg);
34
+ animation: shine 4s infinite linear;
35
+ }
36
+
37
+ @keyframes shine {
38
+ 0% { transform: translateX(-50%) translateY(-50%) rotate(-45deg); }
39
+ 100% { transform: translateX(50%) translateY(50%) rotate(-45deg); }
40
+ }
41
+
42
+ /* 透明内容框,位于页面中央,带有渐入动画 */
43
+ .container {
44
+ background-color: rgba(0, 0, 0, 0.6);
45
+ padding: 20px;
46
+ border-radius: 8px;
47
+ max-width: 800px;
48
+ margin: 50px auto;
49
+ box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
50
+ text-align: center;
51
+ animation: fadeInUp 1s ease-in-out; /* 渐入动画 */
52
+ position: relative;
53
+ z-index: 1;
54
+ }
55
+
56
+ /* 标题样式 */
57
+ h1 {
58
+ font-size: 2.5em;
59
+ margin-bottom: 10px;
60
+ color: #f1f1f1;
61
+ }
62
+
63
+ /* 段落样式 */
64
+ p {
65
+ font-size: 1.2em;
66
+ margin-bottom: 20px;
67
+ color: #f1f1f1;
68
+ }
69
+
70
+ /* 表格样式 */
71
+ table {
72
+ width: 100%;
73
+ border-collapse: collapse;
74
+ margin-top: 20px;
75
+ }
76
+ th, td {
77
+ padding: 12px;
78
+ text-align: left;
79
+ border: 1px solid #444;
80
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
81
+ }
82
+ th {
83
+ background-color: rgba(0, 123, 255, 0.8);
84
+ color: #ffffff;
85
+ }
86
+ td {
87
+ background-color: rgba(255, 255, 255, 0.1);
88
+ color: #e6e6e6;
89
+ }
90
+
91
+ /* 表格行悬停效果 */
92
+ tr:hover td {
93
+ background-color: rgba(0, 123, 255, 0.2);
94
+ transform: scale(1.05);
95
+ box-shadow: 0px 4px 12px rgba(0, 123, 255, 0.4);
96
+ }
97
+
98
+ /* 渐入动画 */
99
+ @keyframes fadeInUp {
100
+ from {
101
+ opacity: 0;
102
+ transform: translateY(20px);
103
+ }
104
+ to {
105
+ opacity: 1;
106
+ transform: translateY(0);
107
+ }
108
+ }
109
+ </style>
110
+ </head>
111
+ <body>
112
+ <div class="container">
113
+ <h1>Working Proxies</h1>
114
+ <p>Total Proxies Found: {{ proxies | length }}</p>
115
+ <table>
116
+ <thead>
117
+ <tr>
118
+ <th>Proxy Address</th>
119
+ <th>Response Time (seconds)</th>
120
+ <th>Country</th>
121
+ </tr>
122
+ </thead>
123
+ <tbody>
124
+ {% for proxy, response_time, country in proxies %}
125
+ <tr>
126
+ <td>{{ proxy }}</td>
127
+ <td>{{ response_time }}</td>
128
+ <td>{{ country }}</td>
129
+ </tr>
130
+ {% endfor %}
131
+ </tbody>
132
+ </table>
133
+ </div>
134
+ </body>
135
+ </html>