Files changed (1) hide show
  1. index.html +116 -17
index.html CHANGED
@@ -1,19 +1,118 @@
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" />
6
+ <title>Neural Playground</title>
7
+
8
+ <style>
9
+ * {
10
+ margin: 0;
11
+ padding: 0;
12
+ box-sizing: border-box;
13
+ font-family: "Segoe UI", sans-serif;
14
+ }
15
+
16
+ body {
17
+ height: 100vh;
18
+ background: radial-gradient(circle at 20% 20%, #1a1a2e, #0f0f1a 60%);
19
+ color: #fff;
20
+ overflow: hidden;
21
+ display: flex;
22
+ align-items: center;
23
+ justify-content: center;
24
+ }
25
+
26
+ .background-grid {
27
+ position: absolute;
28
+ width: 200%;
29
+ height: 200%;
30
+ background-image: linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
31
+ linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
32
+ background-size: 40px 40px;
33
+ animation: moveGrid 20s linear infinite;
34
+ }
35
+
36
+ @keyframes moveGrid {
37
+ from { transform: translate(0, 0); }
38
+ to { transform: translate(-40px, -40px); }
39
+ }
40
+
41
+ .card {
42
+ position: relative;
43
+ background: rgba(255,255,255,0.05);
44
+ backdrop-filter: blur(15px);
45
+ padding: 40px;
46
+ border-radius: 20px;
47
+ width: 400px;
48
+ text-align: center;
49
+ box-shadow: 0 0 40px rgba(0,255,255,0.2);
50
+ transition: 0.3s ease;
51
+ }
52
+
53
+ .card:hover {
54
+ transform: scale(1.03);
55
+ box-shadow: 0 0 60px rgba(0,255,255,0.4);
56
+ }
57
+
58
+ h1 {
59
+ margin-bottom: 15px;
60
+ font-size: 26px;
61
+ }
62
+
63
+ p {
64
+ opacity: 0.8;
65
+ margin-bottom: 20px;
66
+ }
67
+
68
+ button {
69
+ background: linear-gradient(45deg, #00f5ff, #7b2ff7);
70
+ border: none;
71
+ padding: 10px 20px;
72
+ border-radius: 25px;
73
+ color: #fff;
74
+ cursor: pointer;
75
+ font-size: 14px;
76
+ transition: 0.3s;
77
+ }
78
+
79
+ button:hover {
80
+ opacity: 0.8;
81
+ }
82
+
83
+ #message {
84
+ margin-top: 15px;
85
+ font-size: 14px;
86
+ opacity: 0.9;
87
+ }
88
+ </style>
89
+ </head>
90
+
91
+ <body>
92
+ <div class="background-grid"></div>
93
+
94
+ <div class="card">
95
+ <h1>Neural Playground</h1>
96
+ <p>This is not just a static Space.
97
+ This is your experimental AI lab.</p>
98
+ <button onclick="generateThought()">Generate Random Thought</button>
99
+ <div id="message"></div>
100
+ </div>
101
+
102
+ <script>
103
+ const thoughts = [
104
+ "Your GPU is judging your prompt engineering.",
105
+ "Somewhere, a neural net is overfitting.",
106
+ "The model understood you. That is concerning.",
107
+ "Entropy is just creativity without supervision.",
108
+ "Silicon dreams in matrix form."
109
+ ];
110
+
111
+ function generateThought() {
112
+ const random = thoughts[Math.floor(Math.random() * thoughts.length)];
113
+ document.getElementById("message").innerText = random;
114
+ }
115
+ </script>
116
+
117
+ </body>
118
  </html>