pranit144 commited on
Commit
fd7abdd
Β·
verified Β·
1 Parent(s): e48c9ca

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +146 -19
index.html CHANGED
@@ -1,19 +1,146 @@
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="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>API Analysis Models</title>
7
+ <style>
8
+ body {
9
+ font-family: "Georgia", serif;
10
+ max-width: 1000px;
11
+ margin: 0 auto;
12
+ padding: 30px;
13
+ background-color: #f9f7f4;
14
+ color: #333;
15
+ }
16
+
17
+ .header {
18
+ text-align: center;
19
+ margin-bottom: 40px;
20
+ border-bottom: 2px solid #8b7d6b;
21
+ padding-bottom: 20px;
22
+ }
23
+
24
+ h1 {
25
+ font-size: 36px;
26
+ color: #5c4b3e;
27
+ font-weight: normal;
28
+ letter-spacing: 1px;
29
+ }
30
+
31
+ .model-container {
32
+ display: grid;
33
+ grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
34
+ gap: 25px;
35
+ }
36
+
37
+ .model-card {
38
+ background-color: #fff;
39
+ border: 1px solid #d3c7b6;
40
+ border-radius: 5px;
41
+ padding: 25px;
42
+ box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.05);
43
+ transition: all 0.3s ease;
44
+ position: relative;
45
+ overflow: hidden;
46
+ }
47
+
48
+ .model-card:hover {
49
+ box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.1);
50
+ transform: translateY(-5px);
51
+ }
52
+
53
+ .model-card::after {
54
+ content: "";
55
+ position: absolute;
56
+ top: 0;
57
+ left: 0;
58
+ right: 0;
59
+ height: 5px;
60
+ background: linear-gradient(to right, #8b7d6b, #d3c7b6);
61
+ }
62
+
63
+ .icon {
64
+ font-size: 36px;
65
+ display: block;
66
+ margin-bottom: 15px;
67
+ text-align: center;
68
+ }
69
+
70
+ h2 {
71
+ color: #5c4b3e;
72
+ margin: 0 0 20px 0;
73
+ font-size: 22px;
74
+ text-align: center;
75
+ font-weight: normal;
76
+ }
77
+
78
+ .btn {
79
+ display: inline-block;
80
+ background-color: #8b7d6b;
81
+ color: white;
82
+ border: none;
83
+ border-radius: 3px;
84
+ padding: 12px 0;
85
+ cursor: pointer;
86
+ font-family: "Georgia", serif;
87
+ font-size: 16px;
88
+ text-decoration: none;
89
+ text-align: center;
90
+ width: 100%;
91
+ transition: background-color 0.3s;
92
+ margin-top: 10px;
93
+ }
94
+
95
+ .btn:hover {
96
+ background-color: #5c4b3e;
97
+ }
98
+
99
+ .time-series {
100
+ background-color: #f4f1e9;
101
+ }
102
+ </style>
103
+ </head>
104
+ <body>
105
+ <div class="header">
106
+ <h1>API Analysis Models</h1>
107
+ </div>
108
+
109
+ <div class="model-container">
110
+ <!-- Regression Card -->
111
+ <div class="model-card">
112
+ <span class="icon">πŸ“Š</span>
113
+ <h2>Response Time</h2>
114
+ <a href="https://pranit144-detect1.hf.space" class="btn">Select</a>
115
+ </div>
116
+
117
+ <!-- Anomaly Detection Card -->
118
+ <div class="model-card">
119
+ <span class="icon">πŸ”₯</span>
120
+ <h2>Anomaly Detection</h2>
121
+ <a href="https://pranit144-detect2.hf.space" class="btn">Select</a>
122
+ </div>
123
+
124
+ <!-- Binary Classification Card -->
125
+ <div class="model-card">
126
+ <span class="icon">βœ…</span>
127
+ <h2>Error Prediction</h2>
128
+ <a href="#binary" class="btn">Select</a>
129
+ </div>
130
+
131
+ <!-- Multi-Class Classification Card -->
132
+ <div class="model-card">
133
+ <span class="icon">πŸ“¦</span>
134
+ <h2>Status Code</h2>
135
+ <a href="#multiclass" class="btn">Select</a>
136
+ </div>
137
+
138
+ <!-- Time Series Card -->
139
+ <div class="model-card time-series">
140
+ <span class="icon">πŸ“ˆ</span>
141
+ <h2>Time Series</h2>
142
+ <a href="#timeseries" class="btn">Select</a>
143
+ </div>
144
+ </div>
145
+ </body>
146
+ </html>